/* ================================================================
   THPT PHAN ĐÌNH PHÙNG — pdp.css v10  FINAL
   jCarouselLite for .photoroll/.slides-TD is DISABLED in header_global.tpl
   So these widgets now render as plain HTML — styled below.
================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Playfair+Display:wght@600;700&display=swap');

/* ── TOKENS ────────────────────────────────────────────────── */
:root{
  --b:   #1a3a8f;  --bm:  #2854c8;  --bl:  #1976d2;
  --bbg: #eef4ff;  --bbd: #c5d6f8;
  --g:   #f5a623;  --gd:  #d48b08;
  --r:   #c62828;  --rd:  #a01e1e;
  --wh:  #ffffff;  --bg:  #ecf2fa;
  --g50: #f7fafc;  --g100:#f0f4f8;  --g200:#dde6ef;
  --g300:#b8c8d8;  --g400:#8fa3b4;  --g500:#64748b;
  --g600:#475569;  --g700:#2d3f50;  --g800:#1a2a38;  --g900:#0d1a24;
  --f:  'Be Vietnam Pro',system-ui,sans-serif;
  --fh: 'Playfair Display',Georgia,serif;
  --w:  1200px;
  --s1: 0 1px 4px rgba(0,0,0,.07);
  --s2: 0 2px 10px rgba(0,0,0,.10);
  --s3: 0 4px 24px rgba(0,0,0,.13);
  --s4: 0 8px 36px rgba(0,0,0,.17);
}

/* ── RESET ─────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:15px;scroll-behavior:smooth}
body{font-family:var(--f);font-size:.93rem;line-height:1.72;color:var(--g700);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden;min-width:0!important;margin:0!important;padding:0!important}
img{border:0;max-width:100%;height:auto;display:block}
a{text-decoration:none;color:var(--bl);transition:color .15s}
a:hover{color:var(--b)}
ul{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}
h1,h2,h3,h4,h5{line-height:1.25}
input,textarea,select{font-family:inherit}

/* ── SHELL ─────────────────────────────────────────────────── */
#pdp-site{display:flex;flex-direction:column;min-height:100vh}
#pdp-main{flex:1}
.pdp-wrap{max-width:var(--w);margin:0 auto;padding:0 20px;width:100%}

/* ════════════════════════════════════════════════════════════
   TOPBAR
════════════════════════════════════════════════════════════ */
.pdp-topbar{background:#0e2463;padding:5px 0;font-size:.71rem}
.pdp-topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.pdp-topbar-left{display:flex;gap:14px;flex-wrap:wrap;color:rgba(255,255,255,.58)}
.pdp-topbar-left li{display:flex;align-items:center;gap:5px}
.pdp-topbar-left .fas{color:var(--g);font-size:.63rem}
.pdp-topbar-right{display:flex;align-items:center;gap:12px}
.pdp-clock{font-size:.68rem;color:rgba(255,255,255,.38);white-space:nowrap}

ul.catalogTop{display:flex!important;gap:2px;flex-wrap:wrap;float:none!important;margin:0!important;list-style:none!important;padding:0!important}
ul.catalogTop li{float:none!important;padding:0!important}
ul.catalogTop li a{display:block;padding:3px 9px;font-size:.69rem;font-weight:500;color:rgba(255,255,255,.58)!important;border-radius:4px;background:none!important;transition:all .15s}
ul.catalogTop li a:hover{background:rgba(255,255,255,.1)!important;color:var(--g)!important}

/* ════════════════════════════════════════════════════════════
   HEADER
════════════════════════════════════════════════════════════ */
.pdp-header{background:var(--wh);border-bottom:1px solid var(--g200);position:sticky;top:0;z-index:900;transition:box-shadow .25s}
.pdp-header--scrolled{box-shadow:var(--s3)}
.pdp-header-inner{display:flex;align-items:center;gap:16px;min-height:74px;padding-top:10px;padding-bottom:10px}

.pdp-logo{flex-shrink:0}
.pdp-logo h1.logo{float:none!important;margin:0!important;font-size:0;line-height:0}
.pdp-logo h1.logo a{display:flex;align-items:center}
.pdp-logo h1.logo img,
.pdp-logo #box-logo img,
.pdp-logo .logo_list img{height:60px!important;width:auto!important;max-width:none;object-fit:contain}
.pdp-logo #box-logo{width:auto!important;height:auto!important;overflow:visible!important}
.pdp-logo .logo_list{width:auto!important}

.pdp-school-info{flex:1;padding-left:15px;border-left:3px solid var(--bbd);min-width:0}
.pdp-school-dept{font-size:.63rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--g400);margin-bottom:2px}
.pdp-school-name{font-family:var(--fh);font-size:clamp(.88rem,1.3vw,1.18rem);font-weight:700;color:var(--b);line-height:1.2}
.pdp-school-motto{font-size:.69rem;color:var(--bl);margin-top:2px;font-style:italic}

.pdp-header-actions{margin-left:auto;flex-shrink:0}
.pdp-search-form{display:flex;align-items:center;height:38px;background:var(--g100);border:1.5px solid var(--g200);border-radius:99px;overflow:hidden;transition:all .15s}
.pdp-search-form:focus-within{border-color:var(--bl);background:var(--wh);box-shadow:0 0 0 3px rgba(25,118,210,.12)}
.pdp-search-input{flex:1;border:none!important;background:transparent;padding:0 14px;font-size:.82rem;color:var(--g800);outline:none;min-width:155px;height:100%}
.pdp-search-input::placeholder{color:var(--g400)}
.pdp-search-btn{background:var(--bl);color:var(--wh);width:38px;height:38px;display:flex;align-items:center;justify-content:center;font-size:.84rem;border:none;cursor:pointer;flex-shrink:0;transition:background .15s}
.pdp-search-btn:hover{background:var(--b)}

.pdp-burger{display:none;flex-direction:column;gap:5px;padding:8px;border-radius:8px;background:var(--bbg);border:1.5px solid var(--g200);flex-shrink:0}
.pdp-burger span{display:block;width:22px;height:2px;background:var(--b);border-radius:2px;transition:all .25s}
.pdp-burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.pdp-burger.is-open span:nth-child(2){opacity:0;transform:scaleX(0)}
.pdp-burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ════════════════════════════════════════════════════════════
   NAVBAR
════════════════════════════════════════════════════════════ */
.pdp-nav{background:linear-gradient(90deg,var(--b) 0%,var(--bm) 100%)}
.pdp-nav-inner{display:flex;align-items:center;justify-content:space-between;max-width:var(--w);margin:0 auto;padding:0 20px}
.pdp-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:799;backdrop-filter:blur(3px)}
.pdp-overlay.is-show{display:block}

