@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--orange:#ed6d1d;--green:#278633;--navy:#111a2b;--ink:#10182a;--muted:#8a94a8;--line:#e2e6eb}*{box-sizing:border-box}
body{margin:0;color:var(--ink);font-family:Inter,Arial,sans-serif;font-size:14px}
.container{max-width:1310px!important}
.topbar{height:46px;background:linear-gradient(90deg,#164d25,#142f29);border-bottom:4px solid var(--orange);color:#dcefe3;font-size:12px}
.topbar .container{height:42px}
.top-social b{background:white;color:#123c24;border-radius:12px;padding:2px 10px}
.main-header{height:78px;background:#fff;border-bottom:1px solid #eceef1}
.header-inner{height:100%;display:flex;align-items:center}
.brand{display:block;width:198px;border-right:1px solid #e3e6ea;margin-right:45px}
.brand img{width:170px;height:69px;object-fit:contain}
.desktop-nav{flex:1}
.desktop-nav ul{display:flex;gap:42px;margin:0;padding:0;list-style:none}
.desktop-nav li{display:inline-flex}
.desktop-nav a{color:#1a2334;text-decoration:none;font-weight:500}
.desktop-nav a:after{content:'⌄';color:#b8bec8;font-size:10px;margin-left:8px}
.desktop-nav li:last-child a:after{display:none}
.header-actions{display:flex;align-items:center}
.header-actions a,.header-actions button{height:42px;display:flex;align-items:center;justify-content:center;border:1px solid #dce1e8;background:#fff;text-decoration:none;color:#111827;font-weight:600}
.header-actions button{width:42px;border-radius:13px;margin-right:26px;color:#708095}
.header-actions .login{padding:0 16px}
.header-actions .join{background:var(--orange);color:#fff;border-color:var(--orange);padding:0 18px}
.mobile-toggle{display:none}
.hero-section{padding:20px 0;background:#fff}
.hero-grid{display:grid;grid-template-columns:3fr 2fr;gap:16px}
.hero-card{height:520px;border-radius:14px;overflow:hidden;background:#222}
.hero-card img{width:100%;height:520px;object-fit:cover}
.hero-caption{position:absolute;left:24px;bottom:19px;color:#fff;font-size:26px;font-weight:700;text-shadow:0 2px 5px #000}
.hero-card .carousel-control-prev,.hero-card .carousel-control-next{width:44px;height:44px;top:auto;bottom:24px;border:1px solid rgba(255,255,255,.5);border-radius:50%;font-size:28px}
.hero-card .carousel-control-prev{left:auto;right:76px}
.hero-card .carousel-control-next{right:24px;background:var(--orange);border-color:var(--orange)}
.side-panel{height:520px;border:1px solid #dde2e7;border-radius:14px;overflow:hidden}
.chairman{width:100%;height:170px;object-fit:cover}
.announce-title{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:2px solid var(--orange)}
.announce-title strong:before{content:'';display:inline-block;width:6px;height:17px;border-radius:4px;background:var(--orange);margin-right:9px;vertical-align:middle}
.announce-title span{color:#fff;background:var(--orange);padding:4px 10px;border-radius:4px;font-size:11px;font-weight:700}
.announce-title .announce-current{animation:announce-current-blink 1.8s ease-in-out infinite}
@keyframes announce-current-blink{0%,100%{opacity:1}50%{opacity:.25}}
@media(prefers-reduced-motion:reduce){.announce-title .announce-current{animation:none}}
.announce-list{height:245px;overflow-x:hidden;overflow-y:auto;scrollbar-color:#eb6d1f transparent;scrollbar-width:thin}
.announce-list::-webkit-scrollbar{width:6px}.announce-list::-webkit-scrollbar-thumb{border-radius:10px;background:#eb6d1f}.announce-list::-webkit-scrollbar-track{background:transparent}
.announce-list__empty{padding:24px 18px;color:#737d8f;font-size:12px;text-align:center}
.announce-list article{display:grid;grid-template-columns:56px 1fr;min-height:53px;border-bottom:1px solid #e9ecf0}
.announce-list time{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff8f3;color:var(--orange);font-size:11px;line-height:12px}
.announce-list time b{font-size:14px}
.announce-list article:nth-child(odd) time{color:var(--green);background:#f5faf5}
.announce-list a{display:flex;align-items:center;padding:10px;color:#111827;text-decoration:none;font-weight:500}
.all-link{height:32px;margin:10px 20px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;background:#fff2ea;color:var(--orange);text-decoration:none;border-radius:8px;font-size:12px;font-weight:600}
.quick{background:#f4f6f8;padding:20px 0}
.quick-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.quick a{height:111px;border-radius:13px;background:var(--orange);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-decoration:none;box-shadow:0 8px 15px rgba(237,109,29,.18);font-weight:600}
.quick i{font-size:26px;font-style:normal;margin-bottom:12px}
.news-section{background:#f0f2f5;padding:36px 0 32px}
.news-layout{display:grid;grid-template-columns:1fr 200px;gap:24px}
.section-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}
.section-heading h2,.magazine h2{margin:0;font-size:25px;font-weight:700}
.section-heading p,.magazine>p{color:#9aa3b6;margin:3px 0 0;font-size:12px}
.section-heading>a{color:var(--orange);text-decoration:none;margin-top:12px}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}
.news-card{border-radius:12px;overflow:hidden;background:#fff}
.news-card>img,.news-card>.news-card__image img{width:100%;height:161px;object-fit:cover}
.news-card>div{padding:15px 17px}
.news-card time{color:var(--green);font-size:12px}
.news-card h3{font-size:14px;line-height:20px;margin:8px 0}
.news-card p{font-size:12px;line-height:18px;color:#7b8495;height:40px}
.news-card a{color:var(--orange);text-decoration:none;font-size:12px;font-weight:600}
.magazine>div{height:364px;background:#141b2b;border-radius:12px;overflow:hidden;color:white;display:flex;flex-direction:column}
.magazine img{width:100%;height:270px;object-fit:cover}
.magazine strong{padding:10px 15px 0}
.magazine small{padding:3px 15px}
.services{padding:35px 0 45px}
.round-arrows{font-size:24px}
.round-arrows b{display:inline-flex;width:36px;height:36px;border-radius:50%;background:#151d2e;color:#fff;align-items:center;justify-content:center}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.service-grid article{height:212px;border:1px solid #dce9dc;border-radius:14px;padding:24px;box-shadow:0 3px 7px rgba(0,0,0,.06)}
.service-grid article:nth-child(even){border-color:#f6ddce}
.service-grid i{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#eaf5e9;color:var(--green);font-size:25px;font-style:normal}
.service-grid article:nth-child(even) i{background:#fff0e7;color:var(--orange)}
.service-grid h3{font-size:14px;margin:17px 0 8px}
.service-grid p{font-size:12px;color:#737d8f;line-height:20px;height:40px}
.service-grid a{font-size:12px;color:var(--green);text-decoration:none;font-weight:600}
.service-grid article:nth-child(even) a{color:var(--orange)}
.calendars{background:#f0f2f5;padding:32px 0}
.calendar-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.calendar-card{background:#fff;border:1px solid #dde2e7;border-radius:14px;overflow:hidden}
.calendar-card header{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #e4e7eb}
.calendar-card h3{font-size:16px;margin:0}
.calendar-card h3 i{font-style:normal;background:#fff0e7;color:var(--orange);padding:8px;border-radius:8px;margin-right:10px}
.calendar-card header a{color:var(--orange);text-decoration:none}
.calendar-card.green h3 i,.calendar-card.green header a{color:var(--green);background:#edf7ed}
.event-list{padding:8px 20px}
.event-list article{height:64px;display:grid;grid-template-columns:52px 1fr auto;align-items:center}
.event-list time{display:flex;flex-direction:column;color:var(--orange);line-height:14px}
.green .event-list time{color:var(--green)}
.event-list time b{font-size:16px}
.event-list article>div{border-left:1px solid #e7e9ed;padding-left:14px}
.event-list strong,.event-list small{display:block}
.event-list strong{font-size:13px}
.event-list small{font-size:11px;color:#a0a8b5;margin-top:4px}
.event-list article>span{background:#f3f3f3;color:#b6b6b6;border-radius:10px;padding:3px 8px;font-size:11px}
.form-link{margin:0 16px 16px;height:42px;border:1px solid #f3c9b0;border-radius:11px;background:#fff6f0;color:var(--orange);display:flex;align-items:center;justify-content:center;text-decoration:none;font-weight:600}
.green .form-link{border-color:#c5ddc9;background:#f1f8f2;color:var(--green)}
.sanho{background:#101929;color:#fff !important;padding:40px 0}
.sanho-grid{display:grid;grid-template-columns:2fr 1fr;gap:80px}
.eyebrow{display:inline-block;border:1px solid #194d2b;background:#132b25;color:#2d9b43;border-radius:20px;padding:7px 14px;font-size:12px;letter-spacing:1px}
.sanho h2{font-size:38px;line-height:46px;margin:16px 0}
.sanho h2 em{color:#2d8c36;font-style:normal}
.sanho-grid>div>p{color:#9bb2d1;line-height:26px;max-width:630px}
.green-btn,.outline-btn{display:inline-flex;margin:15px 8px 0 0;padding:12px 20px;border-radius:10px;text-decoration:none;font-weight:600}
.green-btn{background:#2d8c36;color:white}
.outline-btn{border:1px solid #536076;color:white}
.support-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.support-grid article{border:1px solid #303b4d;background:#1c2637;border-radius:12px;padding:16px}
.support-grid i{display:flex;width:40px;height:40px;align-items:center;justify-content:center;background:#173e2b;color:#28913a;border-radius:9px;font-style:normal;font-size:19px}
.support-grid strong{display:block;margin:13px 0 0}
.support-grid p{color:#9bb2d1;font-size:11px;line-height:20px;margin:6px 0}
.stats{background-color:#1b2436;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:40px 40px;color:white}
.stats .container{height:153px !important;display:grid;grid-template-columns:repeat(4,1fr);align-items:center}
.stats .container>div{text-align:center;border-right:1px solid #2d3749}
.stats .container>div:last-child{border:0}
.stats strong{display:block;color:var(--orange);font-size:40px}
.stats span{color:#8e98aa;font-size:12px;font-weight:700;letter-spacing:1px}
.membership{background:#f6f7f9;padding:32px 0}
.membership-card{display:grid;grid-template-columns:300px 1fr;padding:0!important;background:white;border:1px solid #dde2e7;border-radius:14px;overflow:hidden}
.membership-intro{padding:28px;background:#1d2638;color:white}
.membership-intro h2{font-size:21px}
.membership-intro p{font-size:12px;color:#9eb3d0;line-height:20px}
.membership-intro a{display:flex;justify-content:center;padding:12px;background:var(--orange);color:#fff;border-radius:8px;text-decoration:none;font-weight:600}
.membership-card>div:last-child{padding:28px}
.membership-card h3{color:var(--green);font-size:12px;letter-spacing:1px}
.benefits{display:grid;gap:15px;color:#596579}
.benefits span::first-letter{color:var(--green)}
footer{border-top:4px solid var(--orange);background:#1b2436;color:#9eb3d0;padding:38px 0 18px}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;gap:60px}
.footer-grid img{width:170px;filter:grayscale(1) brightness(2)}
.footer-grid p{font-size:12px;line-height:20px}
.footer-grid h3{font-size:12px;color:#fff;letter-spacing:1px;border-bottom:2px solid var(--orange);padding-bottom:12px}
.footer-grid a{display:block;color:#9eb3d0;text-decoration:none;font-size:12px;margin:13px 0}
.copyright{border-top:1px solid #313a4b;margin-top:30px;padding-top:22px;display:flex;justify-content:space-between;font-size:11px}
@media(max-width:991px){
    .topbar{display:none}
    .main-header{height:70px}
    .brand{border:0}
    .desktop-nav{display:none;position:absolute;top:70px;left:0;right:0;background:#fff;padding:20px;box-shadow:0 10px 25px #0002}
    .desktop-nav.open{display:block}
    .desktop-nav ul{display:block}
    .desktop-nav li{display:block;padding:10px}
    .header-actions{display:none}
    .mobile-toggle{display:block;margin-left:auto;border:0;background:transparent;font-size:26px}
    .hero-grid,.news-layout,.calendar-grid,.sanho-grid{grid-template-columns:1fr}
    .hero-card{height:420px}
    .hero-card img{height:420px}
    .side-panel{height:auto}
    .quick-grid{grid-template-columns:repeat(3,1fr)}
    .news-grid{grid-template-columns:1fr 1fr}
    .magazine{display:none}
    .service-grid{grid-template-columns:1fr 1fr}
    .sanho-grid{gap:35px}
    .membership-card{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr 1fr}
    .copyright{gap:20px}
}
@media(max-width:575px){
    .container{padding-left:16px!important;padding-right:16px!important}
    .brand img{width:145px}
    .hero-section{padding-top:10px}
    .hero-card{height:310px}
    .hero-card img{height:310px}
    .hero-caption{font-size:19px}
    .quick-grid{grid-template-columns:1fr 1fr}
    .quick a{height:88px}
    .news-grid,.service-grid,.support-grid{grid-template-columns:1fr}
    .service-grid article{height:auto}
    .event-list article{grid-template-columns:45px 1fr}
    .event-list article>span{display:none}
    .sanho h2{font-size:31px;line-height:38px}
    .stats .container{height:auto;grid-template-columns:1fr 1fr;padding:25px 0}
    .stats strong{font-size:35px}
    .benefits,.footer-grid{grid-template-columns:1fr}
    .copyright{flex-direction:column}.topbar+.main-header{top:0}
}
.desktop-nav h2{display:none}
.desktop-nav .navbar-nav{flex-direction:row!important;gap:24px}
.desktop-nav .navbar-nav>li:first-child{display:none}
.desktop-nav .navbar-nav .nav-link{white-space:nowrap;padding-left:0;padding-right:0}
.brand{width:190px;margin-right:28px}
.header-actions button{margin-right:12px}

/* KTSO member login */
.login-page{min-height:100vh;display:flex;flex-direction:column;background:#f4f6f8}
.login-header{height:88px;background:#fff;border-top:4px solid var(--orange);border-bottom:1px solid #e6e9ed}
.login-header__inner{height:84px;display:flex;align-items:center;justify-content:space-between}
.login-brand img{width:178px;height:68px;object-fit:contain}
.login-back{display:flex;align-items:center;gap:9px;color:#344054;text-decoration:none;font-size:13px;font-weight:600}
.login-back span{width:34px;height:34px;display:grid;place-items:center;border:1px solid #dfe4ea;border-radius:50%;color:var(--orange);font-size:18px;transition:.2s}
.login-back:hover{color:var(--orange)}
.login-back:hover span{background:var(--orange);border-color:var(--orange);color:#fff}
.login-main{position:relative;isolation:isolate;flex:1;display:flex;align-items:center;overflow:hidden;padding:54px 0;background:linear-gradient(118deg,#101929 0,#101929 48%,#f4f6f8 48.1%,#f4f6f8 100%)}
.login-main:before{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.027) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.027) 1px,transparent 1px);background-size:42px 42px}
.login-decoration{position:absolute;z-index:-1;border-radius:50%}
.login-decoration--one{width:340px;height:340px;left:-140px;bottom:-150px;border:65px solid rgba(237,109,29,.08)}
.login-decoration--two{width:220px;height:220px;left:38%;top:-120px;border:45px solid rgba(39,134,51,.08)}
.login-layout{display:grid;grid-template-columns:minmax(0,1fr) 500px;align-items:center;gap:120px}
.login-intro{max-width:560px;color:#fff}
.login-eyebrow{display:inline-flex;padding:7px 13px;border:1px solid #225233;border-radius:18px;background:#142b26;color:#3ba14c;font-size:11px;font-weight:700;letter-spacing:1.3px}
.login-intro h1{margin:22px 0 17px;font-size:47px;line-height:1.13;letter-spacing:-1.8px;font-weight:700}
.login-intro h1 em{color:#39a249;font-style:normal}
.login-intro>p{max-width:520px;color:#a9bad2;font-size:15px;line-height:1.8}
.login-intro ul{display:grid;gap:14px;margin:29px 0 0;padding:0;list-style:none;color:#d9e2ef}
.login-intro li{display:flex;align-items:center;gap:11px;font-size:13px}
.login-intro li span{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#183c2a;color:#43ae55;font-size:11px}
.login-card{position:relative;padding:39px 43px 32px;background:#fff;border:1px solid #e0e4e9;border-radius:18px;box-shadow:0 22px 60px rgba(16,24,40,.14)}
.login-card:before{content:'';position:absolute;left:43px;right:43px;top:0;height:4px;background:linear-gradient(90deg,var(--orange) 0 64%,var(--green) 64%);border-radius:0 0 5px 5px}
.login-card__icon{width:52px;height:52px;display:grid;place-items:center;margin-bottom:20px;border-radius:14px;background:#fff0e7;color:var(--orange);font-size:25px}
.login-card__heading h2{margin:0;font-size:26px;font-weight:700;letter-spacing:-.5px}
.login-card__heading p{margin:8px 0 25px;color:#8a94a6;font-size:13px}
.login-form-wrapper .block-local-tasks-block,.login-form-wrapper .nav-tabs,.login-form-wrapper>h1,.login-form-wrapper .page-title{display:none}
.login-form-wrapper form{margin:0}
.login-form-wrapper .form-item{margin-bottom:19px}
.login-form-wrapper label{display:block;margin:0 0 8px;color:#273142;font-size:12px;font-weight:700}
.login-form-wrapper input.form-control{height:48px;padding:0 15px;border:1px solid #d9dee6;border-radius:10px;background:#fbfcfd;color:#111827;font-size:14px;box-shadow:none}
.login-form-wrapper input.form-control:focus{border-color:var(--orange);background:#fff;box-shadow:0 0 0 3px rgba(237,109,29,.11)}
.login-form-wrapper .description{margin-top:7px;color:#98a1b1;font-size:10px;line-height:1.5}
.login-form-wrapper .form-actions{margin:23px 0 0}
.login-form-wrapper .button,.login-form-wrapper button[type=submit],.login-form-wrapper input[type=submit]{width:100%;height:49px;border:0!important;border-radius:10px!important;background:var(--orange)!important;color:#fff!important;font-size:14px;font-weight:700;box-shadow:0 7px 16px rgba(237,109,29,.23);transition:.2s}
.login-form-wrapper .button:hover,.login-form-wrapper button[type=submit]:hover,.login-form-wrapper input[type=submit]:hover{background:#d95c10!important;transform:translateY(-1px)}
.login-form-wrapper .alert{border-radius:9px;font-size:12px}
.login-help{margin-top:27px;padding-top:22px;border-top:1px solid #eceff2;text-align:center;font-size:12px}
.login-help span{color:#8d96a7}
.login-help a{display:block;margin-top:7px;color:var(--green);font-weight:700;text-decoration:none}
.login-messages:empty,.login-messages .block-local-tasks-block{display:none}
.login-footer{background:#fff;border-top:1px solid #e3e6ea;color:#7b8595;font-size:11px}
.login-footer .container{min-height:58px;display:flex;align-items:center;justify-content:space-between}
.login-footer a{margin-left:22px;color:#7b8595;text-decoration:none}
.login-footer a:hover{color:var(--orange)}
@media(max-width:991px){
    .login-main{background:#101929;padding:45px 0}
    .login-layout{grid-template-columns:1fr;gap:35px}
    .login-intro{max-width:680px;text-align:center;margin:auto}
    .login-intro h1{font-size:38px}
    .login-intro>p{margin-left:auto;margin-right:auto}
    .login-intro ul{grid-template-columns:repeat(3,1fr);text-align:left}
    .login-card{width:min(100%,540px);margin:auto}
}
@media(max-width:575px){
    .login-header{height:74px}
    .login-header__inner{height:70px}
    .login-brand img{width:145px;height:58px}
    .login-back{font-size:0}
    .login-back span{font-size:18px}
    .login-main{align-items:flex-start;overflow:visible;padding:32px 0}
    .login-intro h1{font-size:31px}
    .login-intro>p{font-size:13px}
    .login-intro ul{display:none}
    .login-card{padding:32px 22px 25px;border-radius:14px}
    .login-card:before{left:22px;right:22px}
    .login-footer .container{padding-top:16px!important;padding-bottom:16px!important;flex-direction:column;gap:10px;text-align:center}
    .login-footer a:first-child{margin-left:0}
}

.header-actions .join:hover{
    background: rgb(46,125,50);
}

.region-sidebar-first, .region-sidebar-second, .region-footer, .region-content {
    padding: 0 0 !important;
}
.whatsapp-hover .wp-btn {
    display: block;
    background-color: #25d366;
    border-radius: 40px;
    border:3px solid #fff;
    transition: background 400ms ease;
    padding: 2px;
    box-shadow:; 2px 2px 6px #0005;
}
.whatsapp-hover .wp-btn i:before {
    width: 50px;
    height: 50px;
    text-align: center;
    font-size: 36px;
    line-height: 50px;
}
.whatsapp-hover a:hover .wp-btn{
    background-color: #19a04c;
}