.pdp-nav-menu{flex:1}
.pdp-nav-menu ul.root{display:flex!important;align-items:center;flex-wrap:wrap;float:none!important;list-style:none!important;margin:0!important;padding:0!important;height:auto!important;background:none!important}
.pdp-nav-menu ul.root>li{float:none!important;position:relative;margin:0!important;padding:0!important;white-space:nowrap}
.pdp-nav-menu .m_left,.pdp-nav-menu .m_right,.pdp-nav-menu .space,.pdp-nav-menu .space2{display:none!important}
.pdp-nav-menu .m_center{display:block!important;float:none!important;padding:0!important;height:auto!important;background:none!important}
.pdp-nav-menu ul.root>li>a{display:flex!important;align-items:center;gap:4px;padding:13px 12px!important;font-size:.79rem!important;font-weight:600!important;color:rgba(255,255,255,.93)!important;border-bottom:3px solid transparent!important;letter-spacing:.02em;transition:all .15s;background:none!important;text-decoration:none!important}
.pdp-nav-menu ul.root>li>a:hover,
.pdp-nav-menu ul.root>li:hover>a{color:var(--g)!important;border-bottom-color:var(--g)!important;background:rgba(255,255,255,.07)!important}

.pdp-nav-menu ul.root>li>ul{position:absolute!important;top:100%!important;left:0!important;min-width:215px!important;background:var(--wh)!important;border-radius:0 0 12px 12px!important;box-shadow:var(--s4)!important;border-top:3px solid var(--g)!important;padding:6px 0!important;opacity:0;visibility:hidden;transform:translateY(8px);transition:all .25s;z-index:9999!important;display:block!important;width:auto!important}
.pdp-nav-menu ul.root>li:hover>ul{opacity:1;visibility:visible;transform:translateY(0)}
.pdp-nav-menu ul.root>li>ul>li{float:none!important;display:block!important;height:auto!important;margin:0!important;border-top:1px solid var(--g100)!important}
.pdp-nav-menu ul.root>li>ul>li>a{display:block!important;padding:9px 18px!important;font-size:.8rem!important;font-weight:500!important;color:var(--g700)!important;transition:all .15s!important;background:none!important;text-decoration:none!important;white-space:normal!important}
.pdp-nav-menu ul.root>li>ul>li>a:hover{color:var(--bl)!important;background:var(--bbg)!important;padding-left:24px!important}

.pdp-nav-cta{display:flex;align-items:center;gap:5px;padding:7px 16px;background:var(--g);color:#0e2463!important;font-size:.75rem;font-weight:700;border-radius:8px;transition:all .15s;flex-shrink:0;margin:6px 0;white-space:nowrap}
.pdp-nav-cta:hover{background:var(--gd);color:var(--wh)!important}

/* ════════════════════════════════════════════════════════════
   BREADCRUMB — .directoryTop from navigation.tpl
════════════════════════════════════════════════════════════ */
.pdp-breadcrumb-bar{background:var(--wh);border-bottom:1px solid var(--g200);padding:6px 0}

.directoryTop{display:flex;align-items:center;flex-wrap:wrap;gap:3px;font-size:.73rem!important;color:var(--g500)!important;float:none!important;width:100%!important;padding:0!important;height:auto!important;font-family:var(--f)!important}
.directoryTop .directoryL{display:flex;align-items:center;flex-wrap:wrap;float:none!important;width:auto!important;margin:0!important}
.directoryTop .directoryL>div{display:flex;align-items:center}
.directoryTop .directoryL>div>a{color:var(--bl)!important;padding:2px 0!important;background:none!important;font-size:.73rem!important;float:none!important;text-decoration:none}
.directoryTop .directoryL>div>a>span{color:var(--bl)!important;font-size:.73rem!important}
.directoryTop .directoryL>div>a:hover>span{color:var(--b)!important}
.directoryTop .directoryL>div:not(:last-child)::after{content:'›';margin:0 6px;color:var(--g300)}
.directoryTop .directoryL>.lastitem>a>span{color:var(--g700)!important;font-weight:600}
.directoryTop .directoryTime,.directoryTop #clock{margin-left:auto;color:var(--g400)!important;font-size:.68rem!important;white-space:nowrap;float:none!important}

/* ════════════════════════════════════════════════════════════
   CMS CORE OVERRIDES
════════════════════════════════════════════════════════════ */
.content_auto{width:100%!important;max-width:var(--w)!important;margin:0 auto!important;padding:0 20px!important}
.cf_content{float:none!important;width:100%!important;display:block!important}
#wrapRightPos,#wrap{float:none!important;width:100%!important}
#topMenuContainer,#wrapHeader,#mainMenuTopContainer,#wrapBottom{display:none!important}
#alert_doing_form,#over_dark_transparent{display:none!important}
.boxSearch{display:none!important}
.fix_tel,.ring-alo-phone{display:none!important}

/* ════════════════════════════════════════════════════════════
   PAGE LAYOUTS
════════════════════════════════════════════════════════════ */
.wrapMiddle{float:none!important;width:100%!important;padding:18px 0!important}
.bottom_milde{display:grid!important;grid-template-columns:1fr 290px!important;gap:22px!important;float:none!important;width:100%!important;padding:0!important}
.homeLeft{float:none!important;width:100%!important;min-width:0;display:flex;flex-direction:column;gap:16px}
.wrapRight,.wrapRight2{float:none!important;width:100%!important;display:flex!important;flex-direction:column!important;gap:14px!important}
.wrapMiddleCatalog{display:grid!important;grid-template-columns:1fr 285px!important;gap:22px!important;float:none!important;width:100%!important;padding:16px 0!important}
.wrapLeft{float:none!important;width:100%!important;min-width:0}
.catalogInPage{float:none!important;width:100%!important}

/* ════════════════════════════════════════════════════════════
   HOMEPAGE FEATURED — content_special.tpl

   Real DOM:
   div.contentHot > div#slideHot
     > ul.slider > li > div.news > a>img.image_hotnews
                                 > div.title > h2>a + div.description
     > div.navigator_bar (×4 sibling) > div.lastestNewsHome
         > div.overFollow > ul.navigator > li > div.story
             > div.image_container>div.image_cell>a>img.image_news
             > h2.title > a
   > div.topNews
     > div.topTitle > h3 > span
     > div.box-slide > div.slides-TD > ul > li > div.story > span.icon-slide-news + a
════════════════════════════════════════════════════════════ */
div.contentHot{float:none!important;width:100%!important;margin:0!important;padding:0!important;background:transparent!important}
.hotTitle{display:none!important}

div#slideHot{float:none!important;width:100%!important;margin:0!important;font-size:0}

div#slideHot>ul.slider{float:none!important;width:100%!important;margin:0!important;padding:0!important;list-style:none!important;border-radius:14px;overflow:hidden;display:block!important;font-size:15px}
div#slideHot>ul.slider>li{position:relative!important;width:100%!important;display:block}
div#slideHot>ul.slider>li>div.news{float:none!important;position:relative;width:100%!important}
div#slideHot>ul.slider>li>div.news>a{display:block;float:none!important;width:100%!important}
div#slideHot>ul.slider>li>div.news>a>img.image_hotnews{width:100%!important;height:360px!important;object-fit:cover!important;display:block}
div#slideHot>ul.slider>li>div.news>div.title{position:absolute!important;bottom:0!important;left:0!important;right:0!important;width:100%!important;background:linear-gradient(to top,rgba(8,18,58,.92) 0%,rgba(8,18,58,.5) 55%,transparent 100%)!important;padding:18px 22px 22px!important;margin:0!important;text-transform:none!important}
div#slideHot>ul.slider>li>div.news>div.title>h2{float:none!important;width:100%!important;margin:0 0 7px!important;padding:0!important}
div#slideHot>ul.slider>li>div.news>div.title>h2>a{display:block!important;float:none!important;color:var(--wh)!important;font-family:var(--fh)!important;font-size:1.1rem!important;font-weight:700!important;line-height:1.3!important;width:100%!important;text-decoration:none!important}
div#slideHot>ul.slider>li>div.news>div.title>h2>a:hover{color:var(--g)!important}
div#slideHot>ul.slider>li>div.news>div.title>div.description{float:none!important;width:100%!important;color:rgba(255,255,255,.82)!important;font-size:.83rem!important;margin:0!important;line-height:1.55!important;font-size:15px;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}

/* 4× .navigator_bar siblings → inline-block 25% row */
div#slideHot>div.navigator_bar{display:inline-block!important;width:25%!important;vertical-align:top!important;padding:8px 4px 0 0!important;margin:0!important;float:none!important;box-sizing:border-box!important;font-size:15px}
div#slideHot>div.navigator_bar:last-of-type{padding-right:0!important}
div.lastestNewsHome{float:none!important;width:100%!important}
div.lastestNewsHome div.overFollow{width:100%!important;float:none!important}
div.lastestNewsHome ul.navigator{float:none!important;width:100%!important;margin:0!important;padding:0!important;list-style:none!important}
div.lastestNewsHome ul.navigator>li{float:none!important;width:100%!important;padding:0!important;display:block!important}
div.lastestNewsHome div.story{float:none!important;width:100%!important;padding:0!important;height:auto!important;background:var(--wh);border-radius:8px;overflow:hidden;border:1px solid var(--g200);box-shadow:var(--s1);transition:box-shadow .2s,transform .2s}
div.lastestNewsHome div.story:hover{box-shadow:var(--s3);transform:translateY(-2px)}
div.lastestNewsHome div.story div.image_container{display:block!important;float:none!important}
div.lastestNewsHome div.story div.image_container div.image_cell{float:none!important;width:100%!important}
div.lastestNewsHome div.story div.image_container div.image_cell>a{display:block}
div.lastestNewsHome div.story div.image_container div.image_cell>a>img.image_news{float:none!important;width:100%!important;height:76px!important;object-fit:cover!important;margin:0!important;display:block!important}
div.lastestNewsHome div.story h2.title{margin:0!important;padding:6px 8px!important}
div.lastestNewsHome div.story h2.title>a{font-size:.73rem!important;font-weight:600!important;color:var(--g800)!important;line-height:1.3!important;font-family:var(--f)!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;float:none!important;height:auto!important;text-decoration:none!important}
div.lastestNewsHome div.story h2.title>a:hover{color:var(--bl)!important}

/* ── topNews / box-slide ─────────────────────────────────────
   jCarouselLite is DISABLED for .slides-TD in header_global.tpl.
   The UL renders normally. li has inline style="height:410px" from Smarty.
   We reset that with [style] selector.
──────────────────────────────────────────────────────────── */
div.topNews{float:none!important;width:100%!important;margin:0!important;padding:0!important;background:var(--wh);border-radius:12px;border:1px solid var(--g200);box-shadow:var(--s1);overflow:hidden}
div.topNews div.topTitle{float:none!important;width:100%!important;background:linear-gradient(90deg,var(--b),var(--bm))!important;height:auto!important;padding:0!important;border-radius:0!important}
div.topNews div.topTitle h3{float:none!important;margin:0!important;padding:0!important;background:none!important;height:auto!important}
div.topNews div.topTitle h3>span{display:block!important;background:none!important;float:none!important;color:var(--wh)!important;font-family:var(--f)!important;font-size:.76rem!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.07em!important;padding:10px 14px!important;height:auto!important;line-height:1.2!important;margin:0!important}
div.topNews div.box-slide{float:none!important;width:100%!important;background:var(--wh)!important;padding:0!important;height:auto!important;border:none!important;overflow:visible!important}
div.topNews div.slides-TD{width:100%!important;float:none!important;overflow:visible!important;height:auto!important}
div.topNews div.slides-TD ul{margin:0!important;padding:0!important;list-style:none!important;height:auto!important;overflow:visible!important;width:100%!important}
/* Override the li[style="height:410px"] from Smarty template */
div.topNews div.slides-TD ul>li[style]{height:auto!important;display:block!important;float:none!important;width:100%!important;overflow:visible!important}
div.topNews div.slides-TD div.story{float:none!important;width:100%!important;border-bottom:1px solid var(--g100)!important;padding:8px 14px!important;display:flex!important;align-items:baseline!important;gap:6px!important}
div.topNews div.slides-TD div.story:last-child{border-bottom:none!important}
div.topNews div.slides-TD div.story span.icon-slide-news{color:var(--bl)!important;font-weight:700!important;font-size:.73rem!important;flex-shrink:0!important;min-width:20px!important}
div.topNews div.slides-TD div.story>a{font-family:var(--f)!important;font-size:.81rem!important;color:var(--g700)!important;font-weight:500!important;line-height:1.5!important;text-decoration:none!important;transition:color .15s!important;flex:1!important}
div.topNews div.slides-TD div.story>a:hover{color:var(--bl)!important}

/* ── Banner slides ───────────────────────────────────────────── */
#boxbannerCarousel{float:none!important;width:100%!important;overflow:hidden!important;border-radius:12px!important;box-shadow:var(--s2)!important}
#topbannerCarousel{height:auto!important;overflow:hidden!important}
#topbannerCarousel li,#topbannerCarousel ul{margin:0!important;padding:0!important;list-style:none!important}
#topbannerCarousel .slide-img img{width:100%!important;height:230px!important;object-fit:cover!important;display:block!important}

/* ════════════════════════════════════════════════════════════
   SIDEBAR — .columnRight (proroll-2 / TIÊU ĐIỂM)
   jCarouselLite DISABLED for .photoroll in header_global.tpl.
   The ul.jCarouselLite renders as plain list.
   Content_hot.tpl: all items are in ONE <li> > <div> > .wwidget×n
════════════════════════════════════════════════════════════ */
.columnRight,.rightStyle2,.supportOnline,.lichvtv{float:none!important;width:100%!important;background:var(--wh)!important;border-radius:12px!important;border:1px solid var(--g200)!important;box-shadow:var(--s1)!important;overflow:hidden!important}

.top_title{width:100%!important;background:linear-gradient(90deg,var(--r),var(--rd))!important;margin:0!important;padding:0!important;position:static!important}
.top_title span{display:block!important}
.top_title span::before,.top_title span::after{display:none!important}
.top_title span>a{display:block!important;background:none!important;color:var(--wh)!important;font-family:var(--f)!important;font-size:.76rem!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.07em!important;padding:10px 14px!important;height:auto!important;font-style:normal!important;line-height:1.2!important;text-decoration:none!important}

/* proroll-2 wrapper */
.proroll,.proroll-2{background:transparent!important;width:100%!important;float:none!important;height:auto!important;overflow:visible!important}
/* The div with inline style="position:relative;height:250px;width:490px" */
.proroll-2>div{position:static!important;height:auto!important;width:100%!important;margin:0!important;overflow:visible!important;padding:0!important}
.photoroll{float:none!important;padding:0!important;width:100%!important;height:auto!important;overflow:visible!important;margin:0!important}
/* jCarouselLite is disabled for .photoroll so the UL renders flat:
   ul.jCarouselLite > li > div > div.wwidget×n */
ul.jCarouselLite{padding:0!important;margin:0!important;list-style:none!important;width:100%!important;height:auto!important;overflow:visible!important}
ul.jCarouselLite>li{height:auto!important;width:100%!important;float:none!important;display:block!important;padding:0!important;list-style:none!important}
ul.jCarouselLite>li>div{width:100%!important;height:auto!important}
.wwidget{float:none!important;width:100%!important;margin:0!important;padding:8px 14px!important;border-bottom:1px solid var(--g100)!important;background:none!important;display:block!important;height:auto!important}
.wwidget:last-child{border-bottom:none!important}
.wwidget p{background:none!important;font-size:.8rem!important;color:var(--g700)!important;margin:0!important;padding:0!important}
.wwidget p>a{color:var(--g700)!important;font-weight:500!important;text-decoration:none!important;display:block!important;line-height:1.55!important;transition:color .15s!important}
.wwidget p>a:hover{color:var(--bl)!important}

/* rightStyle2 */
.rightStyle2 .top{float:none!important;width:100%!important;background:linear-gradient(90deg,var(--b),var(--bm))!important;height:auto!important;border:none!important;border-radius:0!important;position:static!important}
.rightStyle2 .top h3{float:none!important;margin:0!important;background:none!important;height:auto!important;padding:0!important}
.rightStyle2 .top>a{float:none!important;background:none!important;color:var(--wh)!important;font-family:var(--f)!important;font-size:.76rem!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.07em!important;padding:10px 14px!important;height:auto!important;line-height:1.2!important;display:block!important;text-decoration:none!important;margin:0!important}
.rightStyle2 .top .viewmore{display:none!important}
.rightStyle2 .middle{float:none!important;width:100%!important;border:none!important;background:var(--wh)!important;padding:0!important;margin:0!important}
.rightStyle2 .middle .story{float:none!important;width:100%!important;margin:0!important;padding:8px 14px!important;border-bottom:1px solid var(--g100)!important;background:none!important}
.rightStyle2 .middle .story:last-child{border:none!important}
.rightStyle2 .middle .story .title{font-size:.79rem!important;color:var(--g700)!important;margin:0!important;padding:0!important;border:none!important;display:block!important}
.rightStyle2 .middle .story .title a{color:var(--g700)!important;font-weight:500!important;text-decoration:none!important;font-size:.79rem!important;transition:color .15s!important;display:block!important;line-height:1.45!important}
.rightStyle2 .middle .story .title a:hover{color:var(--bl)!important}
.rightStyle2 .middle .story .create_time,.rightStyle2 .middle .story .description,.rightStyle2 .middle .story .image_container{display:none!important}

/* supportOnline */
.supportOnline .supportOnlineBorder{width:100%!important;float:none!important}
.supportOnline .top{float:none!important;width:100%!important;background:linear-gradient(90deg,var(--bl),var(--b))!important;height:auto!important;border-radius:0!important}
.supportOnline .top h3{float:none!important;background:none!important;margin:0!important;height:auto!important;padding:0!important}
.supportOnline .top .catName{float:none!important;background:none!important;height:auto!important;line-height:1!important;padding:10px 14px!important;display:block!important;margin:0!important}
.supportOnline .top .catName span{display:inline!important;margin:0!important;padding:0!important;color:var(--wh)!important;font-family:var(--f)!important;font-size:.76rem!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.07em!important}
.supportOnline .middle{float:none!important;width:100%!important;padding:14px!important;background:var(--bbg)!important;border:none!important;margin:0!important}
.supportOnline .middle .hotline{background:none!important;border-bottom:1px solid var(--g200)!important;float:none!important;width:100%!important;font-size:1rem!important;font-weight:700!important;color:var(--r)!important;margin:0 0 10px!important;padding:0 0 10px!important}
.supportOnline .listing{color:var(--g700)!important;margin:0!important}
.supportOnline .listing p{float:none!important;width:100%!important;margin:0!important;padding:3px 0!important}
.supportOnline .listing a{float:none!important;width:auto!important;text-decoration:none}
.supportOnline .listing a:hover{color:var(--b)!important;text-decoration:underline!important}
.supportOnline .listing .name{float:none!important;padding:2px 0!important;color:var(--b)!important;font-size:.8rem!important;font-weight:700!important}
.supportOnline .listing .phone_name{float:none!important;font-size:.78rem!important;color:var(--g700)!important}
.supportOnline .listing .phone_text{float:none!important;font-size:.78rem!important;padding:0 0 0 4px!important;color:var(--bl)!important}
.supportOnline .listing .hr{float:none!important;width:100%!important;height:0!important;border-bottom:1px dashed var(--g300)!important;margin:8px 0!important}
.supportOnline .listing .icon-support{float:none!important;display:flex!important;gap:4px!important}
.supportOnline .bottom{display:none!important}

.right_adv{float:none!important;width:100%!important;margin:0!important;border-radius:12px!important;overflow:hidden!important;box-shadow:var(--s1)!important}
.right_adv img{width:100%!important;height:auto!important;display:block!important}

/* lichvtv */
.lichvtv .chonngay{background:linear-gradient(90deg,var(--b),var(--bm))!important;height:auto!important;padding:0!important;border-radius:0!important;margin:0!important;width:100%!important;float:none!important}
.lichvtv .chonngay h4{margin:0!important;padding:0!important;font-family:var(--f)!important}
.lichvtv .chonngay h4>a.name{display:block!important;padding:10px 14px!important;color:var(--wh)!important;font-size:.76rem!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.06em!important;text-decoration:none!important;background:none!important}
.lichvtv .danhsach{float:none!important;margin:0!important;width:100%!important;overflow:visible!important;height:auto!important;position:static!important}
.lichvtv .slimScrollDiv{width:100%!important;height:auto!important;overflow:visible!important;position:static!important}
.lichvtv .break-mid{display:none!important}
ul.lichvtv-fix{padding:6px 0!important;margin:0!important;list-style:none!important;font-family:var(--f)!important}
ul.lichvtv-fix>li{display:flex!important;flex-direction:row!important;align-items:flex-start!important;gap:10px!important;padding:8px 12px!important;border-bottom:1px solid var(--g100)!important;clear:none!important;margin:0!important;list-style:none!important}
ul.lichvtv-fix>li:last-child{border-bottom:none!important}
ul.lichvtv-fix>li>p{flex-shrink:0!important;margin:0!important;padding:0!important;float:none!important;width:auto!important;display:block!important}
ul.lichvtv-fix>li>p>a{display:block!important;float:none!important;width:auto!important}
ul.lichvtv-fix>li>p>a>img.image_news{width:56px!important;height:42px!important;object-fit:cover!important;border-radius:4px!important;display:block!important;float:none!important;border:0!important}
ul.lichvtv-fix>li>a{flex:1!important;min-width:0!important;color:var(--g700)!important;text-decoration:none!important;display:block!important;float:none!important;margin:0!important;padding:0!important;transition:color .15s!important}
ul.lichvtv-fix>li>a>b{display:block!important;font-size:.79rem!important;font-weight:600!important;color:var(--g800)!important;line-height:1.35!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;margin-bottom:2px!important}
ul.lichvtv-fix>li>a>span{font-size:.72rem!important;color:var(--g500)!important;display:-webkit-box!important;-webkit-line-clamp:1!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
ul.lichvtv-fix>li>a .icon_video_schedule{display:none!important}
ul.lichvtv-fix>li>a:hover>b{color:var(--bl)!important}
.lichvtv .viewmore{background:var(--bbg)!important;width:100%!important;text-align:center!important;border-top:1px solid var(--g200)!important;float:none!important}
.lichvtv .viewmore>a{color:var(--bl)!important;font-size:.77rem!important;font-weight:600!important;padding:7px!important;display:block!important;text-decoration:none!important}
.lichvtv .viewmore>a:hover{background:var(--bbd)!important;color:var(--b)!important}

/* catalogHome2 */
.catalogInHome{float:none!important;width:100%!important}
.catalogHome2{float:none!important;width:100%!important;position:static!important;font-size:.88rem!important;background:transparent!important;font-family:var(--f)!important;margin:0!important}
.catalogHome2 .columnTitle{float:none!important;width:100%!important;height:auto!important;background:linear-gradient(90deg,var(--b),var(--bm))!important;border-radius:8px 8px 0 0!important;display:flex!important;align-items:center!important;justify-content:space-between!important;flex-wrap:wrap!important;gap:5px!important;padding:0!important;margin-bottom:0!important}
.catalogHome2 .columnTitle h3{float:none!important;height:auto!important;background:none!important;margin:0!important;padding:0!important;position:static!important}
.catalogHome2 .columnTitle .catName{float:none!important;background:none!important;height:auto!important;line-height:1!important;text-transform:uppercase!important;font-size:.75rem!important;font-weight:700!important;padding:10px 14px!important;min-width:0!important;margin:0!important;letter-spacing:.04em!important}
.catalogHome2 .columnTitle .catName span{background:none!important;height:auto!important;display:inline!important;padding:0!important;font-size:.75rem!important;color:var(--wh)!important;font-family:var(--f)!important}
.catalogHome2 .columnTitle .sub_catalog{float:none!important;height:auto!important;position:static!important;background:none!important;display:flex!important;flex-wrap:wrap!important;gap:4px!important;padding:0 10px!important;z-index:auto!important;left:auto!important}
.catalogHome2 .columnTitle .sub_catalog a{float:none!important;height:auto!important;line-height:1.2!important;margin:0!important;font-size:.67rem!important;color:rgba(255,255,255,.82)!important;font-weight:500!important;padding:3px 9px!important;background:rgba(255,255,255,.15)!important;border-radius:99px!important;display:inline-flex!important;transition:all .15s!important;text-decoration:none!important}
.catalogHome2 .columnTitle .sub_catalog a:hover{background:var(--g)!important;color:#0e2463!important}
.catalogHome2 .columnTitle .span_left,.catalogHome2 .columnTitle .span_right,.catalogHome2 .columnTitle .sub_space,.catalogHome2 .columnTitle .icon-subcatalog{display:none!important}
.catalogHome2 .columnTitle .span_center{background:none!important;height:auto!important;float:none!important;white-space:nowrap!important}
.catalogHome2 .middle{float:none!important;width:100%!important;padding:12px!important;background:var(--wh)!important;border:1px solid var(--g200)!important;border-top:none!important;border-radius:0 0 8px 8px!important;min-height:unset!important;box-shadow:var(--s1)!important;margin-bottom:14px!important}
.catalogHome2 .listing{float:none!important;width:100%!important;background:none!important;padding:0!important;display:flex!important;flex-direction:column!important;gap:10px!important}
.catalogHome2 .firstitem{width:100%!important;height:auto!important;margin:0!important;display:flex!important;gap:12px!important;align-items:flex-start!important;padding-bottom:10px!important;border-bottom:1px solid var(--g100)!important}
.catalogHome2 .firstitem .image_container{display:block!important;float:none!important;flex-shrink:0!important}
.catalogHome2 .firstitem .image_container .image_news{float:none!important;width:142px!important;height:102px!important;object-fit:cover!important;border-radius:8px!important;margin:0!important;padding:0!important}
.catalogHome2 .firstitem h2.title{float:none!important;width:auto!important;background:none!important;margin:0 0 4px!important;padding:0!important}
.catalogHome2 .firstitem h2.title a{color:var(--g900)!important;font-size:.87rem!important;font-weight:700!important;white-space:normal!important;font-family:var(--f)!important;line-height:1.35!important;display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical!important;overflow:hidden!important;text-decoration:none!important}
.catalogHome2 .firstitem h2.title a:hover{color:var(--bl)!important}
.catalogHome2 .firstitem .create_time{display:block!important;font-size:.67rem!important;color:var(--g400)!important;margin:2px 0 4px!important}
.catalogHome2 .firstitem .description{display:block!important;font-size:.78rem!important;color:var(--g500)!important;line-height:1.5!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
.catalogHome2 .seconditem{width:100%!important;margin:0!important;float:none!important;display:flex!important;gap:8px!important;align-items:flex-start!important;padding:0!important}
.catalogHome2 .seconditem .image_container{display:block!important;float:none!important;flex-shrink:0!important}
.catalogHome2 .seconditem .image_container .image_news{float:none!important;width:50px!important;height:38px!important;object-fit:cover!important;border-radius:4px!important;margin:0!important;padding:0!important}
.catalogHome2 .seconditem h2.title{float:none!important;width:auto!important;background:none!important;padding:0!important;height:auto!important;overflow:visible!important;text-align:left!important;margin:0!important}
.catalogHome2 .seconditem h2.title a{color:var(--g700)!important;font-size:.77rem!important;font-weight:500!important;white-space:normal!important;font-family:var(--f)!important;line-height:1.35!important;display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical!important;overflow:hidden!important;text-decoration:none!important}
.catalogHome2 .seconditem h2.title a:hover{color:var(--bl)!important}
.catalogHome2 .seconditem .create_time,.catalogHome2 .seconditem .description{display:none!important}
.catalogHome2 .story.lastitem{float:none!important;width:100%!important;padding:0!important;margin:0!important;border:none!important}
.catalogHome2 .story.lastitem h2.title{background:none!important;width:100%!important;float:none!important;margin:0!important;padding:3px 0 3px 12px!important;border-left:2px solid var(--bbd)!important}
.catalogHome2 .story.lastitem h2.title a{color:var(--g700)!important;font-size:.77rem!important;font-weight:400!important;white-space:normal!important;overflow:hidden!important;display:-webkit-box!important;-webkit-line-clamp:1!important;-webkit-box-orient:vertical!important;text-decoration:none!important}
.catalogHome2 .story.lastitem h2.title a:hover{color:var(--bl)!important}

/* ════════════════════════════════════════════════════════════
   CATEGORY PAGE — /d139/hoat-dong.html
   DOM: div.news > div.image_container + h2.title + div.create_time
                 + div.description + div.viewmore

   Layout: Thumbnail left (185px), right column stacks VERTICALLY:
   ┌─────────────────────────────────────────────────────────┐
   │ [thumb] │ TIÊU ĐỀ BÀI VIẾT                             │
   │         │───────────────────────────────────────────────│
   │         │ 🕐 Thời gian đăng: 10:00 — 15/01/2024        │
   │         │───────────────────────────────────────────────│
   │         │ Mô tả ngắn bài viết...                        │
   │         │                                               │
   │         │                    [Đọc tiếp →]               │
   └─────────────────────────────────────────────────────────┘
════════════════════════════════════════════════════════════ */
div.directory{display:flex!important;align-items:flex-start!important;border-bottom:2px solid var(--bbd)!important;padding:0 0 12px!important;margin:0 0 16px!important;float:none!important;width:100%!important}
div.directory .left{float:none!important;flex:1!important;width:auto!important}
div.directory .right{display:none!important}
div.directory .lastitem>a,div.directory .lastitem>a>span{font-family:var(--fh)!important;font-size:1.1rem!important;font-weight:700!important;color:var(--b)!important;text-decoration:none!important}

div.listnews1{float:none!important;width:100%!important}
div.listing{float:none!important;width:100%!important;display:flex!important;flex-direction:column!important;gap:0!important}

/* News card */
div.news{
  display:grid!important;
  grid-template-columns:185px 1fr!important;
  grid-template-rows:auto auto auto 1fr auto!important;
  grid-template-areas:
    "thumb title"
    "thumb time"
    "thumb desc"
    "thumb ."
    "thumb more"!important;
  gap:0 18px!important;
  background:var(--wh)!important;
  border-bottom:1px solid var(--g200)!important;
  border-left:none!important;border-right:none!important;border-top:none!important;
  border-radius:0!important;
  padding:18px 0!important;
  margin:0!important;float:none!important;width:100%!important;
  box-shadow:none!important;
  transition:background .15s!important;
}
/* First item gets top border */
div.news.firstitem{border-top:1px solid var(--g200)!important}
div.news:hover{background:var(--bbg)!important;transform:none!important;box-shadow:none!important}

/* Thumbnail */
div.news div.image_container{
  grid-area:thumb!important;
  align-self:stretch!important;
  float:none!important;width:auto!important;display:block!important;
}
div.news div.image_container div.image_cell{float:none!important;width:100%!important;height:100%!important}
div.news div.image_container div.image_cell>a{display:block;width:100%!important;height:100%!important;min-height:120px!important;border-radius:10px;overflow:hidden}
div.news div.image_container div.image_cell>a>img.image_news{
  width:100%!important;height:100%!important;min-height:120px!important;
  object-fit:cover!important;display:block!important;float:none!important;
  transition:transform .35s!important;
}
div.news:hover div.image_container div.image_cell>a>img.image_news{transform:scale(1.04)!important}

/* Title — row 1 */
div.news h2.title{
  grid-area:title!important;
  font-family:var(--f)!important;font-size:.96rem!important;font-weight:700!important;
  color:var(--g900)!important;margin:0 0 8px!important;padding:0!important;
  background:none!important;float:none!important;width:auto!important;line-height:1.45!important;
  align-self:start!important;
}
div.news h2.title>a{color:var(--g900)!important;text-decoration:none!important;transition:color .15s!important;display:block!important}
div.news:hover h2.title>a{color:var(--bl)!important}

/* Time — row 2 */
div.news div.create_time{
  grid-area:time!important;
  font-size:.72rem!important;color:var(--g400)!important;
  display:flex!important;align-items:center!important;gap:6px!important;
  margin:0 0 8px!important;float:none!important;width:auto!important;
  padding-bottom:8px!important;border-bottom:1px dashed var(--g200)!important;
}
div.news div.create_time .crateTimeTitle{
  background:var(--bbg)!important;color:var(--bl)!important;
  padding:2px 8px!important;border-radius:4px!important;
  font-size:.68rem!important;font-weight:600!important;
  text-transform:uppercase!important;letter-spacing:.04em!important;
  white-space:nowrap!important;
}

/* Description — row 3 */
div.news div.description{
  grid-area:desc!important;
  font-size:.83rem!important;color:var(--g600)!important;
  line-height:1.68!important;margin:0 0 10px!important;
  display:-webkit-box!important;-webkit-line-clamp:3!important;
  -webkit-box-orient:vertical!important;overflow:hidden!important;
  float:none!important;width:auto!important;
}

/* Read-more — row 4 (bottom) */
div.news div.viewmore{
  grid-area:more!important;
  align-self:end!important;
  float:none!important;width:auto!important;
}
div.news div.viewmore>a{
  display:inline-flex!important;align-items:center!important;gap:5px!important;
  font-size:.79rem!important;font-weight:600!important;
  color:var(--wh)!important;text-decoration:none!important;
  background:var(--bl)!important;border:none!important;
  padding:6px 18px!important;border-radius:20px!important;
  transition:all .15s!important;
}
div.news div.viewmore>a img{display:none!important}
div.news div.viewmore>a::after{content:' →';font-size:.85rem}
div.news div.viewmore>a:hover{background:var(--b)!important;transform:translateX(3px)!important}

div.pagination-page{padding:16px 0!important}
.search_result_number{float:none!important;padding:12px 14px!important;background:var(--bbg)!important;border-radius:8px!important;border:1px solid var(--bbd)!important;font-size:.87rem!important;margin-bottom:14px!important}

/* ════════════════════════════════════════════════════════════
   ARTICLE PAGE
════════════════════════════════════════════════════════════ */
.articleleft{float:none!important;width:100%!important}
.articleContent{background:var(--wh)!important;border-radius:14px!important;border:1px solid var(--g200)!important;padding:26px 30px!important;box-shadow:var(--s1)!important}
.articleContent h1.title{font-family:var(--fh)!important;font-size:clamp(1.1rem,2.5vw,1.6rem)!important;font-weight:700!important;color:var(--g900)!important;line-height:1.3!important;margin-bottom:10px!important;padding:0!important}
.articleContent p.create_time{font-size:.73rem!important;color:var(--g400)!important;display:block!important;margin-bottom:16px!important;padding-bottom:14px!important;border-bottom:1px solid var(--g200)!important}
.articleContent .introtext{background:var(--bbg)!important;border-left:4px solid var(--bl)!important;border-radius:0 8px 8px 0!important;padding:12px 16px!important;font-size:.9rem!important;font-style:italic!important;color:var(--b)!important;margin-bottom:16px!important}
.articleContent .introtext p{margin:0!important}
.articleContent .bodynews{font-size:.9rem!important;line-height:1.88!important;color:var(--g700)!important}
.articleContent .bodynews p{margin-bottom:12px!important}
.articleContent .bodynews h1,.articleContent .bodynews h2{font-size:1.04rem!important;color:var(--b)!important;text-transform:uppercase!important;margin:22px 0 8px!important}
.articleContent .bodynews h3{font-size:.98rem!important;color:var(--bl)!important;margin:16px 0 6px!important}
.articleContent .bodynews img{max-width:100%!important;border-radius:8px!important;margin:10px 0!important;height:auto!important}
.articleContent .bodynews a{color:var(--bl)!important;text-decoration:underline!important}
.articleContent .bodynews table{width:100%!important;border-collapse:collapse!important;margin:14px 0!important}
.articleContent .bodynews table th{background:var(--b)!important;color:var(--wh)!important;padding:9px 13px!important;font-size:.81rem!important;text-align:left!important;border:none!important}
.articleContent .bodynews table td{padding:8px 13px!important;border-bottom:1px solid var(--g200)!important;font-size:.81rem!important}
.articleContent .bodynews table tr:nth-child(even) td{background:var(--g50)!important}
.articleContent .bodynews div[style*="float"]{float:none!important;width:100%!important}

.othernews_normal{margin-top:16px!important;background:var(--bbg)!important;border-radius:8px!important;padding:12px 14px!important;border:1px solid var(--bbd)!important;float:none!important;width:100%!important}
.othernews_normal .name{font-weight:700!important;color:var(--b)!important;font-size:.81rem!important;margin-bottom:8px!important}
.othernews_normal div.listing{display:block!important;gap:0!important}
.othernews_normal div.news{display:block!important;background:none!important;border:none!important;padding:4px 0!important;margin:0!important;box-shadow:none!important;transform:none!important;border-radius:0!important;grid-template-columns:unset!important;grid-template-areas:unset!important}
.othernews_normal div.news:hover{background:none!important}
.othernews_normal div.news div.image_container,.othernews_normal div.news div.create_time,.othernews_normal div.news div.description,.othernews_normal div.news div.viewmore{display:none!important}
.othernews_normal div.news h2.title{font-size:.81rem!important;font-weight:500!important;margin:0!important;grid-area:unset!important}
.othernews_normal div.news h2.title>a{color:var(--bl)!important}
.othernews_normal div.news h2.title>a:hover{color:var(--b)!important;text-decoration:underline!important}

.articles_nav{display:flex!important;justify-content:space-between!important;flex-wrap:wrap!important;gap:8px!important;margin:16px 0!important;padding:14px 0!important;border-top:1px solid var(--g200)!important}
.articles_nav a{display:inline-flex!important;align-items:center!important;gap:5px!important;padding:7px 14px!important;background:var(--bbg)!important;border:1px solid var(--g200)!important;border-radius:8px!important;font-size:.79rem!important;font-weight:600!important;color:var(--g700)!important;transition:all .15s!important;text-decoration:none!important}
.articles_nav a:hover{background:var(--bl)!important;color:var(--wh)!important;border-color:var(--bl)!important}
.gp-comments{margin-top:16px!important;padding-top:16px!important;border-top:1px solid var(--g200)!important}
.comment-reply-title{font-family:var(--f)!important;font-size:.83rem!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.05em!important;color:var(--g600)!important;margin-bottom:12px!important}
.content-others{margin-top:0!important}

/* Contact */
.page_contact.contact{padding:0!important}
.row_contact{display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px!important;margin-bottom:14px!important;float:none!important}
.column_contact{float:none!important;width:100%!important;min-height:unset!important}
.column_contact label{display:block!important;font-size:.78rem!important;font-weight:700!important;color:var(--g700)!important;margin-bottom:5px!important}
.field_contact{width:100%!important;padding:10px 13px!important;border:1.5px solid var(--g200)!important;border-radius:8px!important;font-size:.87rem!important;color:var(--g800)!important;background:var(--wh)!important;outline:none!important;transition:all .15s!important;display:block!important;font-family:var(--f)!important}
.field_contact:focus{border-color:var(--bl)!important;box-shadow:0 0 0 3px rgba(25,118,210,.12)!important}
.page_contact textarea.field_contact{height:120px!important;resize:vertical!important}
.button_contact{display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;padding:11px 24px!important;background:linear-gradient(135deg,var(--bl),var(--b))!important;color:var(--wh)!important;font-family:var(--f)!important;font-size:.87rem!important;font-weight:700!important;border-radius:8px!important;border:none!important;cursor:pointer!important;transition:all .2s!important}
.button_contact:hover{transform:translateY(-2px)!important;box-shadow:var(--s3)!important}
.text-success{background:#f0fdf4!important;border:1px solid #86efac!important;color:#166534!important;padding:10px 13px!important;border-radius:8px!important;margin-bottom:12px!important}
.text-warning{background:#fff0f0!important;border:1px solid #fca5a5!important;color:var(--r)!important;padding:10px 13px!important;border-radius:8px!important;margin-bottom:12px!important}
.text-default{background:var(--bbg)!important;border:1px solid var(--bbd)!important;color:var(--b)!important;padding:10px 13px!important;border-radius:8px!important;margin-bottom:12px!important}

/* Misc */
.fb-page{border-radius:12px!important;overflow:hidden!important}
.dbl-n{display:block}
.icon-messenger{z-index:9500!important;right:65px!important;position:fixed!important;bottom:10px!important}
.zalo-chat-widget{z-index:9400!important}

/* ════════════════════════════════════════════════════════════
   FOOTER
════════════════════════════════════════════════════════════ */
.pdp-footer{background:#0e2463}
.pdp-footer-top{padding:50px 0 38px}
.pdp-footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1.1fr;gap:32px}
.pdp-footer-logo{height:52px;width:auto;filter:brightness(0) invert(1);opacity:.75;margin-bottom:12px;display:block}
.pdp-footer-brand p{font-size:.8rem;line-height:1.78;color:rgba(255,255,255,.55);margin-bottom:14px}
.pdp-footer-social{display:flex;gap:8px}
.pdp-footer-social a{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.7);font-size:.83rem;transition:all .25s}
.pdp-footer-social a:hover{background:var(--g);border-color:var(--g);color:#0e2463;transform:translateY(-3px)}
.pdp-footer-col h4{font-family:var(--f);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--g);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.08)}
.pdp-footer-links a,.pdp-footer-col a{display:flex;align-items:center;gap:5px;font-size:.8rem;color:rgba(255,255,255,.6);padding:4px 0;transition:all .15s}
.pdp-footer-links a:hover,.pdp-footer-col a:hover{color:var(--g);padding-left:4px}
.pdp-footer-contact{display:flex;flex-direction:column;gap:8px}
.pdp-footer-contact li{display:flex;align-items:flex-start;gap:8px;font-size:.8rem;color:rgba(255,255,255,.6);line-height:1.5}
.pdp-footer-contact .fas{color:var(--g);font-size:.68rem;margin-top:3px;flex-shrink:0;width:14px}
.pdp-footer-contact a{color:rgba(255,255,255,.6);padding:0;display:inline}
.pdp-footer-contact a:hover{color:var(--g);padding-left:0}
.pdp-footer-map{border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.pdp-footer-map iframe{width:100%;height:185px;display:block;border:none;filter:grayscale(.1)}
.pdp-footer-bottom{border-top:1px solid rgba(255,255,255,.07);padding:14px 0}
.pdp-footer-bottom-inner{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;max-width:var(--w);margin:0 auto;padding:0 20px}
.pdp-footer-bottom-inner span{font-size:.72rem;color:rgba(255,255,255,.35)}
.pdp-footer-bottom-inner strong{color:rgba(255,255,255,.5)}

/* Float */
.pdp-float{position:fixed;bottom:20px;left:16px;z-index:9000;display:flex;align-items:center}
.pdp-float-phone{width:50px;height:50px;border-radius:50%;background:var(--r);display:flex;align-items:center;justify-content:center;color:var(--wh);font-size:1.1rem;box-shadow:var(--s3);animation:callring 2s ease infinite;flex-shrink:0;transition:background .15s}
.pdp-float-phone:hover{background:var(--b);color:var(--wh)!important}
@keyframes callring{0%,100%{box-shadow:0 0 0 0 rgba(198,40,40,.45)}50%{box-shadow:0 0 0 12px rgba(198,40,40,0)}}
.pdp-float-phone-label{background:var(--wh);color:var(--r)!important;font-size:.79rem;font-weight:700;padding:8px 12px 8px 6px;border-radius:0 99px 99px 0;box-shadow:var(--s2);border:1.5px solid var(--g200);border-left:none;white-space:nowrap}
.pdp-float-phone-label:hover{color:var(--b)!important}
.pdp-scroll-top{position:fixed;bottom:20px;right:16px;z-index:9000;width:42px;height:42px;border-radius:50%;background:var(--b);color:var(--wh);display:flex;align-items:center;justify-content:center;font-size:.85rem;box-shadow:var(--s2);opacity:0;transform:translateY(12px);pointer-events:none;transition:all .25s}
.pdp-scroll-top--show{opacity:1!important;transform:translateY(0)!important;pointer-events:auto!important}
.pdp-scroll-top:hover{background:var(--bl)}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════════════════════════ */
@media(max-width:1100px){
  .bottom_milde{grid-template-columns:1fr 265px!important}
  .wrapMiddleCatalog{grid-template-columns:1fr 265px!important}
  .pdp-footer-grid{grid-template-columns:1fr 1fr;gap:24px}
  .pdp-school-info{display:none}
}
@media(max-width:768px){
  body{font-size:.88rem}
  .pdp-topbar-left{display:none}
  .pdp-header-inner{min-height:62px;gap:10px;padding-top:8px;padding-bottom:8px}
  .pdp-logo h1.logo img,.pdp-logo #box-logo img,.pdp-logo .logo_list img{height:48px!important}
  .pdp-header-actions{display:none}
  .pdp-burger{display:flex;margin-left:auto}
  .pdp-nav{position:fixed;top:0;right:-100%;width:86vw;max-width:315px;height:100vh;background:#0e2463;z-index:1200;overflow-y:auto;transition:right .25s;padding-top:68px;box-shadow:var(--s4)}
  .pdp-nav.is-open{right:0}
  .pdp-nav-inner{flex-direction:column;align-items:flex-start;padding:8px 0;gap:0;max-width:none}
  .pdp-nav-menu{width:100%}
  .pdp-nav-menu ul.root{flex-direction:column!important;width:100%!important}
  .pdp-nav-menu ul.root>li{width:100%!important;border-bottom:1px solid rgba(255,255,255,.08)!important}
  .pdp-nav-menu ul.root>li>a{padding:13px 20px!important;font-size:.88rem!important;border-bottom:none!important;width:100%!important}
  .pdp-nav-menu ul.root>li>ul{position:static!important;opacity:1!important;visibility:visible!important;transform:none!important;box-shadow:none!important;border:none!important;background:rgba(0,0,0,.28)!important;width:100%!important;border-radius:0!important;padding:0!important}
  .pdp-nav-menu ul.root>li>ul>li>a{padding:10px 14px 10px 32px!important;color:rgba(255,255,255,.7)!important;font-size:.84rem!important}
  .pdp-nav-menu ul.root>li>ul>li>a:hover{color:var(--g)!important;background:rgba(255,255,255,.06)!important;padding-left:36px!important}
  .pdp-nav-cta{margin:12px 20px;width:calc(100% - 40px);justify-content:center}
  .pdp-overlay.is-show{display:block}
  .bottom_milde{grid-template-columns:1fr!important}
  .wrapMiddleCatalog{grid-template-columns:1fr!important}
  /* News card mobile: stack thumbnail above text */
  div.news{grid-template-columns:1fr!important;grid-template-areas:"thumb" "title" "time" "desc" "more"!important;gap:10px 0!important;padding:14px 0!important}
  div.news div.image_container{width:100%!important}
  div.news div.image_container div.image_cell>a{min-height:180px!important;border-radius:8px}
  div.news div.image_container div.image_cell>a>img.image_news{height:180px!important;min-height:180px!important}
  div.news h2.title{margin-top:0!important}
  div#slideHot>div.navigator_bar{width:50%!important;padding:6px 3px 0 0!important}
  div#slideHot>div.navigator_bar:nth-child(even){padding-right:0!important}
  div#slideHot>ul.slider>li>div.news{grid-template-columns:1fr!important;grid-template-areas:unset!important}
  div#slideHot>ul.slider>li>div.news>a>img.image_hotnews{height:210px!important}
  .articleContent{padding:16px!important}
  .row_contact{grid-template-columns:1fr!important}
  .pdp-footer-grid{grid-template-columns:1fr;gap:20px}
  .pdp-footer-bottom-inner{flex-direction:column;text-align:center;gap:4px}
  .pdp-footer-map iframe{height:155px}
}
@media(max-width:480px){
  div#slideHot>div.navigator_bar{width:50%!important}
  div.news div.image_container{display:none!important}
}
@media print{
  .pdp-topbar,.pdp-header,.pdp-nav,.pdp-overlay,.pdp-breadcrumb-bar,
  .pdp-footer,.pdp-float,.pdp-scroll-top{display:none!important}
  .bottom_milde,.wrapMiddleCatalog{display:block!important}
  .wrapRight{display:none!important}
  body{background:#fff;color:#000}
}