/* Katen 1.2 editorial modules */
:root{--katen-pro-bg:#fff;--katen-pro-surface:#f4f9fb;--katen-pro-text:#203656;--katen-pro-muted:#7a8495;--katen-pro-border:#dce9ee;--katen-pro-accent:#2d83a3;--katen-pro-accent-2:#34a3cf;--katen-pro-shadow:0 12px 30px rgba(32,54,86,.09)}
body.dark{--katen-pro-bg:#17202f;--katen-pro-surface:#202b3c;--katen-pro-text:#f6f8fb;--katen-pro-muted:#aab4c4;--katen-pro-border:#354156;--katen-pro-shadow:0 14px 34px rgba(0,0,0,.3)}
.katen-inline-processed[hidden]{display:none!important}
.katen-inline-related{clear:both;margin:30px 0;padding:20px;border:1px solid var(--katen-pro-border);border-radius:14px;background:var(--katen-pro-surface);color:var(--katen-pro-text)}
.katen-inline-related__label{display:block;margin-bottom:14px;font-size:14px;letter-spacing:.04em;text-transform:uppercase;color:var(--katen-pro-accent)}
.katen-inline-related__items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.katen-inline-related--3{border-left:5px solid var(--katen-pro-accent)}
.katen-inline-related--4{padding:16px 0;border-width:1px 0 0;border-radius:0;background:transparent}
.katen-inline-related--4 .katen-pro-card:last-child{border-bottom:0}
.katen-inline-related--5 .katen-inline-related__items{grid-template-columns:repeat(2,minmax(0,1fr))}
.katen-inline-related.no-image .katen-pro-card__media,.katen-inline-related.no-category .katen-pro-card__category,.katen-inline-related.no-date .katen-pro-card time,.katen-inline-related.no-excerpt .katen-pro-card__body p{display:none!important}.katen-inline-related.has-excerpt .katen-pro-card__body p{display:block}.katen-inline-related.no-image .katen-pro-card--3,.katen-inline-related.no-image .katen-pro-card--5{display:block}.katen-inline-related.no-image .katen-pro-card__body{padding:14px}
.katen-inline-ad{clear:both;margin:30px 0;text-align:center;overflow:hidden}
.katen-inline-ad__label{display:block;margin-bottom:8px;color:var(--katen-pro-muted);font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.katen-inline-ad img{display:block;width:auto;max-width:100%;height:auto;margin:auto;border-radius:10px}
@media(min-width:769px){.katen-inline-ad--mobile{display:none!important}}@media(max-width:768px){.katen-inline-ad--desktop{display:none!important}}
.katen-pro-module{margin:28px 0;color:var(--katen-pro-text)}
.katen-pro-module__head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}
.katen-pro-module__head h2{margin:0;font-size:24px;color:var(--katen-pro-text)}
.katen-pro-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.katen-pro-card{position:relative;min-width:0;overflow:hidden;border:1px solid var(--katen-pro-border);border-radius:13px;background:var(--katen-pro-bg);box-shadow:var(--katen-pro-shadow)}
.katen-pro-card__media{display:block;overflow:hidden;aspect-ratio:16/10;background:var(--katen-pro-surface)}
.katen-pro-card__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s ease}
.katen-pro-card:hover .katen-pro-card__media img{transform:scale(1.035)}
.katen-pro-card__body{padding:16px}
.katen-pro-card__category{display:inline-block;margin-bottom:8px;color:var(--katen-pro-accent);font-size:11px;font-weight:700;text-transform:uppercase}
.katen-pro-card__title{margin:0 0 8px;font-size:17px;line-height:1.4;color:var(--katen-pro-text)}
.katen-pro-card__title a{color:inherit;text-decoration:none}
.katen-pro-card__body p{margin:8px 0;color:var(--katen-pro-muted);font-size:13px;line-height:1.6}
.katen-pro-card time{color:var(--katen-pro-muted);font-size:11px}
.katen-pro-card--2 .katen-pro-card__body{position:absolute;inset:auto 0 0;padding:40px 16px 16px;background:linear-gradient(transparent,rgba(10,17,30,.92));color:#fff}
.katen-pro-card--2 .katen-pro-card__title,.katen-pro-card--2 .katen-pro-card__category,.katen-pro-card--2 time{color:#fff}
.katen-pro-card--2 .katen-pro-card__media{aspect-ratio:4/3}
.katen-pro-card--3{display:grid;grid-template-columns:42% 1fr}
.katen-pro-card--3 .katen-pro-card__media{height:100%;aspect-ratio:auto}
.katen-pro-card--4{box-shadow:none;border-width:0 0 1px;border-radius:0;background:transparent}
.katen-pro-card--4 .katen-pro-card__media{display:none}
.katen-pro-card--4 .katen-pro-card__body{padding:12px 0}
.katen-pro-card--5{display:grid;grid-template-columns:90px 1fr;box-shadow:none}
.katen-pro-card--5 .katen-pro-card__media{height:100%;aspect-ratio:1}
.katen-pro-card--5 .katen-pro-card__body{padding:10px}
.katen-pro-card--5 .katen-pro-card__title{font-size:14px}
.katen-pro-module--carousel .katen-pro-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 12px}
.katen-pro-module--carousel .katen-pro-card{flex:0 0 min(320px,82vw);scroll-snap-align:start}
.katen-pro-carousel-nav{display:flex;gap:7px}
.katen-pro-carousel-nav button,.katen-news-ticker__nav button{width:34px;height:34px;border:1px solid var(--katen-pro-border);border-radius:50%;background:var(--katen-pro-bg);color:var(--katen-pro-text);line-height:1;cursor:pointer}
.katen-collaboration{margin:28px 0;padding:20px;border:1px solid var(--katen-pro-border);border-radius:14px;background:var(--katen-pro-surface);color:var(--katen-pro-text)}
.katen-collaboration>strong{display:block;margin-bottom:12px;color:var(--katen-pro-accent)}
.katen-collaboration__summary{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.katen-collaboration a{display:inline-flex;align-items:center;gap:7px;color:var(--katen-pro-text);font-weight:600;text-decoration:none}
.katen-collaboration img{border-radius:50%}
.katen-collaboration button{padding:6px 10px;border:0;border-radius:20px;background:var(--katen-pro-accent);color:#fff;cursor:pointer}
.katen-collaboration__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:15px;padding-top:15px;border-top:1px solid var(--katen-pro-border)}
.katen-collaboration__list[hidden]{display:none}
.katen-collaboration__list small{display:block;color:var(--katen-pro-muted);font-size:11px;font-weight:400}
.katen-post-authors{display:inline-flex;align-items:center;gap:8px}.katen-post-authors__names{display:inline-flex;align-items:center;gap:4px}.katen-post-authors__names a{font-weight:600}
.katen-author-stack{display:grid;flex:0 0 auto;width:34px;height:34px;overflow:hidden;border-radius:50%;background:var(--katen-pro-surface)}
.katen-author-stack--1{grid-template-columns:1fr}.katen-author-stack--2{grid-template-columns:repeat(2,1fr)}.katen-author-stack--3,.katen-author-stack--4{grid-template-columns:repeat(2,1fr)}
.katen-author-stack .avatar{width:100%!important;height:100%!important;min-width:0;object-fit:cover;border:1px solid var(--katen-pro-bg);border-radius:0!important;margin:0!important}.katen-author-stack--3 .avatar{height:17px!important}.katen-author-stack--4 .avatar{height:17px!important}
.katen-collaboration__summary>.katen-author-stack{width:40px;height:40px}.katen-collaboration__names{display:inline-flex;flex-wrap:wrap;gap:4px;align-items:center}.katen-collaboration__names a{font-weight:700}
.katen-author-boxes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:18px;margin:28px 0}.katen-author-boxes--1{grid-template-columns:1fr}.katen-author-box{display:flex;align-items:flex-start;gap:18px;min-width:0;padding:24px;border:1px solid var(--katen-pro-border);border-radius:14px;background:var(--katen-pro-surface)}.katen-author-box__avatar{flex:0 0 86px}.katen-author-box__avatar img{width:86px;height:86px;object-fit:cover;border-radius:50%}.katen-author-box__details{min-width:0;flex:1}.katen-author-box__details h3{margin:0 0 8px;font-size:20px}.katen-author-box__details p{margin:0 0 12px}.katen-author-box__links{display:flex;align-items:center;flex-wrap:wrap;gap:9px}.katen-author-box__links a{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:1px solid var(--katen-pro-border);border-radius:50%;background:var(--katen-pro-bg);color:var(--katen-pro-accent);font-size:14px;line-height:1;vertical-align:middle}.katen-author-box__links a:hover,.katen-author-box__links a:focus-visible{border-color:transparent;background:linear-gradient(135deg,var(--katen-pro-accent),var(--katen-pro-accent-2));color:#fff}.katen-author-box__links i{margin:0;line-height:1}
.katen-author-box__role{display:block;margin:-5px 0 9px;color:var(--katen-pro-accent);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.katen-share-open{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid var(--katen-pro-border);border-radius:24px;background:var(--katen-pro-bg);color:var(--katen-pro-text);font-weight:600;cursor:pointer}
.katen-share-dialog{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;padding:20px}
.katen-share-dialog[hidden]{display:none}
.katen-share-dialog__backdrop{position:absolute;inset:0;background:rgba(8,15,28,.68);backdrop-filter:blur(3px)}
.katen-share-dialog__panel{position:relative;width:min(520px,100%);max-height:90vh;overflow:auto;padding:24px;border:1px solid var(--katen-pro-border);border-radius:18px;background:var(--katen-pro-bg);color:var(--katen-pro-text);box-shadow:0 24px 70px rgba(0,0,0,.3)}
.katen-share-dialog__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.katen-share-dialog__head h2{margin:0;color:var(--katen-pro-text);font-size:23px}
.katen-share-dialog__head button{width:38px;height:38px;border:0;border-radius:50%;background:var(--katen-pro-surface);color:var(--katen-pro-text);font-size:25px;cursor:pointer}
.katen-share-dialog__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.katen-share-dialog__grid a,.katen-share-dialog__grid button{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 8px;border:1px solid var(--katen-pro-border);border-radius:12px;background:var(--katen-pro-bg);color:var(--katen-pro-text);font:inherit;font-size:12px;font-weight:600;text-decoration:none;cursor:pointer}
.katen-share-dialog__grid a:hover,.katen-share-dialog__grid button:hover{border-color:var(--katen-pro-accent);color:var(--katen-pro-accent)}
.katen-share-dialog__grid span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--katen-pro-surface);font-weight:800}
.katen-share-dialog__copy{display:flex;gap:8px;margin-top:16px}
.katen-share-dialog__copy input{min-width:0;flex:1;padding:10px;border:1px solid var(--katen-pro-border);border-radius:8px;background:var(--katen-pro-surface);color:var(--katen-pro-text)}
.katen-share-dialog__copy button{padding:10px 14px;border:0;border-radius:8px;background:var(--katen-pro-accent);color:#fff;white-space:nowrap;cursor:pointer}
.katen-share-dialog__status{min-height:20px;margin:8px 0 0;color:var(--katen-pro-muted);font-size:12px}
.katen-news-ticker{display:flex;align-items:center;min-height:52px;margin:20px 0;overflow:hidden;border:1px solid var(--katen-pro-border);border-radius:12px;background:var(--katen-ticker-custom-bg,var(--katen-pro-bg));color:var(--katen-ticker-custom-text,var(--katen-pro-text))}
.katen-news-ticker__label{align-self:stretch;display:flex;align-items:center;padding:0 18px;background:var(--katen-ticker-custom-label-bg,var(--katen-pro-accent));color:var(--katen-ticker-custom-label-color,#fff);white-space:nowrap;font-weight:700;letter-spacing:.02em}
.katen-news-ticker__viewport{min-width:0;flex:1;overflow:hidden}
.katen-news-ticker__track a{display:none;align-items:center;gap:12px;padding:0 16px;color:var(--katen-ticker-custom-text,var(--katen-pro-text));text-decoration:none;transition:color .2s ease}
.katen-news-ticker__track a:hover{color:var(--katen-pro-accent)}
.katen-news-ticker__track a.is-active{display:flex}
.katen-news-ticker__img{width:32px;height:32px;border-radius:6px;object-fit:cover;flex-shrink:0;box-shadow:0 1px 3px rgba(0,0,0,.15);display:inline-block}
.katen-news-ticker__img--placeholder{background:var(--katen-pro-surface,#f1f5f9);display:inline-flex;align-items:center;justify-content:center;color:var(--katen-pro-accent,#2d83a3);font-size:14px}
.katen-news-ticker--no-image .katen-news-ticker__img{display:none!important}
.katen-news-ticker--no-title .katen-news-ticker__title{display:none!important}
.katen-news-ticker--no-time time,.katen-news-ticker--no-time .katen-news-ticker__time{display:none!important}
.katen-news-ticker time,.katen-news-ticker .katen-news-ticker__time{color:var(--katen-pro-muted);font-size:11px;white-space:nowrap;background:rgba(0,0,0,.04);padding:2px 7px;border-radius:4px}
.katen-news-ticker__title{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.katen-news-ticker__nav{display:flex;gap:5px;padding-right:10px}
.katen-news-ticker--2{background:linear-gradient(135deg,#2d83a3,#34a3cf);border:0;color:#fff}.katen-news-ticker--2 .katen-news-ticker__label{background:rgba(0,0,0,.18)}.katen-news-ticker--2 a,.katen-news-ticker--2 time{color:#fff}.katen-news-ticker--2 time{background:rgba(255,255,255,.15)}
.katen-news-ticker--3{border-width:2px}.katen-news-ticker--3 .katen-news-ticker__label{margin:6px;border-radius:8px}
.katen-news-ticker--4{border-width:1px 0;border-radius:0;box-shadow:none}.katen-news-ticker--4 .katen-news-ticker__label{background:transparent;color:var(--katen-pro-accent)}
.katen-news-ticker--5{background:#111a29;border-color:#2c3748;color:#fff}.katen-news-ticker--5 a,.katen-news-ticker--5 time{color:#fff}.katen-news-ticker--5 .katen-news-ticker__label{background:#2d83a3}.katen-news-ticker--5 time{background:rgba(255,255,255,.1)}
.katen-news-ticker--6{background:#1c1d1f;border:1px solid #3e4143;color:#fff;border-radius:10px}.katen-news-ticker--6 .katen-news-ticker__label{background:linear-gradient(135deg,#a435f0,#7925c7);color:#fff;font-weight:700}.katen-news-ticker--6 a{color:#f7f9fa}.katen-news-ticker--6 a:hover{color:#d8b4fe}.katen-news-ticker--6 time{color:#cbd5e1;background:rgba(255,255,255,.12)}
.katen-news-ticker--7{background:#fff;border:1px solid #e2e8f0;border-radius:9999px;box-shadow:0 2px 8px rgba(0,0,0,.04);color:#1e293b}.katen-news-ticker--7 .katen-news-ticker__label{border-radius:9999px;margin:4px 6px;padding:0 14px;background:#0ea5e9;font-weight:700}
.katen-smart-link{font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.katen-language-switcher{display:inline-flex;gap:8px;align-items:center}.katen-language-switcher a{padding:5px 9px;border:1px solid var(--katen-pro-border);border-radius:16px;color:var(--katen-pro-text);font-size:12px;text-decoration:none}.katen-language-switcher a[aria-current=true]{background:var(--katen-pro-accent);color:#fff}
body.katen-modal-open{overflow:hidden}
.katen-share-network--whatsapp span{color:#25d366}.katen-share-network--facebook span{color:#1877f2}.katen-share-network--x span,.katen-share-network--threads span{color:#111}.katen-share-network--telegram span{color:#229ed9}.katen-share-network--linkedin span{color:#0a66c2}.katen-share-network--email span,.katen-share-network--print span{color:var(--katen-pro-accent)}
.katen-share-network--pinterest span{color:#e60023}.katen-share-network--native span,.katen-share-network--citation span{color:var(--katen-pro-accent-2)}body.dark .katen-share-network--x span,body.dark .katen-share-network--threads span{color:#fff}
.katen-after-content{margin:28px 0;padding:22px;border:1px solid var(--katen-pro-border);border-radius:14px;background:var(--katen-pro-bg);box-shadow:var(--katen-pro-shadow);text-align:center}.katen-after-content p{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:8px 0}.katen-after-content--left{text-align:left}.katen-after-content--left p{justify-content:flex-start}.katen-after-content--center{text-align:center}.katen-after-content--center p{justify-content:center}.katen-after-content--right{text-align:right}.katen-after-content--right p{justify-content:flex-end}.katen-after-content i{flex:0 0 auto;margin:0;color:var(--katen-pro-accent);font-size:22px;line-height:1}.katen-after-content .fa-whatsapp{color:#25d366}
.katen-native-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:stretch;min-height:360px;margin:30px 0;overflow:hidden;border-radius:20px;background:linear-gradient(135deg,#e9f6fa,#f8fcfd);color:var(--katen-pro-text)}.katen-native-hero__media img{width:100%;height:100%;min-height:360px;object-fit:cover}.katen-native-hero__content{display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,5vw,64px)}.katen-native-hero__content h2{margin:0 0 14px;font-size:clamp(28px,4vw,48px);color:var(--katen-pro-text)}.katen-native-hero__content p{font-size:17px}.katen-native-button{align-self:flex-start;padding:12px 20px;border-radius:999px;background:linear-gradient(135deg,var(--katen-pro-accent),var(--katen-pro-accent-2));color:#fff!important;font-weight:700}.katen-native-hero--2{grid-template-columns:1fr;background:#18384a;color:#fff}.katen-native-hero--2 .katen-native-hero__media{grid-area:1/1}.katen-native-hero--2 .katen-native-hero__content{grid-area:1/1;z-index:1;background:linear-gradient(90deg,rgba(10,32,44,.9),rgba(10,32,44,.2))}.katen-native-hero--2 h2{color:#fff}.katen-native-hero--3{grid-template-columns:1fr}.katen-native-hero--3 .katen-native-hero__content{order:-1;text-align:center}.katen-native-hero--3 .katen-native-button{align-self:center}.katen-native-hero--4{border:1px solid var(--katen-pro-border);background:var(--katen-pro-bg)}.katen-native-hero--5{grid-template-columns:1fr;text-align:center}.katen-native-hero--5 .katen-native-hero__media{display:none}.katen-native-hero--5 .katen-native-button{align-self:center}
.katen-category-showcase{margin:36px 0}.katen-category-showcase__head{display:flex;align-items:center;justify-content:space-between;gap:16px}.katen-category-showcase__head h2{margin:0 0 18px}.katen-category-showcase__nav{display:flex;gap:8px}.katen-category-showcase__nav button{width:36px;height:36px;border:1px solid var(--katen-pro-border);border-radius:50%;background:var(--katen-pro-bg);color:var(--katen-pro-text);cursor:pointer}.katen-category-showcase__track{display:flex;gap:16px;overflow-x:auto;padding:2px 2px 14px;scroll-snap-type:x mandatory;scrollbar-width:thin}.katen-category-card{flex:0 0 210px;overflow:hidden;border:1px solid var(--katen-pro-border);border-radius:14px;background:var(--katen-pro-bg);scroll-snap-align:start}.katen-category-card a{display:block;color:var(--katen-pro-text)}.katen-category-card img,.katen-category-card__placeholder{display:grid;place-items:center;width:100%;height:135px;object-fit:cover;background:linear-gradient(135deg,var(--katen-pro-accent),var(--katen-pro-accent-2));color:#fff;font-size:48px;font-weight:800}.katen-category-card__title,.katen-category-card small{display:block;padding:12px 14px 0;font-weight:700}.katen-category-card small{padding:3px 14px 14px;color:var(--katen-pro-muted);font-weight:400}.katen-category-showcase--2 .katen-category-card{border-radius:50% 50% 14px 14px}.katen-category-showcase--3 .katen-category-card{flex-basis:280px}.katen-category-showcase--4 .katen-category-card{box-shadow:var(--katen-pro-shadow)}.katen-category-showcase--5 .katen-category-card{flex-basis:170px}.katen-skip-link{position:fixed;left:12px;top:12px;z-index:100000;transform:translateY(-160%);padding:10px 16px;background:#fff;color:#203656;border:2px solid var(--katen-pro-accent);border-radius:6px}.katen-skip-link:focus{transform:none}.katen-pro-card a:focus-visible,.katen-native-button:focus-visible,.katen-category-card a:focus-visible,button:focus-visible{outline:3px solid var(--katen-pro-accent-2)!important;outline-offset:3px}
a{color:#2d83a3}.post .post-title a{color:var(--katen-pro-text)}a:hover,.post .post-title a:hover{color:#34a3cf}.katen-pro-module a,.post-content a,.katen-after-content a{color:#2d83a3}.btn-default,.navbar-nav li .nav-link.active,.post .category-badge,.post .post-format{background:linear-gradient(135deg,#2d83a3,#34a3cf)!important}.text-logo .dot{color:#34a3cf!important}.single-post .post-header .meta{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 14px;margin-right:auto;margin-left:auto;text-align:center}.single-post .post-header .meta>li,.single-post .post-header .meta>span{display:inline-flex;align-items:center;justify-content:center;gap:6px;margin:0!important}.single-post .post-header .katen-post-authors{align-items:center;justify-content:center}.katen-print-header{display:none}
@media(max-width:991px){.katen-pro-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.katen-pro-card--3{grid-template-columns:38% 1fr}}
@media(max-width:600px){.katen-inline-related__items,.katen-pro-grid,.katen-collaboration__list{grid-template-columns:1fr}.katen-pro-card--3{grid-template-columns:110px 1fr}.katen-share-dialog__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.katen-news-ticker__label{padding:0 10px;font-size:11px}.katen-news-ticker time{display:none}.katen-news-ticker__nav{display:none}.katen-share-dialog__copy{flex-direction:column}.katen-author-box{flex-direction:column}.katen-native-hero{grid-template-columns:1fr}.katen-native-hero__media img{min-height:220px}.katen-native-hero__content{padding:28px}}
@media(prefers-reduced-motion:reduce){.katen-pro-card__media img{transition:none}.katen-share-dialog__backdrop{backdrop-filter:none}}
@media print{@page{margin:18mm}body{background:#fff!important;color:#111!important;font-size:11pt}header,.header-default,.header-personal,.header-classic,.header-minimal,.header-default.clone,.header-personal nav.clone,.header-classic .header-bottom.clone,.main-overlay,.canvas-menu,.search-popup,.reading-bar-wrapper,.switcher-button{display:none!important}.katen-print-header{display:flex!important;align-items:center;justify-content:space-between;gap:24px;margin:0 0 22px;padding:0 0 14px;border-bottom:2px solid #2d83a3;color:#111}.katen-print-header__brand{display:flex;align-items:center;min-width:140px}.katen-print-header__brand img{display:block!important;width:auto!important;max-width:165px!important;height:auto!important;max-height:62px!important;object-fit:contain}.katen-print-header__wordmark{color:#2d83a3;font-family:"Poppins",sans-serif;font-size:22pt;font-weight:700}.katen-print-header__info{display:flex;flex-direction:column;align-items:flex-end;text-align:right;line-height:1.45}.katen-print-header__info strong{font-size:15pt;color:#111}.katen-print-header__info span{display:block;font-size:9.5pt;color:#333}.main-content{padding:0!important;margin:0!important}.main-content>.container-xl{max-width:none!important;padding:0!important}.main-content .row{display:block!important}.main-content .row>[class*=col-]{width:100%!important;max-width:none!important}.main-content .row>.col-md-4,.main-content .row>.col-lg-4,footer.footer,.sidebar,.breadcrumbs,.single-cover:before,.katen-inline-ad,.katen-share-open,.katen-share-dialog,.katen-news-ticker,.katen-pro-carousel-nav,.katen-collaboration,.katen-author-boxes,.katen-after-content,.nextprev-post,.comments,.comment-respond,#comments{display:none!important}.post-header,.post-content,.post-content img,.post-bottom,.post-bottom .tags,.katen-inline-related{display:block!important}.post-header .title{font-size:24pt!important;color:#111!important}.post-header .meta{display:flex!important;justify-content:flex-start!important;font-size:9pt!important;text-align:left!important}.post-content a{color:#111!important;text-decoration:underline}.post-content img{max-width:100%!important;height:auto!important;page-break-inside:avoid}.post-content figure,.post-content table,.post-content blockquote,.katen-inline-related{page-break-inside:avoid}.post-content h2,.post-content h3{page-break-after:avoid}.post-content table{width:100%!important;border-collapse:collapse!important;font-size:9pt}.post-content th,.post-content td{padding:6px!important;border:1px solid #999!important}.post-content figcaption{display:block!important;color:#444!important;font-size:9pt}.katen-inline-related{border:1px solid #bbb!important;background:#fff!important;box-shadow:none!important}.katen-inline-related .katen-pro-card{box-shadow:none!important}.post-bottom{border:0!important;padding:8px 0!important}}
/* Publisher 1.5 */
.katen-badge{display:inline-flex;vertical-align:middle;align-items:center;justify-content:center;width:18px;height:18px;margin-inline-start:4px;border-radius:50%;font:700 12px/1 sans-serif;color:white;background:#1575d1;flex-shrink:0}.katen-badge--yellow{background:#a86f00}.katen-badge--red{background:#c52232}.katen-badge img{width:18px!important;height:18px!important;object-fit:contain;margin:0!important}.katen-author-full{display:flex;gap:10px;flex-wrap:wrap}.katen-author-full>span{display:flex;flex-direction:column}.katen-author-full img{border-radius:50%;margin-inline-end:5px}.katen-author-full small{font-size:11px}.editkt-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}.editkt-module{min-width:0}.editkt-col-12{grid-column:span 12}.editkt-col-6{grid-column:span 6}.editkt-col-4{grid-column:span 4}.editkt-align-left{text-align:left}.editkt-align-center{text-align:center}.editkt-align-right{text-align:right}.load-more [aria-disabled=true]{opacity:.6;pointer-events:none}@media(max-width:767px){.editkt-module{grid-column:span 12}}@media(prefers-reduced-motion:reduce){.katen-ticker *{animation:none!important}}
.katen-print-byline{display:none}
@media print{
 .katen-skip-link,.skip-link,a[href="#katen-main"],#wpadminbar,#preloader,.load-more{display:none!important}
 html,body,.site-wrapper,.main-content,.post-single,.post-content,.post-content>.clearfix{height:auto!important;max-height:none!important;overflow:visible!important;position:static!important;transform:none!important}
 .post-single,.post-content,.post-content>.clearfix{display:block!important;break-inside:auto!important;page-break-inside:auto!important}
 .post-content p,.post-content li,.post-content blockquote{orphans:3;widows:3;break-inside:avoid-page;page-break-inside:avoid;overflow:visible!important;max-height:none!important}
 .post-content h1,.post-content h2,.post-content h3,.post-content h4{break-after:avoid-page;page-break-after:avoid}
 .post-content table{break-inside:auto;page-break-inside:auto}.post-content tr{break-inside:avoid;page-break-inside:avoid}.post-content thead{display:table-header-group}
 .post-content pre{white-space:pre-wrap!important;overflow-wrap:anywhere;overflow:visible!important}
 .katen-print-byline{display:block!important;margin-top:20pt;padding-top:10pt;border-top:1px solid #999;color:#111!important;break-inside:avoid;page-break-inside:avoid;font-size:11pt}
}
@media print{
 .single-cover,.single-cover .cover-content{height:auto!important;min-height:0!important;max-height:none!important;position:static!important;transform:none!important;background:none!important;padding:0!important;margin:0 0 16pt!important;overflow:visible!important;color:#111!important}
 .single-cover .meta,.single-cover .meta a{color:#111!important}
}

/* Editorial archive: the reference layout, including multi-author bylines. */
.katen-archive-list{display:grid;gap:0}.katen-archive-item{display:grid;grid-template-columns:minmax(200px,38%) minmax(0,1fr);gap:clamp(18px,3vw,32px);align-items:start;padding:28px 0;border-bottom:1px solid var(--katen-pro-border);min-width:0}.katen-archive-item__media{display:block;overflow:hidden;border-radius:12px;aspect-ratio:4/3;background:var(--katen-pro-surface)}.katen-archive-item__media img{width:100%;height:100%;object-fit:cover}.katen-archive-item__body{min-width:0}.katen-archive-item__meta{display:flex;align-items:center;flex-wrap:wrap;gap:5px 12px;margin-bottom:14px;color:var(--katen-pro-muted);font-size:14px;line-height:1.5}.katen-archive-item__meta>*{min-width:0}.katen-archive-item__meta a{color:inherit}.katen-archive-item__category:before,.katen-archive-item__meta time:before,.katen-archive-item__reading-time:before{content:'·';color:var(--katen-pro-accent);font-weight:700;margin-right:12px}.katen-archive-item__authors .katen-post-authors__names{flex-wrap:wrap}.katen-archive-item__title{margin:0 0 10px;font-size:clamp(20px,2vw,26px);line-height:1.35;color:var(--katen-pro-text)}.katen-archive-item__title a{color:inherit}.katen-archive-item__excerpt{margin:0 0 12px;color:var(--katen-pro-muted);font-size:16px;line-height:1.65}.katen-archive-item__share{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.katen-archive-item__share .post-bottom{margin:0;padding:0}.katen-native-hero__meta{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:12px;color:inherit;font-size:14px}.katen-native-hero__meta .katen-post-authors__names{flex-wrap:wrap}.katen-native-hero--2 .katen-native-hero__meta a{color:#fff}
/* Keep editorial cards and recent-post widgets aligned, even with several authors. */
.katen-pro-card__body{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.katen-pro-card__body .katen-post-authors,.katen-pro-card__body .katen-author-full{max-width:100%;min-width:0;flex-wrap:wrap}.katen-pro-card__body .katen-post-authors__names{min-width:0;flex-wrap:wrap;overflow-wrap:anywhere}.katen-pro-card__category{margin:0;font-size:12px;line-height:1.4}.katen-pro-card__title{margin:0;overflow-wrap:anywhere}.katen-pro-card__body time{margin-top:auto;font-size:12px}.sidebar .post.post-list-sm{display:grid;grid-template-columns:76px minmax(0,1fr);gap:12px;align-items:start}.sidebar .post.post-list-sm .thumb{width:76px;height:76px;margin:0}.sidebar .post.post-list-sm .thumb img{width:100%;height:100%;object-fit:cover}.sidebar .post.post-list-sm .details{min-width:0}.sidebar .post.post-list-sm .post-title{margin:0;font-size:14px;line-height:1.45;overflow-wrap:anywhere}
@media(max-width:767px){.katen-archive-item{grid-template-columns:1fr;gap:14px}.katen-archive-item__media{aspect-ratio:16/10}.katen-archive-item__meta{font-size:13px}.katen-archive-item__title{font-size:20px}.katen-archive-item__excerpt{font-size:15px}}
/* Template 01 follows the horizontal archive composition, including old modules. */
.katen-pro-template-1:not([data-katen-carousel]){grid-template-columns:minmax(0,1fr)}.katen-pro-template-1:not([data-katen-carousel]) .katen-pro-card--1{display:grid;grid-template-columns:minmax(160px,38%) minmax(0,1fr);align-items:stretch;border:0;border-bottom:1px solid var(--katen-pro-border);border-radius:0;box-shadow:none;background:transparent}.katen-pro-template-1:not([data-katen-carousel]) .katen-pro-card--1 .katen-pro-card__media{height:100%;min-height:190px;aspect-ratio:4/3;border-radius:12px}.katen-pro-template-1:not([data-katen-carousel]) .katen-pro-card--1 .katen-pro-card__body{padding:2px 0 18px 24px;justify-content:center}.katen-pro-template-1:not([data-katen-carousel]) .katen-pro-card--1 .katen-pro-card__title{font-size:clamp(19px,2vw,24px);line-height:1.4}.katen-pro-template-1:not([data-katen-carousel]) .katen-pro-card--1 p{font-size:15px;line-height:1.6}.katen-pro-template-1:not([data-katen-carousel]) .katen-pro-card--1 time{margin-top:0}
@media(max-width:600px){.katen-pro-template-1:not([data-katen-carousel]) .katen-pro-card--1{grid-template-columns:1fr}.katen-pro-template-1:not([data-katen-carousel]) .katen-pro-card--1 .katen-pro-card__media{min-height:0;aspect-ratio:16/10}.katen-pro-template-1:not([data-katen-carousel]) .katen-pro-card--1 .katen-pro-card__body{padding:16px 0 20px}}

.load-more[hidden]{display:none!important}

/* ==========================================================================
   Responsive Unlimited Ad Slots Engine
   ========================================================================== */
.katen-ad-slot {
  clear: both;
  margin: 28px auto;
  text-align: center;
  position: relative;
  max-width: 100%;
  box-sizing: border-box;
}
.katen-ad-slot__label {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--katen-pro-muted);
  margin-bottom: 8px;
  padding: 2px 8px;
  border-radius: 4px;
  background: rgba(0, 0, 0, .04);
}
body.dark .katen-ad-slot__label {
  background: rgba(255, 255, 255, .08);
}
.katen-ad-slot__content {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 100%;
}
.katen-ad-slot__image-link {
  display: inline-block;
  max-width: 100%;
  line-height: 1;
}
.katen-ad-slot img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 320px;
  object-fit: contain;
  margin: 0 auto;
  border-radius: 10px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .06);
  transition: opacity .2s ease, transform .2s ease;
}
.katen-ad-slot a:hover img {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .1);
}
.katen-ad-slot__code-wrap,
.katen-ad-slot__shortcode-wrap {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  display: flex;
  justify-content: center;
}
/* Device targeting rules */
@media (max-width: 991px) {
  .katen-ad--desktop { display: none !important; }
}
@media (max-width: 600px), (min-width: 992px) {
  .katen-ad--tablet { display: none !important; }
}
@media (min-width: 601px) {
  .katen-ad--mobile { display: none !important; }
}
@media (max-width: 600px) {
  .katen-ad--desktop_tablet { display: none !important; }
}
@media (min-width: 992px) {
  .katen-ad--tablet_mobile { display: none !important; }
}
/* Breakpoints specific image constraints */
@media (min-width: 601px) and (max-width: 991px) {
  .katen-ad-slot img { max-height: 260px; }
}
@media (max-width: 600px) {
  .katen-ad-slot { margin: 20px auto; }
  .katen-ad-slot img {
    max-height: min(220px, 42vh);
    border-radius: 8px;
  }
}

/* ==========================================================================
   Responsive Rekomendasi Baca Juga (Mobile, Tablet, Desktop)
   ========================================================================== */
.katen-inline-related {
  clear: both;
  margin: 32px 0;
  padding: 20px 22px;
  border: 1px solid var(--katen-pro-border);
  border-radius: 14px;
  background: var(--katen-pro-surface);
  color: var(--katen-pro-text);
  box-shadow: 0 4px 18px rgba(32, 54, 86, .04);
}
.katen-inline-related .katen-toc,
.katen-inline-related [class*="toc"],
.katen-inline-related [class*="daftar-isi"],
.katen-inline-related [class*="akademi"],
.katen-inline-related .kte-course-card {
  display: none !important;
}
.katen-inline-related__label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--katen-pro-accent);
}
.katen-inline-related__label::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 14px;
  border-radius: 2px;
  background: var(--katen-pro-accent);
}
.katen-inline-related__items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
/* Tablet (601px - 991px) */
@media (min-width: 601px) and (max-width: 991px) {
  .katen-inline-related {
    padding: 16px 18px;
  }
  .katen-inline-related__items {
    gap: 14px;
  }
  .katen-inline-related .katen-pro-card__title {
    font-size: clamp(14px, 1.8vw, 15.5px);
  }
}
/* Mobile (<= 600px) - Horizontal Card Layout: NOT oversized, NOT micro squashed */
@media (max-width: 600px) {
  .katen-inline-related {
    margin: 22px 0;
    padding: 14px 12px;
    border-radius: 12px;
  }
  .katen-inline-related__label {
    font-size: 12px;
    margin-bottom: 10px;
  }
  .katen-inline-related__items {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .katen-inline-related .katen-pro-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 8px !important;
    border-radius: 10px !important;
    background: var(--katen-pro-bg) !important;
    border: 1px solid var(--katen-pro-border) !important;
    box-shadow: none !important;
  }
  .katen-inline-related .katen-pro-card__media {
    width: 80px !important;
    height: 80px !important;
    min-width: 80px !important;
    max-width: 80px !important;
    aspect-ratio: 1/1 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
  }
  .katen-inline-related .katen-pro-card__media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  .katen-inline-related .katen-pro-card__body {
    flex: 1 !important;
    min-width: 0 !important;
    padding: 0 !important;
    gap: 3px !important;
  }
  .katen-inline-related .katen-pro-card__category {
    font-size: 10.5px !important;
    margin: 0 !important;
  }
  .katen-inline-related .katen-pro-card__title {
    font-size: clamp(13px, 3.8vw, 14.5px) !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  .katen-inline-related .katen-pro-card time {
    font-size: 11px !important;
    margin: 0 !important;
    opacity: 0.8 !important;
  }
}

/* ==========================================================================
   Klik Ternak Header Member & Academy Navigation
   ========================================================================== */
.katen-header-account {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  position: relative;
  margin-right: 6px;
}
.katen-header-account__academy {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(45, 131, 163, .1);
  color: var(--katen-pro-accent) !important;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: all .2s ease;
}
.katen-header-account__academy:hover {
  background: var(--katen-pro-accent);
  color: #fff !important;
}
.katen-header-account__dropdown-wrap {
  position: relative;
}
.katen-header-account__toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 1px solid var(--katen-pro-border);
  padding: 3px 10px 3px 4px;
  border-radius: 999px;
  cursor: pointer;
  transition: all .2s ease;
}
.katen-header-account__toggle:hover {
  border-color: var(--katen-pro-accent);
  background: var(--katen-pro-surface);
}
.katen-header-account__avatar {
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--katen-pro-accent);
}
.katen-header-account__name {
  font-size: 13px;
  font-weight: 600;
  color: var(--katen-pro-text);
}
.katen-header-account__arrow {
  font-size: 11px;
  color: var(--katen-pro-muted);
  transition: transform .2s ease;
}
.katen-header-account__dropdown-wrap:hover .katen-header-account__arrow,
.katen-header-account__dropdown-wrap:focus-within .katen-header-account__arrow {
  transform: rotate(180deg);
}
.katen-header-account__menu {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 8px;
  width: 250px;
  background: var(--katen-pro-bg);
  border: 1px solid var(--katen-pro-border);
  border-radius: 14px;
  box-shadow: 0 16px 36px rgba(32, 54, 86, .14);
  padding: 12px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: all .2s ease;
  z-index: 1000;
}
.katen-header-account__dropdown-wrap:hover .katen-header-account__menu,
.katen-header-account__dropdown-wrap:focus-within .katen-header-account__menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.katen-header-account__user-info {
  padding: 8px 16px 12px;
  border-bottom: 1px solid var(--katen-pro-border);
}
.katen-header-account__user-name {
  font-weight: 700;
  font-size: 14px;
  color: var(--katen-pro-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.katen-header-account__list {
  list-style: none;
  padding: 6px 0;
  margin: 0;
}
.katen-header-account__list li a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  font-size: 13px;
  color: var(--katen-pro-text);
  text-decoration: none;
  transition: background .15s ease;
}
.katen-header-account__list li a:hover {
  background: var(--katen-pro-surface);
  color: var(--katen-pro-accent);
}
.katen-header-account__divider {
  height: 1px;
  background: var(--katen-pro-border);
  margin: 6px 0;
}
.katen-header-account__guest {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.katen-header-account__btn-login {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--katen-pro-text);
  text-decoration: none;
  padding: 6px 12px;
}
.katen-header-account__btn-login:hover {
  color: var(--katen-pro-accent);
}
.katen-header-account__btn-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--katen-pro-accent), var(--katen-pro-accent-2));
  color: #fff !important;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(45, 131, 163, .25);
  transition: transform .15s ease, box-shadow .15s ease;
}
.katen-header-account__btn-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(45, 131, 163, .35);
}

/* Badges */
.kte-badge--verified {
  color: #1d9bf0;
  display: inline-flex;
  align-items: center;
  font-size: 13px;
  margin-left: 3px;
  vertical-align: middle;
}
.kte-badge-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}
.kte-badge-pill--instructor {
  background: rgba(29, 155, 240, .12);
  color: #0d82d4;
}
.kte-badge-pill--member {
  background: rgba(46, 125, 50, .12);
  color: #2e7d32;
}

/* In-Article Course Cross-Promotion Banner */
.katen-course-promo {
  clear: both;
  margin: 32px 0;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--katen-pro-border);
  background: linear-gradient(135deg, #f7fbfd, #ebf6fa);
  box-shadow: 0 8px 24px rgba(45, 131, 163, .08);
}
body.dark .katen-course-promo {
  background: linear-gradient(135deg, #1b2636, #162130);
}
.katen-course-promo__header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  background: rgba(45, 131, 163, .1);
  border-bottom: 1px solid var(--katen-pro-border);
}
.katen-course-promo__badge {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--katen-pro-accent);
}
.katen-course-promo__lead {
  font-size: 12px;
  color: var(--katen-pro-muted);
}
.katen-course-promo__body {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 18px;
  padding: 18px;
  align-items: center;
}
.katen-course-promo__media {
  position: relative;
  display: block;
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 16/10;
}
.katen-course-promo__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}
.katen-course-promo__play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(0, 0, 0, .35);
  color: #fff;
  font-size: 18px;
  opacity: 0.9;
  transition: all .2s ease;
}
.katen-course-promo__media:hover .katen-course-promo__play {
  background: rgba(45, 131, 163, .65);
  transform: scale(1.08);
}
.katen-course-promo__content {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.katen-course-promo__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  font-size: 12px;
  color: var(--katen-pro-muted);
}
.katen-course-promo__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  margin: 4px 0;
}
.katen-course-promo__title a {
  color: var(--katen-pro-text);
  text-decoration: none;
}
.katen-course-promo__title a:hover {
  color: var(--katen-pro-accent);
}
.katen-course-promo__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 6px;
}
.katen-course-promo__pricing {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.katen-course-promo__price {
  font-size: 18px;
  font-weight: 800;
  color: var(--katen-pro-text);
}
.katen-course-promo__orig {
  font-size: 13px;
  color: var(--katen-pro-muted);
  text-decoration: line-through;
}
.katen-course-promo__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 18px;
  border-radius: 8px;
  background: var(--katen-pro-accent);
  color: #fff !important;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: all .15s ease;
}
.katen-course-promo__cta:hover {
  background: var(--katen-pro-accent-2);
  transform: translateY(-1px);
}
@media (max-width: 600px) {
  .katen-course-promo__body {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 14px;
  }
  .katen-course-promo__media {
    max-height: 160px;
  }
  .katen-course-promo__footer {
    flex-direction: column;
    align-items: stretch;
  }
  .katen-course-promo__cta {
    justify-content: center;
  }
}

/* ==========================================================================
   Udemy-Style LMS Course Elements (Single Course & Catalog)
   ========================================================================== */
.katen-udemy-hero {
  background: #1c1d1f;
  color: #fff;
  padding: 40px 0 32px;
}
.katen-udemy-hero__breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  margin-bottom: 16px;
  color: #c0c4fc;
}
.katen-udemy-hero__breadcrumb a {
  color: #cec0fc;
  font-weight: 600;
  text-decoration: none;
}
.katen-udemy-hero__breadcrumb a:hover {
  text-decoration: underline;
}
.katen-udemy-hero__title {
  font-size: clamp(26px, 3.2vw, 36px);
  font-weight: 800;
  line-height: 1.25;
  color: #fff;
  margin-bottom: 12px;
}
.katen-udemy-hero__excerpt {
  font-size: 16px;
  line-height: 1.5;
  color: #d1d7dc;
  margin-bottom: 16px;
}
.katen-udemy-hero__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 14px;
  margin-bottom: 14px;
}
.katen-badge-bestseller {
  background: #eceb98;
  color: #3d3c0a;
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 800;
}
.katen-udemy-hero__rating {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.katen-udemy-hero__rating .score {
  color: #f69c08;
  font-weight: 800;
}
.katen-udemy-hero__rating .stars {
  color: #f69c08;
}
.katen-udemy-hero__rating .reviews-link {
  color: #cec0fc;
  text-decoration: underline;
}
.katen-udemy-hero__author {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 13.5px;
  color: #d1d7dc;
}
.katen-udemy-hero__author a {
  color: #cec0fc;
  text-decoration: underline;
}
.katen-udemy-hero__author .dot {
  color: #8a92a6;
}

/* Udemy Main Body */
.katen-udemy-body {
  padding: 36px 0 60px;
}
.katen-udemy-card-box {
  background: var(--katen-pro-bg);
  border: 1px solid var(--katen-pro-border);
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(32, 54, 86, .04);
}
.katen-udemy-card-box__title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 18px;
  color: var(--katen-pro-text);
}
.katen-udemy-outcomes__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 18px;
}
@media (max-width: 600px) {
  .katen-udemy-outcomes__grid {
    grid-template-columns: 1fr;
  }
}
.katen-udemy-outcomes__item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14.5px;
  line-height: 1.45;
  color: var(--katen-pro-text);
}
.katen-udemy-outcomes__item i {
  margin-top: 3px;
  flex-shrink: 0;
}

/* Curriculum List */
.katen-udemy-curriculum__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 8px;
}
.katen-udemy-curriculum__summary {
  font-size: 13px;
  color: var(--katen-pro-muted);
}
.katen-udemy-curriculum__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.katen-udemy-curriculum__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border: 1px solid var(--katen-pro-border);
  border-radius: 8px;
  background: var(--katen-pro-surface);
  transition: all .15s ease;
}
.katen-udemy-curriculum__item:hover {
  background: var(--katen-pro-bg);
  border-color: var(--katen-pro-accent);
}
.katen-udemy-curriculum__item-left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.katen-udemy-curriculum__item .lesson-num {
  font-size: 12px;
  font-weight: 700;
  color: var(--katen-pro-muted);
  width: 20px;
}
.katen-udemy-curriculum__item .lesson-icon {
  color: var(--katen-pro-accent);
}
.katen-udemy-curriculum__item .lesson-title {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--katen-pro-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.katen-udemy-curriculum__item-right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.badge-preview {
  font-size: 11px;
  font-weight: 700;
  color: var(--katen-pro-accent);
  background: rgba(45, 131, 163, .12);
  padding: 3px 8px;
  border-radius: 4px;
}
.lesson-time {
  font-size: 12px;
  color: var(--katen-pro-muted);
}
.katen-udemy-list-check {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.katen-udemy-list-check li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
}

/* Instructor Box */
.katen-udemy-instructor__profile {
  display: flex;
  align-items: center;
  gap: 16px;
}
.katen-udemy-instructor__avatar {
  border-radius: 50%;
  border: 3px solid var(--katen-pro-accent);
}
.katen-udemy-instructor__info .name {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 4px;
}
.katen-udemy-instructor__info .title-sub {
  font-size: 13.5px;
  color: var(--katen-pro-muted);
  margin-bottom: 6px;
}
.katen-udemy-instructor__info .stats {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 13px;
  color: var(--katen-pro-text);
}

/* Reviews Box */
.katen-udemy-reviews__summary {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 16px;
  border-radius: 10px;
  background: var(--katen-pro-surface);
  margin-bottom: 20px;
}
.katen-udemy-reviews__summary .score-large {
  font-size: 44px;
  font-weight: 900;
  color: #f69c08;
  line-height: 1;
}
.katen-udemy-reviews__summary .stars-large {
  color: #f69c08;
  font-size: 18px;
}
.katen-udemy-reviews__summary .text {
  font-size: 13px;
  color: var(--katen-pro-muted);
  margin-top: 4px;
}
.katen-udemy-reviews__list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.review-item {
  padding: 14px;
  border-radius: 8px;
  border: 1px solid var(--katen-pro-border);
}
.review-item__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.review-item__head .user-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--katen-pro-surface);
  display: grid;
  place-items: center;
  color: var(--katen-pro-muted);
}
.review-item__text {
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--katen-pro-text);
  margin: 0;
}

/* Sticky Trailer Box */
.katen-udemy-trailer-sticky {
  position: sticky;
  top: 90px;
  z-index: 99;
}
.katen-udemy-trailer-card {
  background: var(--katen-pro-bg);
  border: 1px solid var(--katen-pro-border);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(32, 54, 86, .12);
}
.katen-udemy-trailer-card__media {
  position: relative;
  aspect-ratio: 16/9;
  background: #111;
  overflow: hidden;
}
.katen-udemy-trailer-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.katen-udemy-trailer-card__placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  font-size: 48px;
  color: #fff;
  background: linear-gradient(135deg, var(--katen-pro-accent), var(--katen-pro-accent-2));
}
.play-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: rgba(0, 0, 0, .4);
  color: #fff;
  cursor: pointer;
  transition: all .2s ease;
}
.play-overlay .play-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #fff;
  color: #111;
  display: grid;
  place-items: center;
  font-size: 18px;
  transition: transform .2s ease;
}
.katen-udemy-trailer-card__media:hover .play-overlay .play-icon {
  transform: scale(1.12);
}
.play-overlay .play-label {
  font-size: 13px;
  font-weight: 700;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
}
.katen-udemy-trailer-card__body {
  padding: 24px;
}
.katen-udemy-trailer-card__pricing {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 6px;
}
.katen-udemy-trailer-card__pricing .current-price {
  font-size: 28px;
  font-weight: 900;
  color: var(--katen-pro-text);
}
.katen-udemy-trailer-card__pricing .original-price {
  font-size: 16px;
  color: var(--katen-pro-muted);
  text-decoration: line-through;
}
.katen-udemy-trailer-card__pricing .discount-badge {
  font-size: 13px;
  font-weight: 700;
  color: #b32d00;
}
.katen-udemy-trailer-card__urgency {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: #b32d00;
  margin-bottom: 18px;
  font-weight: 600;
}
.btn-udemy-enroll {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 14px 20px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 800;
  text-decoration: none;
  transition: all .2s ease;
}
.btn-udemy-free {
  background: linear-gradient(135deg, #10b981, #059669);
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(16, 185, 129, .25);
}
.btn-udemy-free:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(16, 185, 129, .35);
}
.btn-udemy-wa {
  background: #25d366;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(37, 211, 102, .25);
}
.btn-udemy-wa:hover {
  background: #20ba5a;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(37, 211, 102, .35);
}
.katen-udemy-trailer-card__sub-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 12px;
}
.btn-udemy-share {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--katen-pro-muted);
  text-decoration: none;
  padding: 6px 12px;
  border-radius: 6px;
  border: 1px solid var(--katen-pro-border);
}
.btn-udemy-share:hover {
  color: #25d366;
  border-color: #25d366;
}
.katen-udemy-trailer-card__guarantee {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--katen-pro-muted);
  margin: 16px 0;
  padding: 10px 12px;
  border-radius: 6px;
  background: var(--katen-pro-surface);
}
.katen-udemy-trailer-card__features .title {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 10px;
}
.katen-udemy-trailer-card__features ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
  font-size: 13px;
}
.katen-udemy-trailer-card__features li {
  display: flex;
  align-items: center;
  gap: 10px;
}
.katen-udemy-trailer-card__features li i {
  width: 16px;
  color: var(--katen-pro-muted);
}

/* Mobile Sticky Bottom Enroll Bar */
.katen-udemy-mobile-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--katen-pro-bg);
  border-top: 1px solid var(--katen-pro-border);
  padding: 10px 16px;
  z-index: 9999;
  box-shadow: 0 -4px 16px rgba(0, 0, 0, .08);
}
.katen-udemy-mobile-bar__price .price-val {
  font-size: 18px;
  font-weight: 800;
  color: var(--katen-pro-text);
  margin-right: 6px;
}
.katen-udemy-mobile-bar__price .price-old {
  font-size: 12px;
  color: var(--katen-pro-muted);
  text-decoration: line-through;
}

/* Udemy Course Card Grid (Catalog Archive & Shortcode) */
.katen-udemy-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
@media (min-width: 601px) and (max-width: 991px) {
  .katen-udemy-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
}
@media (max-width: 600px) {
  .katen-udemy-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
.katen-udemy-card {
  background: var(--katen-pro-bg);
  border: 1px solid var(--katen-pro-border);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--katen-pro-shadow);
  display: flex;
  flex-direction: column;
  transition: transform .2s ease, box-shadow .2s ease;
}
.katen-udemy-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(32, 54, 86, .12);
}
.katen-udemy-card__media {
  position: relative;
  display: block;
  aspect-ratio: 16/10;
  overflow: hidden;
  background: var(--katen-pro-surface);
}
.katen-udemy-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s ease;
}
.katen-udemy-card:hover .katen-udemy-card__media img {
  transform: scale(1.05);
}
.katen-udemy-card__placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  font-size: 40px;
  color: #fff;
  background: linear-gradient(135deg, var(--katen-pro-accent), var(--katen-pro-accent-2));
}
.katen-udemy-card__category {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(0, 0, 0, .7);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 4px;
  backdrop-filter: blur(4px);
}
.katen-udemy-card__duration {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(0, 0, 0, .75);
  color: #fff;
  font-size: 11px;
  padding: 2px 7px;
  border-radius: 4px;
}
.katen-udemy-card__body {
  padding: 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.katen-udemy-card__level {
  font-size: 11.5px;
  color: var(--katen-pro-accent);
  font-weight: 700;
  margin-bottom: 6px;
}
.katen-udemy-card__title {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  margin: 0 0 8px;
}
.katen-udemy-card__title a {
  color: var(--katen-pro-text);
  text-decoration: none;
}
.katen-udemy-card__instructor {
  font-size: 12.5px;
  color: var(--katen-pro-muted);
  margin-bottom: 8px;
}
.katen-udemy-card__rating {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  margin-bottom: 12px;
}
.katen-udemy-card__rating .score {
  font-weight: 800;
  color: #b4690e;
}
.katen-udemy-card__rating .stars {
  color: #f69c08;
  font-size: 12px;
}
.katen-udemy-card__rating .students {
  color: var(--katen-pro-muted);
  font-size: 12px;
}
.katen-udemy-card__footer {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 12px;
  border-top: 1px solid var(--katen-pro-border);
}
.katen-udemy-card__price .current {
  font-size: 17px;
  font-weight: 800;
  color: var(--katen-pro-text);
}
.katen-udemy-card__price .original {
  font-size: 12px;
  color: var(--katen-pro-muted);
  text-decoration: line-through;
  margin-left: 4px;
}
.katen-udemy-card__btn {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--katen-pro-accent);
  text-decoration: none;
  padding: 4px 10px;
  border-radius: 6px;
  border: 1px solid var(--katen-pro-border);
  transition: all .15s ease;
}
.katen-udemy-card:hover .katen-udemy-card__btn {
  background: var(--katen-pro-accent);
  color: #fff;
  border-color: var(--katen-pro-accent);
}

/* Catalog Archive Page Specifics */
.katen-udemy-catalog-hero {
  background: linear-gradient(135deg, #1c2636, #141c27);
  color: #fff;
  padding: 48px 0 32px;
}
.katen-udemy-catalog-hero__title {
  font-size: clamp(28px, 3.5vw, 42px);
  font-weight: 800;
  color: #fff;
  margin-bottom: 12px;
}
.katen-udemy-catalog-hero__desc {
  font-size: 16px;
  color: #b8c4d8;
  max-width: 680px;
  line-height: 1.6;
}
.katen-udemy-catalog-hero__stats {
  display: inline-flex;
  gap: 20px;
  background: rgba(255, 255, 255, .06);
  padding: 16px 24px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .1);
}
.katen-udemy-catalog-hero__stats .stat-item {
  text-align: center;
}
.katen-udemy-catalog-hero__stats .number {
  display: block;
  font-size: 24px;
  font-weight: 800;
  color: #34a3cf;
}
.katen-udemy-catalog-hero__stats .label {
  font-size: 11.5px;
  color: #b8c4d8;
}
.katen-udemy-pills-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  padding: 24px 0 6px;
  scrollbar-width: thin;
}
.katen-udemy-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .1);
  color: #fff !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: all .15s ease;
}
.katen-udemy-pill:hover,
.katen-udemy-pill.active {
  background: var(--katen-pro-accent-2);
  color: #fff !important;
}
.katen-udemy-pill .count {
  background: rgba(0, 0, 0, .25);
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 999px;
}

/* Community Callout Banner */
.katen-community-banner {
  background: linear-gradient(135deg, #e9f6fa, #f4fbfd);
  border: 1px solid var(--katen-pro-border);
  border-radius: 16px;
  padding: 32px 36px;
}
body.dark .katen-community-banner {
  background: linear-gradient(135deg, #1b2636, #16202d);
}
.katen-community-banner .title {
  font-size: 22px;
  font-weight: 800;
  color: var(--katen-pro-text);
}
.katen-community-banner .desc {
  font-size: 15px;
  color: var(--katen-pro-muted);
  line-height: 1.6;
}

/* ==========================================================================
   1. Single Post Header & Metadata Alignment Controls
   ========================================================================== */
.post-header--align-left {
  text-align: left !important;
}
.post-header--align-left .title {
  text-align: left !important;
}
.post-header--align-center {
  text-align: center !important;
}
.post-header--align-center .title {
  text-align: center !important;
}
.post-header--align-right {
  text-align: right !important;
}
.post-header--align-right .title {
  text-align: right !important;
}

.single-post .post-header .meta.meta--align-left {
  justify-content: flex-start !important;
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.single-post .post-header .meta.meta--align-left > li,
.single-post .post-header .meta.meta--align-left > span,
.single-post .post-header .meta.meta--align-left .katen-post-authors {
  justify-content: flex-start !important;
}

.single-post .post-header .meta.meta--align-right {
  justify-content: flex-end !important;
  text-align: right !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}
.single-post .post-header .meta.meta--align-right > li,
.single-post .post-header .meta.meta--align-right > span,
.single-post .post-header .meta.meta--align-right .katen-post-authors {
  justify-content: flex-end !important;
}

.single-post .post-header .meta.meta--align-center {
  justify-content: center !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.single-post .post-header .meta.meta--align-center > li,
.single-post .post-header .meta.meta--align-center > span,
.single-post .post-header .meta.meta--align-center .katen-post-authors {
  justify-content: center !important;
}

/* ==========================================================================
   2. Post Collaboration (Multi-Author) Layouts & Styles
   ========================================================================== */
.katen-collaboration {
  margin: 24px 0;
  padding: 16px 20px;
  background: var(--katen-pro-surface, #f8fbfd);
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  border-radius: 16px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .03);
}
body.dark .katen-collaboration {
  background: var(--katen-pro-surface, #141f2e);
  border-color: var(--katen-pro-border, #1e293b);
  box-shadow: none;
}
.katen-collaboration__heading {
  display: block;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--katen-pro-muted, #64748b);
  margin-bottom: 10px;
  font-weight: 700;
}
.katen-collaboration--align-left {
  text-align: left;
}
.katen-collaboration--align-left .katen-collaboration__summary,
.katen-collaboration--align-left .katen-collaboration__pills-list {
  justify-content: flex-start;
}
.katen-collaboration--align-center {
  text-align: center;
}
.katen-collaboration--align-center .katen-collaboration__summary,
.katen-collaboration--align-center .katen-collaboration__pills-list {
  justify-content: center;
}
.katen-collaboration--align-right {
  text-align: right;
}
.katen-collaboration--align-right .katen-collaboration__summary,
.katen-collaboration--align-right .katen-collaboration__pills-list {
  justify-content: flex-end;
}

/* Collaboration Pills Style */
.katen-collaboration--pills .katen-collaboration__pills-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.katen-collaboration__pill {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 6px 14px 6px 8px;
  background: #fff;
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  border-radius: 9999px;
  color: var(--katen-pro-text, #1e293b);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  transition: all .2s ease;
}
body.dark .katen-collaboration__pill {
  background: #1b2838;
  border-color: #2c3e55;
  color: #f1f5f9;
}
.katen-collaboration__pill:hover {
  border-color: var(--katen-pro-accent, #2d83a3);
  transform: translateY(-2px);
  color: var(--katen-pro-accent, #2d83a3);
}
.katen-collaboration__pill img {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 !important;
}
.katen-collaboration__pill-info {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.katen-collaboration__pill-role {
  font-size: 11px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(45, 131, 163, .12);
  color: var(--katen-pro-accent, #2d83a3);
  font-weight: 700;
}
body.dark .katen-collaboration__pill-role {
  background: rgba(56, 189, 248, .15);
  color: #38bdf8;
}

/* Collaboration Cards Style */
.katen-collaboration--cards .katen-collaboration__cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}
.katen-collaboration__mini-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  border-radius: 14px;
  transition: all .2s ease;
}
body.dark .katen-collaboration__mini-card {
  background: #1b2838;
  border-color: #2c3e55;
}
.katen-collaboration__mini-card:hover {
  border-color: var(--katen-pro-accent, #2d83a3);
  transform: translateY(-2px);
}
.katen-collaboration__mini-avatar img {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 !important;
}
.katen-collaboration__mini-name {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--katen-pro-text, #1e293b);
  line-height: 1.3;
}
body.dark .katen-collaboration__mini-name {
  color: #f1f5f9;
}
.katen-collaboration__mini-role {
  display: block;
  font-size: 12px;
  color: var(--katen-pro-muted, #64748b);
  margin-top: 2px;
}

/* ==========================================================================
   3. Error 404 Page Modern Layout & Visuals
   ========================================================================== */
.katen-404-main {
  min-height: 65vh;
  padding: 20px 0 40px;
}
.katen-404-hero {
  max-width: 780px;
  margin: 0 auto 50px;
  padding: 44px 30px;
  background: var(--katen-pro-surface, #fff);
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  border-radius: 28px;
  box-shadow: 0 16px 45px rgba(0, 0, 0, .05);
}
body.dark .katen-404-hero {
  background: var(--katen-pro-surface, #141f2e);
  border-color: var(--katen-pro-border, #1e293b);
  box-shadow: 0 16px 45px rgba(0, 0, 0, .25);
}
.katen-404-badge-wrap {
  margin-bottom: 20px;
}
.katen-404-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 16px;
  border-radius: 9999px;
  background: rgba(239, 68, 68, .12);
  color: #ef4444;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.katen-404-graphic {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 15px 0 25px;
  user-select: none;
}
.katen-404-number {
  font-size: clamp(72px, 14vw, 130px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.04em;
  background: linear-gradient(135deg, var(--katen-pro-accent, #2d83a3), var(--katen-pro-accent-2, #34a3cf));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.katen-404-icon-circle {
  width: clamp(64px, 12vw, 100px);
  height: clamp(64px, 12vw, 100px);
  border-radius: 50%;
  background: linear-gradient(135deg, var(--katen-pro-accent, #2d83a3), var(--katen-pro-accent-2, #34a3cf));
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: clamp(28px, 6vw, 44px);
  box-shadow: 0 12px 28px rgba(45, 131, 163, .3);
  animation: katenCompassPulse 3s infinite ease-in-out;
}
@keyframes katenCompassPulse {
  0%, 100% { transform: scale(1) rotate(0deg); }
  50% { transform: scale(1.06) rotate(15deg); }
}
.katen-404-illustration img {
  max-width: 280px;
  height: auto;
  margin: 10px auto 25px;
  display: block;
}
.katen-404-title {
  font-size: clamp(26px, 4vw, 36px);
  font-weight: 800;
  margin-bottom: 10px;
  color: var(--katen-pro-text);
}
.katen-404-subtitle {
  font-size: clamp(16px, 2.5vw, 18px);
  font-weight: 600;
  color: var(--katen-pro-accent, #2d83a3);
  margin-bottom: 14px;
}
.katen-404-desc {
  font-size: 15px;
  color: var(--katen-pro-muted, #64748b);
  max-width: 600px;
  margin: 0 auto 28px;
  line-height: 1.65;
}
.katen-404-search-box {
  max-width: 520px;
  margin: 0 auto 30px;
}
.katen-404-search-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}
.katen-404-search-input-wrap .search-icon {
  position: absolute;
  left: 18px;
  color: var(--katen-pro-muted, #94a3b8);
  font-size: 16px;
  pointer-events: none;
}
.katen-404-search-field {
  width: 100%;
  padding: 14px 110px 14px 48px;
  border-radius: 9999px;
  border: 2px solid var(--katen-pro-border, #e2e8f0);
  background: var(--katen-pro-bg, #fff);
  color: var(--katen-pro-text);
  font-size: 15px;
  outline: none;
  transition: all .2s ease;
}
body.dark .katen-404-search-field {
  background: #0f172a;
  border-color: #2c3e55;
  color: #f8fafc;
}
.katen-404-search-field:focus {
  border-color: var(--katen-pro-accent, #2d83a3);
  box-shadow: 0 0 0 3px rgba(45, 131, 163, .15);
}
.katen-404-search-submit {
  position: absolute;
  right: 5px;
  padding: 9px 20px;
  border-radius: 9999px;
  font-size: 14px;
  font-weight: 700;
}
.katen-404-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 14px;
}
.katen-404-actions .btn {
  padding: 12px 24px;
  border-radius: 9999px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.katen-404-btn-secondary {
  border: 2px solid var(--katen-pro-border, #cbd5e1);
  color: var(--katen-pro-text) !important;
}
body.dark .katen-404-btn-secondary {
  border-color: #334155;
  color: #f1f5f9 !important;
}
.katen-404-btn-secondary:hover {
  background: var(--katen-pro-accent);
  border-color: var(--katen-pro-accent);
  color: #fff !important;
}
.katen-404-recommendations {
  margin-top: 50px;
  padding-top: 36px;
  border-top: 1px solid var(--katen-pro-border, #e2e8f0);
}
.katen-404-recommendations .section-title {
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 8px;
  color: var(--katen-pro-text);
}
.katen-title-divider {
  width: 48px;
  height: 3px;
  background: var(--katen-pro-accent);
  border-radius: 999px;
  margin: 0 auto 24px;
}

/* ==========================================================================
   4. Klik Ternak Engine Front-End Layout Polish & Dark Mode Sync
   ========================================================================== */
/* Light Mode Polish */
:where(.kte-engine, .kte-lms, .kte-mobile-app, .kte-pwa-app, .kte-docs-frontend, .kte-payment-box, .kte-auth-shell, .kte-user-manage, .kte-user-submit, .kt-recording) {
  font-family: inherit;
}
.kte-roadmap-node {
  border-radius: 16px !important;
  transition: transform .2s ease, box-shadow .2s ease;
}
.kte-roadmap-node:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .06);
}
.kt-recording-table,
.kte-docs-table {
  border-radius: 12px;
  overflow: hidden;
}

/* Comprehensive Dark Mode Sync with KATENX */
body.dark :where(.kte-engine, .kte-lms, .kte-mobile-app, .kte-pwa-app, .kte-docs-frontend, .kte-payment-box, .kte-auth-shell, .kte-user-manage, .kte-user-submit, .kt-recording),
html[data-kte-theme="dark"] :where(.kte-engine, .kte-lms, .kte-mobile-app, .kte-pwa-app, .kte-docs-frontend, .kte-payment-box, .kte-auth-shell, .kte-user-manage, .kte-user-submit, .kt-recording) {
  --kte-bg: #0f172a !important;
  --kte-card: #141f2e !important;
  --kte-surface: #141f2e !important;
  --kte-text: #f1f5f9 !important;
  --kte-muted: #94a3b8 !important;
  --kte-border: #1e293b !important;
  --kte-soft: #1b2838 !important;
  --kte-auth-bg: #141f2e !important;
  --kte-auth-text: #f1f5f9 !important;
  --kte-auth-border: #1e293b !important;
  color: #f1f5f9 !important;
}

/* Dark Mode Cards & Surfaces */
body.dark .kte-card,
body.dark .kte-lms-card,
body.dark .kte-course-card,
body.dark .kte-payment-card,
body.dark .kte-docs-card,
body.dark .kte-docs-section,
body.dark .kte-post-list-card,
body.dark .kte-query-card,
body.dark .kte-roadmap-node,
body.dark .kte-video-card,
body.dark .kte-dialog-card,
body.dark .kte-auth-card,
body.dark .kte-auth-form,
body.dark .kt-recording-card,
body.dark .kte-lms-feedback,
body.dark .kte-codex-content,
body.dark .kte-codex-page,
html[data-kte-theme="dark"] .kte-card,
html[data-kte-theme="dark"] .kte-lms-card,
html[data-kte-theme="dark"] .kte-course-card,
html[data-kte-theme="dark"] .kte-payment-card,
html[data-kte-theme="dark"] .kte-docs-card,
html[data-kte-theme="dark"] .kte-docs-section,
html[data-kte-theme="dark"] .kte-post-list-card,
html[data-kte-theme="dark"] .kte-query-card,
html[data-kte-theme="dark"] .kte-roadmap-node,
html[data-kte-theme="dark"] .kte-video-card,
html[data-kte-theme="dark"] .kte-dialog-card,
html[data-kte-theme="dark"] .kte-auth-card,
html[data-kte-theme="dark"] .kte-auth-form,
html[data-kte-theme="dark"] .kt-recording-card,
html[data-kte-theme="dark"] .kte-lms-feedback,
html[data-kte-theme="dark"] .kte-codex-content,
html[data-kte-theme="dark"] .kte-codex-page {
  background: #141f2e !important;
  border-color: #1e293b !important;
  color: #f1f5f9 !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .25) !important;
}

/* Dark Mode Headings & Text */
body.dark :where(.kte-engine, .kte-lms, .kte-roadmap, .kte-videos, .kte-codex, .kt-recording) :is(h1, h2, h3, h4, h5, strong),
html[data-kte-theme="dark"] :where(.kte-engine, .kte-lms, .kte-roadmap, .kte-videos, .kte-codex, .kt-recording) :is(h1, h2, h3, h4, h5, strong) {
  color: #f8fafc !important;
}

body.dark :where(.kte-engine, .kte-lms, .kte-roadmap, .kte-videos, .kte-codex, .kt-recording) :is(p, span, small),
html[data-kte-theme="dark"] :where(.kte-engine, .kte-lms, .kte-roadmap, .kte-videos, .kte-codex, .kt-recording) :is(p, span, small) {
  color: #94a3b8;
}

/* Dark Mode Form Inputs */
body.dark :where(.kte-engine, .kte-lms, .kte-auth-shell, .kte-user-submit, .kte-user-manage, .kt-recording) :is(input, select, textarea),
html[data-kte-theme="dark"] :where(.kte-engine, .kte-lms, .kte-auth-shell, .kte-user-submit, .kte-user-manage, .kt-recording) :is(input, select, textarea) {
  background: rgba(255, 255, 255, .06) !important;
  color: #f1f5f9 !important;
  border-color: rgba(255, 255, 255, .15) !important;
}
body.dark :where(.kte-engine, .kte-lms, .kte-auth-shell, .kte-user-submit, .kte-user-manage, .kt-recording) :is(input, select, textarea):focus,
html[data-kte-theme="dark"] :where(.kte-engine, .kte-lms, .kte-auth-shell, .kte-user-submit, .kte-user-manage, .kt-recording) :is(input, select, textarea):focus {
  border-color: var(--katen-pro-accent, #34a3cf) !important;
  box-shadow: 0 0 0 3px rgba(52, 163, 207, .2) !important;
}

/* Dark Mode Tables */
body.dark .kt-recording-table,
body.dark .kte-docs-table,
body.dark .kte-lms-table,
html[data-kte-theme="dark"] .kt-recording-table,
html[data-kte-theme="dark"] .kte-docs-table,
html[data-kte-theme="dark"] .kte-lms-table {
  background: #141f2e !important;
  color: #f1f5f9 !important;
  border-color: #1e293b !important;
}
body.dark .kt-recording-table th,
body.dark .kte-docs-table th,
body.dark .kte-lms-table th,
html[data-kte-theme="dark"] .kt-recording-table th,
html[data-kte-theme="dark"] .kte-docs-table th,
html[data-kte-theme="dark"] .kte-lms-table th {
  background: #1c2a3d !important;
  color: #38bdf8 !important;
  border-color: #24354c !important;
}
body.dark .kt-recording-table td,
body.dark .kte-docs-table td,
body.dark .kte-lms-table td,
html[data-kte-theme="dark"] .kt-recording-table td,
html[data-kte-theme="dark"] .kte-docs-table td,
html[data-kte-theme="dark"] .kte-lms-table td {
  border-color: #1e293b !important;
}

/* Dark Mode Badges & Alerts */
body.dark .kte-payment-alert,
html[data-kte-theme="dark"] .kte-payment-alert {
  background: #162436 !important;
  border-color: #263c56 !important;
  color: #e2e8f0 !important;
}
body.dark .kte-payment-order,
html[data-kte-theme="dark"] .kte-payment-order {
  background: rgba(56, 189, 248, .15) !important;
  color: #38bdf8 !important;
}

/* ==========================================================================
   Single Post Fullwidth Layout & Reading Experience Toolbar
   ========================================================================== */
.post-single--fullwidth {
  max-width: 860px;
  margin-left: auto !important;
  margin-right: auto !important;
}

.katen-reading-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin: 18px 0 26px;
  padding: 8px 18px;
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  border-radius: 999px;
  background: rgba(255, 255, 255, .8);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  font-size: 13px;
  color: var(--katen-pro-text, #334155);
  transition: all .25s ease;
}

body.dark .katen-reading-toolbar {
  background: rgba(22, 36, 54, .85);
  border-color: #263c56;
  color: #cbd5e1;
}

.katen-reading-toolbar__left,
.katen-reading-toolbar__right {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.katen-reading-time {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: #64748b;
  font-size: 12.5px;
}

body.dark .katen-reading-time {
  color: #94a3b8;
}

.katen-font-resizer {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px 4px;
  background: rgba(0, 0, 0, .05);
  border-radius: 999px;
}

body.dark .katen-font-resizer {
  background: rgba(255, 255, 255, .08);
}

.katen-font-btn {
  border: none;
  background: transparent;
  font-size: 11.5px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 999px;
  cursor: pointer;
  color: inherit;
  transition: all .2s ease;
  line-height: 1.2;
}

.katen-font-btn:hover,
.katen-font-btn.is-active {
  background: var(--katen-pro-accent, #34a3cf);
  color: #fff;
}

.katen-reading-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  background: #fff;
  color: #334155;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: all .2s ease;
  line-height: 1.4;
}

body.dark .katen-reading-btn {
  background: #1c2b3e;
  border-color: #2a3f5a;
  color: #e2e8f0;
}

.katen-reading-btn:hover {
  border-color: var(--katen-pro-accent, #34a3cf);
  color: var(--katen-pro-accent, #34a3cf);
  transform: translateY(-1px);
}

/* Font Scaling on Post Content */
body.katen-font-scale--dec .post-content,
body.katen-font-scale--dec .post-content p {
  font-size: 0.92rem !important;
  line-height: 1.75 !important;
}

body.katen-font-scale--inc .post-content,
body.katen-font-scale--inc .post-content p {
  font-size: 1.20rem !important;
  line-height: 1.85 !important;
}

body.katen-font-scale--xl .post-content,
body.katen-font-scale--xl .post-content p {
  font-size: 1.35rem !important;
  line-height: 1.95 !important;
}

/* ==========================================================================
   Zen Mode (Distraction-Free Editorial Reading)
   ========================================================================== */
body.katen-zen-active {
  background: #ffffff !important;
  color: #1e293b !important;
  overflow-x: hidden;
}

body.dark.katen-zen-active {
  background: #0d1520 !important;
  color: #f1f5f9 !important;
}

body.katen-zen-active :where(
  header,
  .header-default,
  .header-classic,
  .header-personal,
  .header-minimal,
  footer,
  footer.footer,
  .breadcrumbs,
  .sidebar,
  aside,
  .col-lg-4,
  .col-md-4,
  .post-header .meta,
  .post-header .thumb,
  .post-header figure,
  .katen-reading-toolbar,
  .reading-bar-wrapper,
  #katen-reading-progress,
  .katen-topbar-promo,
  .katen-ad-wrapper,
  .katen-ad-slot,
  .adsbygoogle,
  .katen-nextprev-post,
  .nextprev-post,
  .comments-area,
  .comments,
  #comments,
  .comment-respond,
  .katen-inline-related,
  .katen-after-content,
  .katen-ticker,
  .katen-news-ticker,
  .katen-collaboration,
  .katen-author-boxes,
  .katen-community-box,
  .katen-community-article-box,
  .about-author,
  .tags,
  .post-bottom,
  .katen-share-open,
  .katen-share-dialog,
  .switcher-button,
  .canvas-menu,
  .search-popup,
  .main-overlay,
  .katen-print-header,
  .katen-print-byline,
  .whatsapp-float,
  .back-to-top
) {
  display: none !important;
}

body.katen-zen-active .main-content {
  margin: 0 !important;
  padding: 50px 0 100px !important;
  width: 100% !important;
  max-width: 100% !important;
}

body.katen-zen-active .post-container {
  max-width: 760px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}

body.katen-zen-active .row {
  display: block !important;
  margin: 0 !important;
}

body.katen-zen-active .row > [class*="col-"] {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  flex: none !important;
}

body.katen-zen-active .post-single {
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.katen-zen-active .post-header {
  margin-top: 0 !important;
  margin-bottom: 32px !important;
  padding: 0 !important;
  text-align: left !important;
}

body.katen-zen-active .post-header .title {
  font-size: clamp(28px, 4vw, 42px) !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
  color: #0f172a !important;
}

body.dark.katen-zen-active .post-header .title {
  color: #f8fafc !important;
}

body.katen-zen-active .post-content {
  font-size: 1.25rem !important;
  line-height: 2.05 !important;
  letter-spacing: 0.012em !important;
  color: #334155 !important;
  text-align: justify !important;
  text-justify: inter-word !important;
}

body.dark.katen-zen-active .post-content {
  color: #cbd5e1 !important;
}

body.katen-zen-active .post-content p {
  margin-bottom: 24px !important;
}

/* Zen Floating Exit Bar */
.katen-zen-floating-bar {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 999999;
  animation: katenZenSlideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes katenZenSlideDown {
  from {
    transform: translateY(-30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.katen-zen-floating-bar__inner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: #fff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.katen-zen-floating-bar__badge {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: #38bdf8;
}

.katen-zen-exit-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: none;
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.katen-zen-exit-btn:hover {
  background: #ef4444;
  color: #fff;
}

/* ==========================================================================
   1. Floating Top Bar Promo / Course Announcement
   ========================================================================== */
.katen-topbar-promo {
  position: relative;
  z-index: 1040;
  width: 100%;
  font-size: 13.5px;
  line-height: 1.4;
  padding: 10px 0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
}

.katen-topbar-promo.is-hidden {
  display: none !important;
}

.katen-topbar-promo .container-xl {
  gap: 12px;
}

.katen-topbar-content {
  gap: 10px;
}

.katen-topbar-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  background: linear-gradient(135deg, #f59e0b, #ef4444);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 999px;
  box-shadow: 0 2px 6px rgba(245, 158, 11, 0.35);
  white-space: nowrap;
}

.katen-topbar-text {
  font-weight: 600;
  letter-spacing: 0.01em;
}

.katen-topbar-timer {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

.katen-topbar-actions {
  gap: 10px;
  flex-shrink: 0;
}

.katen-topbar-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #ffffff;
  color: #111827 !important;
  font-size: 12px;
  font-weight: 700;
  padding: 5px 14px;
  border-radius: 999px;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  transition: all 0.2s ease;
}

.katen-topbar-btn:hover {
  background: #f3f4f6;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.katen-topbar-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  color: inherit;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.katen-topbar-close:hover {
  background: rgba(255, 255, 255, 0.3);
  transform: rotate(90deg);
}

@media (max-width: 768px) {
  .katen-topbar-promo {
    padding: 8px 0;
    font-size: 12px;
  }
  .katen-topbar-text {
    font-size: 12px;
  }
  .katen-topbar-btn {
    font-size: 11px;
    padding: 4px 10px;
  }
}

/* ==========================================================================
   2. Udemy Classroom UI & AJAX Mark Complete
   ========================================================================== */
.katen-classroom-wrapper {
  background: #f8fafc;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

body.dark .katen-classroom-wrapper {
  background: #0b1120;
}

/* Top Classroom Bar */
.katen-classroom-nav {
  background: #1c1d1f;
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  position: sticky;
  top: 0;
  z-index: 1020;
}

.btn-classroom-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #d1d5db;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  padding: 6px 12px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  transition: all 0.2s ease;
}

.btn-classroom-back:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
}

.katen-classroom-course-title {
  font-size: 13.5px;
  font-weight: 700;
  color: #fff;
  max-width: 420px;
}

.katen-classroom-lesson-title {
  font-size: 12px;
  color: #94a3b8;
  max-width: 420px;
}

/* Classroom Progress Bar in Header */
.katen-classroom-progress-wrap {
  background: rgba(255, 255, 255, 0.06);
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.katen-classroom-progress-bar {
  width: 90px;
  height: 6px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  overflow: hidden;
}

.katen-classroom-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #10b981, #059669);
  border-radius: 999px;
  transition: width 0.4s ease;
}

.katen-classroom-progress-label {
  font-size: 12px;
  font-weight: 700;
  color: #34d399;
}

.katen-classroom-trophy {
  display: inline-flex;
  align-items: center;
  color: #64748b;
  font-size: 14px;
  transition: all 0.3s ease;
}

.katen-classroom-trophy.is-active {
  color: #fbbf24;
  animation: katenTrophyGlow 1.5s infinite alternate;
}

@keyframes katenTrophyGlow {
  from { transform: scale(1); filter: drop-shadow(0 0 2px rgba(251, 191, 36, 0.4)); }
  to { transform: scale(1.15); filter: drop-shadow(0 0 8px rgba(251, 191, 36, 0.8)); }
}

.btn-classroom-syllabus {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.15);
  font-size: 12.5px;
  font-weight: 600;
  border-radius: 6px;
  padding: 6px 14px;
  transition: all 0.2s ease;
}

.btn-classroom-syllabus:hover {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

/* Classroom Workspace */
.katen-classroom-workspace {
  position: relative;
  flex: 1;
  display: flex;
  overflow: hidden;
}

.katen-classroom-stage {
  padding: 28px 36px 60px;
  max-width: 100%;
  overflow-y: auto;
}

.katen-classroom-stage__inner {
  max-width: 960px;
  margin: 0 auto;
}

.katen-classroom-media-frame {
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
  background: #000;
}

.katen-classroom-card {
  background: var(--katen-pro-bg, #ffffff);
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  border-radius: 16px;
  padding: 32px;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
}

body.dark .katen-classroom-card {
  background: #17202f;
  border-color: #263346;
}

.katen-classroom-checkpoints {
  background: rgba(45, 131, 163, 0.06);
  border: 1px solid rgba(45, 131, 163, 0.18);
  color: var(--katen-pro-text);
}

body.dark .katen-classroom-checkpoints {
  background: rgba(56, 189, 248, 0.07);
  border-color: rgba(56, 189, 248, 0.2);
}

/* AJAX Mark Complete Button */
.btn-classroom-complete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 22px;
  font-size: 13.5px;
  font-weight: 700;
  border-radius: 999px;
  background: linear-gradient(135deg, #10b981, #059669);
  color: #ffffff !important;
  border: none;
  box-shadow: 0 4px 14px rgba(16, 185, 129, 0.35);
  cursor: pointer;
  transition: all 0.25s ease;
}

.btn-classroom-complete:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(16, 185, 129, 0.45);
}

.btn-classroom-complete.is-completed {
  background: #ecfdf5 !important;
  color: #065f46 !important;
  border: 1px solid #a7f3d0;
  box-shadow: none;
}

body.dark .btn-classroom-complete.is-completed {
  background: rgba(16, 185, 129, 0.15) !important;
  color: #34d399 !important;
  border-color: rgba(16, 185, 129, 0.3);
}

.btn-classroom-nav-btn {
  padding: 9px 20px;
  font-size: 13.5px;
  font-weight: 600;
  border-radius: 999px;
}

/* Collapsible Syllabus Drawer */
.katen-classroom-drawer {
  width: 360px;
  flex: 0 0 360px;
  background: var(--katen-pro-bg, #ffffff);
  border-left: 1px solid var(--katen-pro-border, #e2e8f0);
  height: calc(100vh - 58px);
  position: sticky;
  top: 58px;
  overflow-y: auto;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 1010;
}

body.dark .katen-classroom-drawer {
  background: #131b28;
  border-color: #202b3c;
}

.katen-drawer-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--katen-pro-border, #f1f5f9);
  text-decoration: none !important;
  color: inherit;
  transition: all 0.2s ease;
}

body.dark .katen-drawer-item {
  border-color: #1e293b;
}

.katen-drawer-item:hover {
  background: rgba(45, 131, 163, 0.05);
}

.katen-drawer-item.is-active {
  background: rgba(45, 131, 163, 0.1);
  border-left: 4px solid var(--katen-pro-accent, #2d83a3);
}

.katen-drawer-item.is-done .katen-drawer-item__title {
  color: var(--katen-pro-muted);
}

.katen-drawer-item__num {
  display: block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--katen-pro-muted);
  letter-spacing: 0.04em;
}

.katen-drawer-item__title {
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--katen-pro-text);
}

.katen-drawer-item__meta {
  font-size: 11.5px;
}

@media (max-width: 991px) {
  .katen-classroom-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 85vw;
    max-width: 380px;
    height: 100vh;
    box-shadow: -8px 0 30px rgba(0, 0, 0, 0.25);
    transform: translateX(100%);
  }
  .katen-classroom-drawer.is-open {
    transform: translateX(0);
  }
  .katen-classroom-stage {
    padding: 20px 16px 50px;
  }
}

/* ==========================================================================
   3. Anti-Eye-Strain Codex Styling (Satu Integrasi & Eye-Care)
   ========================================================================== */
/* Reset stark cyan #eef9fd background to comfortable soft slate / off-white */
.kte-codex-wrap,
.kte-codex-public-shell,
.kte-codex-canvas-shell,
.kte-codex-page {
  border-radius: 14px;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

/* Light Mode: Soft, gentle contrast (replaces eye-straining glaring ice blue) */
.kte-codex-wrap:not(.dark) {
  background-color: #f8fafc !important;
  color: #1e293b !important;
  border: 1px solid #e2e8f0 !important;
  padding: 24px;
}

.kte-codex-wrap:not(.dark) .kte-codex-content {
  color: #334155;
  line-height: 1.7;
}

.kte-codex-wrap:not(.dark) .kte-section-head h2 {
  color: #0f172a !important;
}

/* Dark Mode Integration (Overrides inline styles from style_vars) */
body.dark .kte-codex-wrap,
html[data-kte-theme="dark"] .kte-codex-wrap,
.kte-codex-wrap.dark,
body.dark .kte-codex-public-shell,
body.dark .kte-codex-canvas-shell {
  --kte-bg: #121d2b !important;
  --kte-text: #e2e8f0 !important;
  --kte-accent: #38bdf8 !important;
  background-color: #121d2b !important;
  color: #e2e8f0 !important;
  border-color: #1e2e42 !important;
}

body.dark .kte-codex-wrap .kte-codex-content,
body.dark .kte-codex-page,
body.dark .kte-codex-canvas-inner {
  color: #cbd5e1 !important;
}

body.dark .kte-codex-wrap h1,
body.dark .kte-codex-wrap h2,
body.dark .kte-codex-wrap h3,
body.dark .kte-codex-wrap h4,
body.dark .kte-codex-page h1,
body.dark .kte-codex-page h2,
body.dark .kte-codex-page h3 {
  color: #f8fafc !important;
}

/* Eye-Friendly Codex Code Blocks (VS Code Dark Slate) */
.kte-codex-code,
pre.kte-codex-code,
.kte-codex-content pre,
.kte-codex-page pre {
  background: #0f172a !important;
  border: 1px solid #1e293b !important;
  color: #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 18px 22px !important;
  font-family: 'Fira Code', 'Cascadia Code', 'JetBrains Mono', Consolas, Monaco, monospace !important;
  font-size: 13.5px !important;
  line-height: 1.65 !important;
  overflow-x: auto;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.kte-codex-code code,
pre.kte-codex-code code {
  background: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  font-family: inherit !important;
}

/* Public Codex Shell Integration */
.kte-codex-public-shell {
  padding: 40px 0 60px;
}

.kte-codex-public-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Eye-Care Universal Reset for Klik Ternak Engine (Eliminate #eef9fd glare) */
.kte-engine:not(.dark) {
  --kte-bg: #f8fafc;
  --kte-text: #1e293b;
  --kte-border: #e2e8f0;
}

body.dark .kte-engine,
html[data-kte-theme="dark"] .kte-engine,
.kte-engine.dark {
  --kte-bg: #121d2b !important;
  --kte-text: #e2e8f0 !important;
  --kte-border: #1e2e42 !important;
  --kte-soft: #17202f !important;
  --kte-card: #17202f !important;
  color: #e2e8f0 !important;
}

/* Curriculum clickable item in Single Course landing */
.katen-udemy-curriculum__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--katen-pro-border, #e2e8f0);
  text-decoration: none !important;
  color: inherit;
  transition: all 0.2s ease;
}

.katen-udemy-curriculum__item:hover {
  background: rgba(45, 131, 163, 0.05);
  transform: translateX(4px);
}

.katen-udemy-curriculum__item.is-completed {
  background: rgba(16, 185, 129, 0.04);
}

/* --------------------------------------------------------------------------
 * Farmer Community Profile & Author Showcase
 * ----------------------------------------------------------------------- */
.katen-farmer-profile-container {
  margin-top: 30px;
  margin-bottom: 35px;
}

.katen-farmer-profile-card {
  position: relative;
  background: #ffffff;
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
}

.katen-farmer-profile-card__cover {
  height: 140px;
  background: linear-gradient(135deg, #1e3a5f 0%, #2a87aa 50%, #38bdf8 100%);
  position: relative;
}

.katen-farmer-profile-card__main {
  display: flex;
  flex-direction: column;
  padding: 0 30px 25px;
  gap: 20px;
  position: relative;
}

@media (min-width: 768px) {
  .katen-farmer-profile-card__main {
    flex-direction: row;
    align-items: flex-start;
    gap: 30px;
  }
}

.katen-farmer-avatar-wrap {
  width: 130px;
  height: 130px;
  border-radius: 50%;
  border: 5px solid #ffffff;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);
  margin-top: -65px;
  position: relative;
  background: #f8fafc;
  overflow: visible;
  flex-shrink: 0;
}

.katen-farmer-avatar-wrap img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}

.katen-farmer-verified-badge {
  position: absolute;
  bottom: 4px;
  right: 4px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #10b981;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  border: 3px solid #ffffff;
  box-shadow: 0 3px 8px rgba(16, 185, 129, 0.35);
}

.katen-farmer-profile-card__info-col {
  flex: 1;
  padding-top: 15px;
}

.katen-farmer-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.katen-farmer-name {
  font-size: 26px;
  font-weight: 800;
  margin: 0;
  color: #0f172a;
}

.katen-expert-tag,
.katen-member-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 20px;
  letter-spacing: 0.3px;
}

.katen-expert-tag {
  background: rgba(16, 185, 129, 0.12);
  color: #059669;
  border: 1px solid rgba(16, 185, 129, 0.25);
}

.katen-member-tag {
  background: rgba(45, 131, 163, 0.1);
  color: #2a87aa;
  border: 1px solid rgba(45, 131, 163, 0.2);
}

.katen-farmer-bio {
  font-size: 14.5px;
  line-height: 1.6;
  color: #475569;
  margin-bottom: 14px;
}

.katen-farmer-badges-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 18px;
}

.katen-farmer-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 20px;
  background: #f1f5f9;
  color: #334155;
  text-decoration: none !important;
  transition: all 0.2s ease;
}

.katen-farmer-pill:hover {
  background: #e2e8f0;
}

.katen-farmer-pill--wa {
  background: #25D366;
  color: #ffffff !important;
  box-shadow: 0 3px 10px rgba(37, 211, 102, 0.25);
}

.katen-farmer-pill--wa:hover {
  background: #1eb857;
  transform: translateY(-1px);
}

.katen-farmer-stats-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  padding-top: 14px;
  border-top: 1px solid #f1f5f9;
}

.katen-farmer-stat-item {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.katen-farmer-stat-value {
  font-size: 20px;
  font-weight: 800;
  color: #0f172a;
}

.katen-farmer-stat-label {
  font-size: 13px;
  color: #64748b;
  font-weight: 500;
}

/* Tabs Bar */
.katen-farmer-profile-tabs {
  display: flex;
  overflow-x: auto;
  border-top: 1px solid var(--katen-pro-border, #e2e8f0);
  background: #f8fafc;
  padding: 0 20px;
  scrollbar-width: none;
}

.katen-farmer-profile-tabs::-webkit-scrollbar {
  display: none;
}

.katen-farmer-tab-btn {
  background: none;
  border: none;
  border-bottom: 3px solid transparent;
  padding: 16px 20px;
  font-size: 14.5px;
  font-weight: 700;
  color: #64748b;
  cursor: pointer;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.2s ease;
}

.katen-farmer-tab-btn:hover {
  color: #0f172a;
}

.katen-farmer-tab-btn.is-active {
  color: #2a87aa;
  border-bottom-color: #2a87aa;
  background: rgba(42, 135, 170, 0.04);
}

/* Tab Panes */
.katen-profile-pane {
  display: none;
}

.katen-profile-pane.is-active {
  display: block;
  animation: katenFadeIn 0.3s ease;
}

@keyframes katenFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Certificate Cards */
.katen-farmer-cert-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
}

.katen-cert-card {
  display: flex;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  padding: 22px;
  gap: 18px;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04);
  transition: all 0.25s ease;
  position: relative;
  overflow: hidden;
}

.katen-cert-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(42, 135, 170, 0.1);
  border-color: #cbd5e1;
}

.katen-cert-card__icon {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  color: #d97706;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(217, 119, 6, 0.18);
}

.katen-cert-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.katen-cert-card__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.katen-cert-card__badge {
  font-size: 11px;
  font-weight: 800;
  color: #059669;
  letter-spacing: 0.5px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.katen-cert-card__date {
  font-size: 11.5px;
  color: #94a3b8;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.katen-cert-card__title {
  font-size: 16px;
  font-weight: 700;
  margin: 4px 0 10px;
  color: #0f172a;
  line-height: 1.4;
}

.katen-cert-card__meta {
  font-size: 12.5px;
  color: #64748b;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.katen-cert-card__meta .cert-recipient small,
.katen-cert-card__meta .cert-num small {
  color: #94a3b8;
  margin-right: 4px;
}

.katen-cert-card__meta code {
  font-size: 11.5px;
  background: #f1f5f9;
  padding: 3px 8px;
  border-radius: 6px;
  color: #0284c7;
  font-weight: 600;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.katen-cert-num-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.katen-copy-cert-btn {
  background: transparent;
  border: none;
  padding: 2px 6px;
  font-size: 12.5px;
  color: #64748b;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.katen-copy-cert-btn:hover {
  color: #0284c7;
  background: rgba(2, 132, 199, 0.08);
}

.katen-copy-cert-btn.copied {
  color: #16a34a !important;
}

.katen-cert-card__footer {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: auto;
}

.katen-cert-card__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 700;
  color: #2a87aa;
  text-decoration: none !important;
  background: rgba(42, 135, 170, 0.08);
  padding: 7px 16px;
  border-radius: 999px;
  transition: all 0.2s ease;
  border: none;
  cursor: pointer;
}

.katen-cert-card__btn:hover {
  background: #2a87aa;
  color: #ffffff;
  transform: translateY(-1px);
}

.katen-cert-card__btn--secondary {
  background: #f1f5f9;
  color: #475569;
}

.katen-cert-card__btn--secondary:hover {
  background: #e2e8f0;
  color: #0f172a;
}

.katen-cert-card__btn--preview {
  background: rgba(245, 158, 11, 0.1);
  color: #d97706;
}

.katen-cert-card__btn--preview:hover {
  background: #d97706;
  color: #ffffff;
}

.katen-cert-card__btn--wa {
  background: rgba(37, 211, 102, 0.1);
  color: #16a34a;
}

.katen-cert-card__btn--wa:hover {
  background: #25d366;
  color: #ffffff;
}

/* Course Card & Empty Card */
.katen-course-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.katen-course-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
}

.katen-course-card__thumb-link {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #0f172a;
}

.katen-course-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.35s ease;
}

.katen-course-card:hover .katen-course-card__img {
  transform: scale(1.05);
}

.katen-course-card__placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 40px;
  color: rgba(255, 255, 255, 0.3);
  background: linear-gradient(135deg, #1e293b, #0f172a);
}

.katen-course-card__level {
  position: absolute;
  top: 12px;
  left: 12px;
  font-size: 11px;
  font-weight: 700;
  background: rgba(15, 23, 42, 0.75);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  color: #38bdf8;
  padding: 4px 10px;
  border-radius: 999px;
  text-transform: capitalize;
}

.katen-course-card__content {
  padding: 20px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.katen-course-card__heading {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 16px;
  flex-grow: 1;
}

.katen-course-card__title-link {
  color: #0f172a;
  text-decoration: none !important;
  transition: color 0.15s ease;
}

.katen-course-card__title-link:hover {
  color: #2a87aa;
}

.katen-course-card__progress {
  margin-top: auto;
}

.katen-course-card__progress-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  color: #64748b;
  margin-bottom: 6px;
}

.katen-course-card__progress-track {
  height: 7px;
  background: #f1f5f9;
  border-radius: 999px;
  overflow: hidden;
}

.katen-course-card__progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #2a87aa, #38bdf8);
  border-radius: 999px;
  transition: width 0.5s ease;
}

.katen-empty-card {
  background: #ffffff;
  border: 1px dashed #cbd5e1;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.02);
}

.katen-empty-card h4 {
  font-weight: 700;
  color: #0f172a;
}

/* Certificate Lightbox Modal */
.katen-cert-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.katen-cert-modal.is-active {
  opacity: 1;
  visibility: visible;
}

.katen-cert-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.katen-cert-modal__dialog {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 680px;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  overflow: hidden;
  transform: translateY(20px) scale(0.97);
  transition: transform 0.25s ease;
  border: 1px solid rgba(226, 232, 240, 0.8);
}

.katen-cert-modal.is-active .katen-cert-modal__dialog {
  transform: translateY(0) scale(1);
}

.katen-cert-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px;
  border-bottom: 1px solid #f1f5f9;
}

.katen-cert-modal__icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(245, 158, 11, 0.12);
  color: #f59e0b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}

.katen-cert-modal__title {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
}

.katen-cert-modal__close {
  background: none;
  border: none;
  font-size: 26px;
  line-height: 1;
  color: #94a3b8;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 8px;
  transition: color 0.15s ease, background 0.15s ease;
}

.katen-cert-modal__close:hover {
  color: #0f172a;
  background: #f1f5f9;
}

.katen-cert-modal__body {
  padding: 24px;
  background: #f8fafc;
}

.katen-cert-preview-card {
  position: relative;
  background: #ffffff;
  border: 2px solid #e0b457;
  border-radius: 16px;
  padding: 32px 28px;
  text-align: center;
  box-shadow: 0 8px 24px rgba(224, 180, 87, 0.12);
  overflow: hidden;
}

.katen-cert-preview-card__watermark {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 220px;
  color: rgba(224, 180, 87, 0.05);
  pointer-events: none;
  z-index: 0;
}

.katen-cert-preview-card__inner {
  position: relative;
  z-index: 1;
}

.katen-cert-preview-card__issuer {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #92400e;
  background: rgba(245, 158, 11, 0.1);
  padding: 4px 12px;
  border-radius: 999px;
  margin-bottom: 14px;
}

.katen-cert-preview-card__name {
  font-size: 22px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 6px;
}

.katen-cert-preview-card__sub {
  font-size: 13px;
  color: #64748b;
  margin-bottom: 12px;
}

.katen-cert-preview-card__title {
  font-size: 18px;
  font-weight: 700;
  color: #0284c7;
  margin-bottom: 20px;
}

.katen-cert-preview-card__details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
  background: #f8fafc;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  font-size: 12px;
}

.katen-cert-preview-card__details span {
  display: block;
  color: #64748b;
  font-size: 11px;
  margin-bottom: 2px;
}

.katen-cert-preview-card__details strong {
  display: block;
  color: #0f172a;
  font-size: 12px;
  word-break: break-word;
}

.katen-cert-modal__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 24px;
  background: #ffffff;
  border-top: 1px solid #f1f5f9;
}

/* Community Box & Cards */
.katen-community-box {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 24px;
  padding: 35px 30px;
  margin: 40px 0;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
}

.katen-community-box__header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 30px;
}

.katen-community-box__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.8px;
  color: #2a87aa;
  background: rgba(42, 135, 170, 0.1);
  padding: 5px 14px;
  border-radius: 20px;
  margin-bottom: 12px;
}

.katen-community-box__title {
  font-size: 24px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 8px;
}

.katen-community-box__desc {
  font-size: 14.5px;
  color: #64748b;
  line-height: 1.6;
}

.katen-community-box__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.katen-community-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  padding: 24px;
  display: flex;
  gap: 16px;
  transition: all 0.25s ease;
}

.katen-community-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06);
  border-color: #cbd5e1;
  background: #ffffff;
}

.katen-community-card__icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: rgba(42, 135, 170, 0.1);
  color: var(--c-accent, #2a87aa);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
}

.katen-community-card__content {
  flex: 1;
}

.katen-community-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}

.katen-community-card__top .cat {
  font-size: 11.5px;
  font-weight: 700;
  color: #64748b;
}

.katen-community-card__top .badge {
  font-size: 10px;
  font-weight: 800;
  background: #e2e8f0;
  color: #334155;
  padding: 2px 8px;
  border-radius: 6px;
}

.katen-community-card__name {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 6px;
}

.katen-community-card__text {
  font-size: 13px;
  color: #64748b;
  line-height: 1.5;
  margin-bottom: 16px;
}

.katen-community-card__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  color: #ffffff !important;
  background: var(--c-accent, #2a87aa);
  padding: 8px 18px;
  border-radius: 12px;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transition: all 0.2s ease;
}

.katen-community-card__btn:hover {
  filter: brightness(1.1);
  transform: translateY(-1px);
}

/* --------------------------------------------------------------------------
 * Dark Mode Adaptations for Community & Farmer Profile
 * ----------------------------------------------------------------------- */
body.dark .katen-farmer-profile-card,
html[data-kte-theme="dark"] .katen-farmer-profile-card,
body.dark .katen-cert-card,
html[data-kte-theme="dark"] .katen-cert-card,
body.dark .katen-community-box,
html[data-kte-theme="dark"] .katen-community-box {
  background: #17202f !important;
  border-color: #1e2e42 !important;
}

body.dark .katen-farmer-avatar-wrap,
html[data-kte-theme="dark"] .katen-farmer-avatar-wrap {
  border-color: #17202f !important;
  background: #121d2b !important;
}

body.dark .katen-farmer-name,
html[data-kte-theme="dark"] .katen-farmer-name,
body.dark .katen-farmer-stat-value,
html[data-kte-theme="dark"] .katen-farmer-stat-value,
body.dark .katen-cert-card__title,
html[data-kte-theme="dark"] .katen-cert-card__title,
body.dark .katen-community-box__title,
html[data-kte-theme="dark"] .katen-community-box__title,
body.dark .katen-community-card__name,
html[data-kte-theme="dark"] .katen-community-card__name {
  color: #f1f5f9 !important;
}

body.dark .katen-farmer-bio,
html[data-kte-theme="dark"] .katen-farmer-bio,
body.dark .katen-farmer-stat-label,
html[data-kte-theme="dark"] .katen-farmer-stat-label,
body.dark .katen-cert-card__meta,
html[data-kte-theme="dark"] .katen-cert-card__meta,
body.dark .katen-community-box__desc,
html[data-kte-theme="dark"] .katen-community-box__desc,
body.dark .katen-community-card__text,
html[data-kte-theme="dark"] .katen-community-card__text {
  color: #94a3b8 !important;
}

body.dark .katen-farmer-pill,
html[data-kte-theme="dark"] .katen-farmer-pill,
body.dark .katen-cert-card__meta code,
html[data-kte-theme="dark"] .katen-cert-card__meta code {
  background: #1e2e42 !important;
  color: #cbd5e1 !important;
}

body.dark .katen-farmer-profile-tabs,
html[data-kte-theme="dark"] .katen-farmer-profile-tabs {
  background: #121d2b !important;
  border-color: #1e2e42 !important;
}

body.dark .katen-farmer-tab-btn,
html[data-kte-theme="dark"] .katen-farmer-tab-btn {
  color: #94a3b8 !important;
}

body.dark .katen-farmer-tab-btn.is-active,
html[data-kte-theme="dark"] .katen-farmer-tab-btn.is-active {
  color: #38bdf8 !important;
  border-bottom-color: #38bdf8 !important;
  background: rgba(56, 189, 248, 0.08) !important;
}

body.dark .katen-community-card,
html[data-kte-theme="dark"] .katen-community-card {
  background: #121d2b !important;
  border-color: #1e2e42 !important;
}

body.dark .katen-cert-card__btn--secondary,
html[data-kte-theme="dark"] .katen-cert-card__btn--secondary {
  background: #1e2e42 !important;
  color: #94a3b8 !important;
}

body.dark .katen-cert-card__btn--secondary:hover,
html[data-kte-theme="dark"] .katen-cert-card__btn--secondary:hover {
  background: #28394e !important;
  color: #f1f5f9 !important;
}

body.dark .katen-cert-card__date,
html[data-kte-theme="dark"] .katen-cert-card__date {
  color: #64748b !important;
}

body.dark .katen-course-card,
html[data-kte-theme="dark"] .katen-course-card,
body.dark .katen-empty-card,
html[data-kte-theme="dark"] .katen-empty-card {
  background: #17202f !important;
  border-color: #1e2e42 !important;
}

body.dark .katen-course-card__title-link,
html[data-kte-theme="dark"] .katen-course-card__title-link,
body.dark .katen-empty-card h4,
html[data-kte-theme="dark"] .katen-empty-card h4 {
  color: #f1f5f9 !important;
}

body.dark .katen-course-card__title-link:hover,
html[data-kte-theme="dark"] .katen-course-card__title-link:hover {
  color: #38bdf8 !important;
}

body.dark .katen-course-card__progress-info,
html[data-kte-theme="dark"] .katen-course-card__progress-info {
  color: #94a3b8 !important;
}

body.dark .katen-course-card__progress-track,
html[data-kte-theme="dark"] .katen-course-card__progress-track {
  background: #1e2e42 !important;
}

body.dark .katen-copy-cert-btn,
html[data-kte-theme="dark"] .katen-copy-cert-btn {
  color: #94a3b8;
}

body.dark .katen-copy-cert-btn:hover,
html[data-kte-theme="dark"] .katen-copy-cert-btn:hover {
  color: #38bdf8;
  background: rgba(56, 189, 248, 0.12);
}

body.dark .katen-cert-card__btn--preview,
html[data-kte-theme="dark"] .katen-cert-card__btn--preview {
  background: rgba(245, 158, 11, 0.16) !important;
  color: #fbbf24 !important;
}

body.dark .katen-cert-card__btn--preview:hover,
html[data-kte-theme="dark"] .katen-cert-card__btn--preview:hover {
  background: #f59e0b !important;
  color: #0f172a !important;
}

body.dark .katen-cert-modal__dialog,
html[data-kte-theme="dark"] .katen-cert-modal__dialog,
body.dark .katen-cert-modal__header,
html[data-kte-theme="dark"] .katen-cert-modal__header,
body.dark .katen-cert-modal__footer,
html[data-kte-theme="dark"] .katen-cert-modal__footer {
  background: #17202f !important;
  border-color: #1e2e42 !important;
}

body.dark .katen-cert-modal__body,
html[data-kte-theme="dark"] .katen-cert-modal__body {
  background: #121d2b !important;
}

body.dark .katen-cert-modal__title,
html[data-kte-theme="dark"] .katen-cert-modal__title {
  color: #f1f5f9 !important;
}

body.dark .katen-cert-modal__close,
html[data-kte-theme="dark"] .katen-cert-modal__close {
  color: #94a3b8 !important;
}

body.dark .katen-cert-modal__close:hover,
html[data-kte-theme="dark"] .katen-cert-modal__close:hover {
  color: #ffffff !important;
  background: #1e2e42 !important;
}

body.dark .katen-cert-preview-card,
html[data-kte-theme="dark"] .katen-cert-preview-card {
  background: #17202f !important;
  border-color: #b45309 !important;
}

body.dark .katen-cert-preview-card__name,
html[data-kte-theme="dark"] .katen-cert-preview-card__name {
  color: #f1f5f9 !important;
}

body.dark .katen-cert-preview-card__title,
html[data-kte-theme="dark"] .katen-cert-preview-card__title {
  color: #38bdf8 !important;
}

body.dark .katen-cert-preview-card__sub,
html[data-kte-theme="dark"] .katen-cert-preview-card__sub {
  color: #94a3b8 !important;
}

body.dark .katen-cert-preview-card__details,
html[data-kte-theme="dark"] .katen-cert-preview-card__details {
  background: #121d2b !important;
  border-color: #1e2e42 !important;
}

body.dark .katen-cert-preview-card__details span,
html[data-kte-theme="dark"] .katen-cert-preview-card__details span {
  color: #64748b !important;
}

body.dark .katen-cert-preview-card__details strong,
html[data-kte-theme="dark"] .katen-cert-preview-card__details strong {
  color: #e2e8f0 !important;
}

/* ==========================================================================
   Reader & Learner Experience Upgrades (Reading Progress, Sepia, TOC, Theater, Notes)
   ========================================================================== */

/* Reading Progress Bar (Fixed Top) */
.katen-reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3.5px;
  background: transparent;
  z-index: 999999;
  pointer-events: none;
}

.katen-reading-progress__bar {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #2a87aa, #38bdf8);
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.6);
  transition: width 0.08s ease-out;
}

/* Sepia / Warm Paper Eye-Care Reading Mode */
body.katen-sepia-mode {
  background: #fbf6eb !important;
  color: #3b3024 !important;
}

body.katen-sepia-mode .main-content,
body.katen-sepia-mode .post-single,
body.katen-sepia-mode .post-content {
  color: #3b3024 !important;
}

body.katen-sepia-mode .post-single .title,
body.katen-sepia-mode .post-content h1,
body.katen-sepia-mode .post-content h2,
body.katen-sepia-mode .post-content h3,
body.katen-sepia-mode .post-content h4,
body.katen-sepia-mode .post-content h5,
body.katen-sepia-mode .post-content h6 {
  color: #231b12 !important;
}

body.katen-sepia-mode .post-content p,
body.katen-sepia-mode .post-content li {
  color: #3e3328 !important;
}

body.katen-sepia-mode .post.post-single {
  background: #fbf0d9 !important;
  border-color: #ebdcb9 !important;
  box-shadow: 0 4px 20px rgba(78, 62, 45, 0.05) !important;
}

body.katen-sepia-mode .katen-reading-toolbar {
  background: rgba(251, 240, 217, 0.95) !important;
  border-color: #e2d1a8 !important;
  color: #4a3c2c !important;
}

body.katen-sepia-mode .katen-reading-btn.is-active,
body.katen-sepia-mode .katen-sepia-toggle.is-active {
  background: #b45309 !important;
  color: #ffffff !important;
  border-color: #b45309 !important;
}

body.katen-sepia-mode blockquote {
  background: #f5ebd2 !important;
  border-left-color: #d97706 !important;
  color: #43362a !important;
}

/* In-Article Table of Contents (TOC) */
.katen-toc {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 20px 24px;
  margin: 28px 0 34px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
  transition: all 0.25s ease;
}

.katen-toc__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.katen-toc__title {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.katen-toc__toggle {
  background: none;
  border: none;
  font-size: 12px;
  font-weight: 600;
  color: #2a87aa;
  cursor: pointer;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(42, 135, 170, 0.08);
  transition: all 0.15s ease;
}

.katen-toc__toggle:hover {
  background: #2a87aa;
  color: #ffffff;
}

.katen-toc__list {
  margin: 0;
  padding-left: 20px;
  display: grid;
  gap: 8px;
  font-size: 14px;
}

.katen-toc__list[hidden] {
  display: none !important;
}

.katen-toc__item a {
  color: #334155;
  text-decoration: none;
  transition: color 0.15s ease;
}

.katen-toc__item a:hover {
  color: #2a87aa;
  text-decoration: underline;
}

.katen-toc__item--sub {
  margin-left: 15px;
  font-size: 13px;
  color: #64748b;
}

body.dark .katen-toc {
  background: #17202f;
  border-color: #1e2e42;
}

body.dark .katen-toc__title {
  color: #f1f5f9;
}

body.dark .katen-toc__item a {
  color: #cbd5e1;
}

body.dark .katen-toc__item a:hover {
  color: #38bdf8;
}

body.katen-sepia-mode .katen-toc {
  background: #f5ebd2;
  border-color: #ebdcb9;
}

body.katen-sepia-mode .katen-toc__title {
  color: #231b12;
}

body.katen-sepia-mode .katen-toc__item a {
  color: #3e3328;
}

/* Classroom Theater & Focus Controls */
.btn-classroom-theater,
.btn-classroom-shortcuts {
  background: rgba(255, 255, 255, 0.1);
  color: #cbd5e1;
  border: 1px solid rgba(255, 255, 255, 0.15);
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 12.5px;
  transition: all 0.2s ease;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
}

.btn-classroom-theater:hover,
.btn-classroom-shortcuts:hover {
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
}

.btn-classroom-theater.is-active {
  background: #38bdf8 !important;
  color: #0f172a !important;
  border-color: #38bdf8 !important;
}

.katen-classroom-wrapper.is-theater .katen-classroom-stage__inner {
  max-width: 1400px !important;
}

.katen-classroom-wrapper.is-theater .katen-classroom-media {
  margin: -10px -10px 24px -10px;
}

.katen-classroom-wrapper.is-theater .katen-classroom-drawer {
  transform: translateX(100%);
  position: absolute;
  right: 0;
  box-shadow: -10px 0 30px rgba(0, 0, 0, 0.2);
}

/* Student Personal Notes Scratchpad */
.katen-classroom-notes {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.katen-classroom-notes__input {
  font-size: 13.5px;
  line-height: 1.6;
  border-radius: 12px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #0f172a;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.katen-classroom-notes__input:focus {
  border-color: #2a87aa;
  box-shadow: 0 0 0 3px rgba(42, 135, 170, 0.15);
}

body.dark .katen-classroom-notes {
  background: #121d2b;
  border-color: #1e2e42;
}

body.dark .katen-classroom-notes__input {
  background: #17202f;
  border-color: #263346;
  color: #f1f5f9;
}

/* Shortcuts Cheat Sheet Modal */
.katen-shortcuts-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

.katen-shortcuts-modal.is-active {
  opacity: 1;
  visibility: visible;
}

.katen-shortcuts-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.65);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.katen-shortcuts-modal__dialog {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 440px;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  border: 1px solid rgba(226, 232, 240, 0.8);
}

body.dark .katen-shortcuts-modal__dialog {
  background: #17202f;
  border-color: #1e2e42;
  color: #f1f5f9;
}

body.dark .katen-shortcuts-modal__dialog .bg-light-subtle {
  background: #121d2b !important;
}

/* ==========================================================================
   KlikTernak & KATENX - Text-to-Speech (TTS) Reader & Controls
   ========================================================================== */
.katen-reading-btn.katen-tts-toggle.is-active {
  background: #2d83a3;
  color: #ffffff !important;
  border-color: #2d83a3;
  box-shadow: 0 4px 12px rgba(45, 131, 163, 0.3);
}

.katen-tts-player {
  background: #ffffff;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 14px;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.08);
  margin-top: 12px;
  margin-bottom: 20px;
  padding: 12px 18px;
  position: relative;
  transition: all 0.25s ease;
}

.katen-tts-player__inner {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.katen-tts-player__controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.katen-tts-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: #f1f5f9;
  color: #1e293b;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 0.85rem;
}

.katen-tts-btn:hover {
  background: #e2e8f0;
  color: #0f172a;
}

.katen-tts-btn--play,
.katen-tts-btn--pause {
  background: #2d83a3;
  color: #ffffff;
}

.katen-tts-btn--play:hover,
.katen-tts-btn--pause:hover {
  background: #256d85;
  color: #ffffff;
}

.katen-tts-btn--stop {
  background: #fee2e2;
  color: #ef4444;
}

.katen-tts-btn--stop:hover {
  background: #fecaca;
  color: #dc2626;
}

.katen-tts-speed {
  display: inline-flex;
  align-items: center;
  background: #f1f5f9;
  border-radius: 20px;
  padding: 2px 4px;
  gap: 2px;
}

.katen-tts-speed-btn {
  border: none;
  background: transparent;
  padding: 3px 8px;
  border-radius: 14px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b;
  cursor: pointer;
  transition: all 0.2s ease;
}

.katen-tts-speed-btn.is-active {
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08);
}

.katen-tts-player__info {
  flex: 1 1 200px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.katen-tts-status {
  font-size: 0.8125rem;
  color: #475569;
  font-weight: 500;
}

.katen-tts-progress-track {
  width: 100%;
  height: 5px;
  background: #e2e8f0;
  border-radius: 10px;
  overflow: hidden;
}

.katen-tts-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, #2d83a3, #34a3cf);
  transition: width 0.3s ease;
}

.katen-tts-close {
  border: none;
  background: transparent;
  color: #94a3b8;
  font-size: 1rem;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.2s ease;
}

.katen-tts-close:hover {
  color: #0f172a;
}

.katen-tts-highlight {
  background: rgba(45, 131, 163, 0.08) !important;
  border-left: 3px solid #2d83a3 !important;
  padding-left: 14px !important;
  border-radius: 4px;
  transition: background 0.3s ease, border-color 0.3s ease;
}

body.katen-sepia-mode .katen-tts-highlight {
  background: rgba(180, 83, 9, 0.12) !important;
  border-left-color: #b45309 !important;
}

body.dark .katen-tts-player {
  background: #17202f;
  border-color: #1e2e42;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

body.dark .katen-tts-btn {
  background: #1e2e42;
  color: #e2e8f0;
}

body.dark .katen-tts-btn:hover {
  background: #2a3c54;
  color: #ffffff;
}

body.dark .katen-tts-speed {
  background: #121d2b;
}

body.dark .katen-tts-speed-btn {
  color: #94a3b8;
}

body.dark .katen-tts-speed-btn.is-active {
  background: #1e2e42;
  color: #f1f5f9;
}

body.dark .katen-tts-status {
  color: #94a3b8;
}

body.dark .katen-tts-progress-track {
  background: #1e2e42;
}

body.dark .katen-tts-close {
  color: #64748b;
}

body.dark .katen-tts-close:hover {
  color: #f1f5f9;
}

body.dark .katen-tts-highlight {
  background: rgba(52, 163, 207, 0.15) !important;
  border-left-color: #34a3cf !important;
}

/* ==========================================================================
   PRO Badge & User Role Badges
   ========================================================================== */
.katen-badge-pro {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  color: #ffffff !important;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 6px;
  vertical-align: middle;
  margin-right: 8px;
  box-shadow: 0 2px 6px rgba(217, 119, 6, 0.35);
  line-height: 1.4;
}

.katen-badge-pro i {
  font-size: 0.65rem;
}

.katen-role-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 20px;
  line-height: 1.4;
  letter-spacing: 0.2px;
  transition: all 0.2s ease;
  margin-left: 6px;
  vertical-align: middle;
}

.katen-role-badge--admin {
  background: rgba(220, 38, 38, 0.12);
  color: #dc2626;
  border: 1px solid rgba(220, 38, 38, 0.25);
}

.katen-role-badge--enterprise {
  background: rgba(79, 70, 229, 0.12);
  color: #4f46e5;
  border: 1px solid rgba(79, 70, 229, 0.25);
}

.katen-role-badge--pro {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.15) 0%, rgba(217, 119, 6, 0.18) 100%);
  color: #b45309;
  border: 1px solid rgba(245, 158, 11, 0.4);
}

.katen-role-badge--basic {
  background: rgba(14, 165, 233, 0.12);
  color: #0284c7;
  border: 1px solid rgba(14, 165, 233, 0.25);
}

.katen-role-badge--instructor {
  background: rgba(16, 185, 129, 0.12);
  color: #059669;
  border: 1px solid rgba(16, 185, 129, 0.25);
}

.katen-role-badge--member {
  background: rgba(100, 116, 139, 0.12);
  color: #475569;
  border: 1px solid rgba(100, 116, 139, 0.22);
}

body.dark .katen-role-badge--admin {
  background: rgba(239, 68, 68, 0.2);
  color: #f87171;
  border-color: rgba(239, 68, 68, 0.35);
}

body.dark .katen-role-badge--enterprise {
  background: rgba(99, 102, 241, 0.2);
  color: #818cf8;
  border-color: rgba(99, 102, 241, 0.35);
}

body.dark .katen-role-badge--pro {
  background: rgba(245, 158, 11, 0.2);
  color: #fbbf24;
  border-color: rgba(245, 158, 11, 0.4);
}

body.dark .katen-role-badge--basic {
  background: rgba(56, 189, 248, 0.2);
  color: #38bdf8;
  border-color: rgba(56, 189, 248, 0.35);
}

body.dark .katen-role-badge--instructor {
  background: rgba(52, 211, 153, 0.2);
  color: #34d399;
  border-color: rgba(52, 211, 153, 0.35);
}

body.dark .katen-role-badge--member {
  background: rgba(148, 163, 184, 0.15);
  color: #cbd5e1;
  border-color: rgba(148, 163, 184, 0.25);
}

/* ==========================================================================
   VIP Unlocked Banner & Premium Paywall Card
   ========================================================================== */
.katen-vip-unlocked-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.12) 0%, rgba(217, 119, 6, 0.18) 100%);
  border: 1px solid rgba(245, 158, 11, 0.35);
  border-radius: 12px;
  padding: 12px 18px;
  margin-bottom: 24px;
  color: #92400e;
  font-weight: 600;
  font-size: 0.9375rem;
  box-shadow: 0 4px 14px rgba(245, 158, 11, 0.1);
}

.katen-vip-unlocked-banner i {
  font-size: 1.15rem;
  color: #d97706;
}

body.dark .katen-vip-unlocked-banner {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.15) 0%, rgba(217, 119, 6, 0.25) 100%);
  border-color: rgba(245, 158, 11, 0.4);
  color: #fef3c7;
}

.katen-paywall-wrapper {
  position: relative;
  margin-top: -30px;
  padding-top: 50px;
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.85) 40px, #ffffff 90px);
  clear: both;
}

body.dark .katen-paywall-wrapper {
  background: linear-gradient(to bottom, rgba(23,32,47,0) 0%, rgba(23,32,47,0.85) 40px, #17202f 90px);
}

.katen-paywall-card {
  background: #ffffff;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 20px;
  padding: 36px 32px;
  text-align: center;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
  position: relative;
  overflow: hidden;
  max-width: 720px;
  margin: 0 auto;
}

.katen-paywall-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  background: linear-gradient(90deg, #f59e0b, #e11d48, #2563eb);
}

.katen-paywall-card__icon-wrap {
  margin-bottom: 16px;
}

.katen-paywall-card__icon {
  width: 60px;
  height: 60px;
  margin: 0 auto;
  border-radius: 50%;
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  color: #d97706;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  box-shadow: 0 8px 20px rgba(245, 158, 11, 0.25);
}

.katen-paywall-card__badge {
  display: inline-block;
  background: #fef3c7;
  color: #b45309;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  padding: 3px 10px;
  border-radius: 20px;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.katen-paywall-card__title {
  font-size: 1.45rem;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 10px;
  line-height: 1.35;
}

.katen-paywall-card__desc {
  font-size: 0.95rem;
  color: #64748b;
  max-width: 560px;
  margin: 0 auto 24px;
  line-height: 1.6;
}

.katen-paywall-card__features {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px 20px;
  text-align: left;
  background: #f8fafc;
  padding: 20px 24px;
  border-radius: 14px;
  margin-bottom: 28px;
  border: 1px solid #f1f5f9;
}

.katen-paywall-feature-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.875rem;
  color: #334155;
  font-weight: 500;
}

.katen-paywall-feature-item i {
  color: #10b981;
  font-size: 0.9rem;
  flex-shrink: 0;
}

.katen-paywall-card__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.btn-paywall-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  color: #ffffff !important;
  font-weight: 700;
  font-size: 0.9375rem;
  padding: 12px 26px;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(217, 119, 6, 0.35);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  text-decoration: none;
}

.btn-paywall-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 25px rgba(217, 119, 6, 0.45);
  color: #ffffff !important;
}

.btn-paywall-login {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  color: #475569 !important;
  border: 1px solid #cbd5e1;
  font-weight: 600;
  font-size: 0.9375rem;
  padding: 11px 22px;
  border-radius: 12px;
  transition: all 0.2s ease;
  text-decoration: none;
}

.btn-paywall-login:hover {
  background: #f1f5f9;
  color: #0f172a !important;
  border-color: #94a3b8;
}

body.dark .katen-paywall-card {
  background: #17202f;
  border-color: #1e2e42;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);
}

body.dark .katen-paywall-card__title {
  color: #f8fafc;
}

body.dark .katen-paywall-card__desc {
  color: #94a3b8;
}

body.dark .katen-paywall-card__features {
  background: #121d2b;
  border-color: #1e2e42;
}

body.dark .katen-paywall-feature-item {
  color: #cbd5e1;
}

body.dark .btn-paywall-login {
  color: #cbd5e1 !important;
  border-color: #334155;
}

body.dark .btn-paywall-login:hover {
  background: #1e2e42;
  color: #ffffff !important;
  border-color: #475569;
}

@media (max-width: 640px) {
  .katen-paywall-card {
    padding: 24px 18px;
  }
  .katen-paywall-card__features {
    grid-template-columns: 1fr;
    padding: 16px;
  }
  .katen-paywall-card__actions {
    flex-direction: column;
    width: 100%;
  }
  .btn-paywall-cta, .btn-paywall-login {
    width: 100%;
    justify-content: center;
  }
}

/* ==========================================================================
   1. User-Supplied Custom Styles & Components
   ========================================================================== */
.categories,.category-card,.dropdown-menu,.hero-image,.hero-section,.heroman,.section-title,.slick-slider{position:relative}.button,.hero-image,.hero-section,.heroman,.slick-list{overflow:hidden}.button,.category-card a,.custom-link{text-decoration:none}::selection{background:#2d85a5!important;color:#fff}.hero-text,.scroll-indicator,.theme-toggle,body,.modal-content,#katenShareUrl,#katenCopyUrlBtn,.btn-close{transition:background-color .3s,color .3s,border-color .3s}.button,.category-card,.heroman{transition:background-color .3s,color .3s,border-color .3s,transform .3s,box-shadow .3s}.is-single.post-content p:first-of-type::first-letter{font-weight:700;color:#2d83a3;font-size:200%;float:left;margin-right:6px;margin-top:-4px;text-transform:uppercase}.is-single.post-content p{text-align:justify}.post .post-bottom .more-button a{font-size:16px;font-weight:700;color:#fff}.wp-block-latest-posts{list-style-type:none;padding:0;margin:0}.wp-block-latest-posts__featured-image{float:left;margin-right:10px}.wp-block-latest-posts__post-title{font-weight:700;font-size:1em}.wp-block-latest-posts__post-excerpt{font-size:.9em;color:#555}.wp-block-latest-posts__post-date{font-size:.8em;color:#999}.grecaptcha-badge{display:none}.slick-slide{display:flex;justify-content:center;align-items:center;margin:0 auto}.slick-track{display:flex;align-items:center}.slick-slide img{max-width:100%;height:auto}#search-3 .searchform{display:flex;align-items:center;justify-content:center;gap:10px}#search-3 .searchform input[type=text]{flex:1;padding:10px;font-size:16px;border:1px solid #ccc;border-radius:8px}#search-3 .searchform input[type=submit]{padding:10px 20px;font-size:16px;background-color:#007bff;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s}#search-3 .searchform input[type=submit]:hover{background-color:#0056b3}.dropdown-menu::after{content:"";display:block;height:0;width:0;position:absolute;top:-10px;left:25%;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:10px solid #d9d9d9}.dropdown-menu.dark::after{border-bottom:10px solid #142130}.transparent-bg{background-color:#fff;color:#333}.transparent-bg.dark{background-color:#15314a;color:#f8f9fa}.custom-link{color:#007bff}.custom-link:hover{text-decoration:underline}.whatsapp-icon{margin-left:5px}.main-content{margin-top:10px!important}.hero-section{padding:60px 0}@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(5deg)}}.hero-section::after,.hero-section::before{content:'';position:absolute;background:#329ac3;opacity:.1;border-radius:50%;z-index:-1}.hero-section::before{top:-50px;right:-50px;width:300px;height:300px;animation:6s ease-in-out infinite float}.hero-section::after{bottom:-50px;left:-50px;width:200px;height:200px;animation:8s ease-in-out infinite reverse float}.heroman{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:40px;box-shadow:0 15px 35px rgba(50,154,195,.1);border:1px solid rgba(255,255,255,.2)}.button,.hero-text h2{background:linear-gradient(45deg,#329ac3,#2a7fa8)}.heroman:hover{transform:translateY(-5px)}body.dark .heroman{background:rgba(30,40,55,.8);border:1px solid rgba(255,255,255,.1);box-shadow:0 15px 35px rgba(77,184,224,.1)}body.dark .button,body.dark .hero-text h2,body.dark .section-title h2::after{background:linear-gradient(45deg,#4db8e0,#329ac3)}.hero-text h2,body.dark .hero-text h2{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.hero-image{flex:1;border-radius:15px;box-shadow:0 10px 25px rgba(0,0,0,.1)}body.dark .hero-image{box-shadow:0 10px 25px rgba(0,0,0,.3)}.hero-image img{width:100%;max-width:500px;height:auto;display:block;transition:transform .5s}.button,.section-title h2{display:inline-block;position:relative}.hero-image:hover img{transform:scale(1.05)}.hero-text{flex:1;padding-left:40px}.hero-text h2{font-size:2.5rem;font-weight:700;margin-bottom:20px;line-height:1.2}.hero-text p{font-size:1.1rem;margin-bottom:30px;color:#555;line-height:1.6}body.dark .hero-text p{color:#b0b3b8}.button{padding:14px 30px;color:#fff;border-radius:50px;font-weight:600;box-shadow:0 5px 15px rgba(50,154,195,.3)}.category-card,.scroll-indicator{background:rgba(255,255,255,.9);cursor:pointer}body.dark .button{box-shadow:0 5px 15px rgba(77,184,224,.3)}.button::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s}.button:hover::before{left:100%}.button:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(50,154,195,.4)}body.dark .button:hover{box-shadow:0 8px 20px rgba(77,184,224,.4)}.categories-section{padding:40px 0 60px}.section-title{text-align:center;margin-bottom:40px}.section-title h2{font-size:2rem;font-weight:600;color:#333}body.dark .section-title h2{color:#e4e6eb}.section-title h2::after{content:'';position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);width:80px;height:4px;background:linear-gradient(45deg,#329ac3,#2a7fa8);border-radius:2px}.categories{display:flex;overflow-x:auto;padding:20px 0;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#329AC3 #f1f1f1}body.dark .categories{scrollbar-color:#4db8e0 #2a3441}.categories::-webkit-scrollbar{height:8px}.categories::-webkit-scrollbar-thumb{background:linear-gradient(45deg,#329ac3,#2a7fa8);border-radius:10px}body.dark .categories::-webkit-scrollbar-thumb{background:linear-gradient(45deg,#4db8e0,#329ac3)}.categories::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}body.dark .categories::-webkit-scrollbar-track{background:#2a3441}.category-card{flex:0 0 220px;height:280px;border-radius:20px;overflow:hidden;margin-right:20px;box-shadow:0 10px 20px rgba(0,0,0,.1)}body.dark .category-card{background:rgba(30,40,55,.9);box-shadow:0 10px 20px rgba(0,0,0,.3)}.category-card::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,rgba(0,0,0,.1),rgba(0,0,0,.7));z-index:1;opacity:0;transition:opacity .3s}body.dark .category-card::before{background:linear-gradient(to bottom,rgba(0,0,0,.3),rgba(0,0,0,.8))}.category-card:hover::before{opacity:1}.category-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.category-card:hover img{transform:scale(1.1)}.category-title{position:absolute;bottom:20px;left:20px;color:#fff;font-weight:600;font-size:1.1rem;z-index:2;text-shadow:0 2px 4px rgba(0,0,0,.5);transform:translateY(10px);opacity:.9;transition:transform .3s,opacity .3s}.category-card:hover .category-title{transform:translateY(0);opacity:1}.category-card:hover{transform:translateY(-10px);box-shadow:0 15px 30px rgba(0,0,0,.15)}body.dark .category-card:hover{box-shadow:0 15px 30px rgba(0,0,0,.5)}.category-card a{display:block;width:100%;height:100%}.scroll-indicator{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border:1px solid rgba(0,0,0,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 5px 15px rgba(0,0,0,.1);z-index:10;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}body.dark .scroll-indicator{background:rgba(30,40,55,.9);border:1px solid rgba(255,255,255,.1);box-shadow:0 5px 15px rgba(0,0,0,.3)}.scroll-indicator:hover{background:#329ac3;color:#fff}body.dark .scroll-indicator:hover{background:#4db8e0}.scroll-indicator i{color:#329ac3;transition:color .3s}body.dark .scroll-indicator i{color:#4db8e0}.scroll-indicator:hover i{color:#fff}.scroll-left{left:-20px}.scroll-right{right:-20px}@keyframes pulse{0%,100%{opacity:.6}50%{opacity:1}}.loading{animation:1.5s infinite pulse}@media (max-width:992px){.hero-text h2{font-size:2rem}.hero-text p{font-size:1rem}}@media (max-width:768px){.heroman{flex-direction:column;padding:30px 20px}.hero-text{padding-left:0;padding-top:30px;text-align:center}.hero-text h2{font-size:1.8rem}.category-card{flex:0 0 180px;height:230px}.scroll-indicator{display:none}}@media (max-width:576px){.hero-section{padding:40px 0}.hero-text h2{font-size:1.5rem}.category-card{flex:0 0 150px;height:200px}.category-title{font-size:.9rem}}@media (max-width:600px){.widget .searchform{display:flex;flex-direction:column;align-items:stretch}.widget .searchform input[type=text]{max-width:100%;width:100%;padding:10px;font-size:16px;margin-bottom:10px;border:1px solid #ccc;border-radius:8px;display:block}.widget .searchform input[type=submit]{width:100%;padding:12px;font-size:16px;background-color:#007bff;color:#fff;border:none;border-radius:8px;cursor:pointer}}img.emoji.smush-detected-img.smush-image-smaller-1{width:clamp(24px,4vw,64px);height:auto}body.dark .dropdown-menu.depth_0{background-color:#142130;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 40px rgba(0,0,0,.5)}body.dark .dropdown-menu.depth_0 .nav-item a.dropdown-item{color:#cbd5e1}body.dark .dropdown-menu.depth_0 .nav-item a.dropdown-item:focus,body.dark .dropdown-menu.depth_0 .nav-item a.dropdown-item:hover{background-color:rgba(255,255,255,.1);color:#fff}body.dark .dropdown-menu.depth_0 .nav-item a.dropdown-item:active{background-color:rgba(255,255,255,.15)}body.dark .dropdown-menu.depth_0 .dropdown-divider{border-color:rgba(255,255,255,.1)}body.dark .dropdown-menu.depth_0::before{background:#142130;border-left:1px solid rgba(255,255,255,.1);border-top:1px solid rgba(255,255,255,.1)}.is-single.post-content li p::first-letter,.is-single.post-content li::first-letter{font-size:inherit!important;float:none!important;margin:0!important;text-transform:none!important;color:inherit!important;font-weight:inherit!important}body.dark .modal-content{background-color:#161d25!important;border:1px solid rgba(255,255,255,.1)!important;color:#e9ecef;box-shadow:0 10px 40px rgba(0,0,0,.5)}body.dark .modal-header{border-bottom-color:rgba(255,255,255,.1)!important}body.dark .modal-footer{border-top-color:rgba(255,255,255,.1)!important}body.dark .modal-title{color:#e9ecef!important}body.dark .modal-body{color:#ced4da}body.dark .modal .btn-close{filter:invert(1) grayscale(100%) brightness(200%);opacity:.8}body.dark .modal .btn-close:hover{opacity:1}body.dark #katenShareUrl{background-color:#1e252e!important;color:#e9ecef!important;border-color:#2c3540!important}body.dark #katenCopyUrlBtn{background-color:#2c3540!important;border-color:#3a4550!important;color:#e9ecef!important}body.dark #katenCopyUrlBtn:hover{background-color:#3a4550!important}body.dark .btn-share{box-shadow:0 2px 8px rgba(0,0,0,.4)}body.dark .btn-share:hover{box-shadow:0 6px 15px rgba(0,0,0,.6)}#media_image-3>a{display:block;text-align:center}#media_image-3>a img{display:inline-block;margin:0 auto}.section-header{text-align:center}.section-header .section-title{text-align:center;margin-left:auto;margin-right:auto}.section-header svg{display:block;margin:0 auto}.elementor-widget span[align="center"]{display:block!important;max-width:100%!important;box-sizing:border-box!important}.elementor-widget .adsbygoogle{display:block!important;max-width:100%!important;overflow:hidden!important;box-sizing:border-box!important}.elementor-widget .adsbygoogle div,.elementor-widget .adsbygoogle iframe{max-width:100%!important}#mailpoet_form_1 h2.mailpoet-heading img.emoji{width:20px!important;height:20px!important;vertical-align:middle!important}

/* ==========================================================================
   2. Header Alignment, Contrast & Responsiveness Fix (Image 1)
   ========================================================================== */
.header-default .navbar > .container-xl,
.header-classic .navbar > .container-xl,
.header-personal .navbar > .container-xl,
.header-minimal .navbar > .container-xl {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
  gap: 12px;
}

.navbar-brand {
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  margin-right: 14px !important;
}

body.dark .navbar-brand.logo-dark img,
body.dark .navbar-brand img {
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.45)) drop-shadow(0 1px 4px rgba(255, 255, 255, 0.25));
  transition: filter 0.25s ease;
}

body.dark .navbar-brand:hover img {
  filter: drop-shadow(0 0 2px rgba(56, 189, 248, 0.6)) drop-shadow(0 1px 6px rgba(56, 189, 248, 0.35));
}

@media (min-width: 992px) {
  .header-default .navbar-collapse,
  .navbar-expand-lg .navbar-collapse {
    display: flex !important;
    align-items: center !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  .header-default .navbar-nav,
  .navbar-expand-lg .navbar-nav {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    margin-left: clamp(10px, 2vw, 28px) !important;
    gap: 2px !important;
  }

  .navbar-expand-lg .navbar-nav .nav-link {
    white-space: nowrap !important;
    padding: 0.5rem clamp(8px, 1.2vw, 16px) !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  .navbar-nav .nav-item {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }
}

.header-right {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  margin-left: auto !important;
  gap: 12px !important;
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}

.header--gap-compact .header-right {
  gap: 6px !important;
}
.header--gap-compact .navbar-nav .nav-link {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.header--gap-normal .header-right {
  gap: 12px !important;
}

.header--gap-spacious .header-right {
  gap: 20px !important;
}
.header--gap-spacious .navbar-nav .nav-link {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

/* Logo Center Layout */
@media (min-width: 992px) {
  .header--logo-align-center .navbar > .container-xl {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
  }
  .header--logo-align-center .header-logo-wrap {
    order: 2 !important;
    margin: 0 auto !important;
    text-align: center !important;
  }
  .header--logo-align-center .navbar-collapse {
    order: 1 !important;
    flex: 1 1 0 !important;
  }
  .header--logo-align-center .header-right {
    order: 3 !important;
    flex: 1 1 0 !important;
    justify-content: flex-end !important;
  }
}

.header-right .header-buttons,
.header-right .header-buttons--main,
.header-right .header-buttons--before,
.header-buttons {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  margin-left: 0 !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}

.header-right .header-buttons button,
.header-right button.search,
.header-right .search.icon-button,
.header-buttons button {
  margin-left: 0 !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.katen-header-account {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
  margin-right: 0 !important;
  white-space: nowrap !important;
}

.katen-header-account__academy,
.katen-header-account__toggle,
.katen-header-account__guest {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

@media (min-width: 992px) and (max-width: 1250px) {
  .header-default .navbar > .container-xl,
  .header-classic .navbar > .container-xl {
    gap: 6px !important;
  }
  .navbar-expand-lg .navbar-nav .nav-link {
    padding-left: clamp(4px, 0.8vw, 10px) !important;
    padding-right: clamp(4px, 0.8vw, 10px) !important;
    font-size: 13.5px !important;
  }
  .header-default .navbar-nav {
    margin-left: 10px !important;
  }
  .header-right {
    gap: 6px !important;
  }
  .katen-header-account {
    gap: 6px !important;
  }
  .katen-header-account__academy {
    padding: 6px 12px !important;
    font-size: 12px !important;
  }
  .katen-header-account__toggle {
    padding: 3px 8px !important;
  }
}

body.dark .katen-header-account__academy {
  background: rgba(45, 131, 163, 0.22) !important;
  color: #38bdf8 !important;
  border: 1px solid rgba(56, 189, 248, 0.28) !important;
}

body.dark .katen-header-account__academy:hover {
  background: #2d83a3 !important;
  color: #ffffff !important;
}

body.dark .katen-header-account__toggle {
  border-color: rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.06) !important;
}

body.dark .katen-header-account__toggle:hover {
  border-color: #38bdf8 !important;
  background: rgba(255, 255, 255, 0.12) !important;
}

body.dark .katen-header-account__name {
  color: #f1f5f9 !important;
}

body.dark .katen-header-account__arrow {
  color: #94a3b8 !important;
}

@media (max-width: 991px) {
  .header-default,
  .header-classic,
  .header-personal,
  .header-minimal {
    padding: 16px 0 !important;
  }

  .header-right {
    gap: 6px !important;
  }

  .katen-header-account {
    gap: 6px !important;
  }

  .header-right .header-buttons button {
    width: 38px !important;
    height: 38px !important;
  }
}

@media (max-width: 576px) {
  .navbar-brand img {
    max-height: 36px !important;
    width: auto !important;
  }

  .header-right {
    gap: 4px !important;
  }

  .katen-header-account__toggle {
    padding: 2px 4px !important;
  }

  .katen-header-account__academy {
    padding: 6px 10px !important;
  }
}

/* ==========================================================================
   3. News Ticker (Thicker) - Light & Dark Mode Support (Image 2)
   ========================================================================== */
.katen-news-ticker {
  display: flex !important;
  align-items: center !important;
  min-height: 50px !important;
  margin: 22px 0 !important;
  overflow: hidden !important;
  border-radius: 9999px !important;
  position: relative !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease !important;
}

.katen-news-ticker__label {
  align-self: stretch !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 22px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: 0.02em !important;
  white-space: nowrap !important;
  border-radius: 9999px 0 0 9999px !important;
}

.katen-news-ticker__viewport {
  min-width: 0 !important;
  flex: 1 1 auto !important;
  overflow: hidden !important;
}

.katen-news-ticker__track {
  width: 100% !important;
}

.katen-news-ticker__track a {
  align-items: center !important;
  gap: 12px !important;
  padding: 0 18px !important;
  text-decoration: none !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  transition: color 0.2s ease !important;
}

.katen-news-ticker__title {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.katen-news-ticker__nav {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding-right: 12px !important;
  padding-left: 6px !important;
  flex-shrink: 0 !important;
}

.katen-news-ticker__nav button {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  font-size: 18px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
}

/* Light Mode: Default Ticker */
.katen-news-ticker {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  color: #1e293b;
}

.katen-news-ticker .katen-news-ticker__label {
  background: linear-gradient(135deg, #2d83a3 0%, #34a3cf 100%);
  color: #ffffff;
}

.katen-news-ticker .katen-news-ticker__track a {
  color: #1e293b;
}

.katen-news-ticker .katen-news-ticker__track a:hover {
  color: #2d83a3;
}

.katen-news-ticker__nav button {
  background: #f1f5f9;
  color: #334155;
  border: 1px solid #e2e8f0;
}

.katen-news-ticker__nav button:hover {
  background: #2d83a3;
  color: #ffffff;
  border-color: #2d83a3;
}

/* Style 2 (Image 2 - Gradient Cyan/Blue Ticker) in Light Mode */
.katen-news-ticker--2 {
  background: linear-gradient(90deg, #2d85a5 0%, #359fc4 50%, #44b1d6 100%) !important;
  border: none !important;
  color: #ffffff !important;
  box-shadow: 0 6px 20px rgba(45, 133, 165, 0.28) !important;
}

.katen-news-ticker--2 .katen-news-ticker__label {
  background: rgba(14, 46, 64, 0.4) !important;
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
}

.katen-news-ticker--2 .katen-news-ticker__track a {
  color: #ffffff !important;
  font-weight: 600 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

.katen-news-ticker--2 .katen-news-ticker__track a:hover {
  color: #e0f2fe !important;
}

.katen-news-ticker--2 .katen-news-ticker__nav button {
  background: #142030 !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25) !important;
}

.katen-news-ticker--2 .katen-news-ticker__nav button:hover {
  background: #09101a !important;
  color: #38bdf8 !important;
  transform: scale(1.08) !important;
}

/* Dark Mode: Default Ticker */
body.dark .katen-news-ticker {
  background: #142130 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #f1f5f9 !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35) !important;
}

body.dark .katen-news-ticker .katen-news-ticker__label {
  background: linear-gradient(135deg, #2d85a5, #226781) !important;
  color: #ffffff !important;
}

body.dark .katen-news-ticker .katen-news-ticker__track a {
  color: #f1f5f9 !important;
}

body.dark .katen-news-ticker .katen-news-ticker__track a:hover {
  color: #38bdf8 !important;
}

body.dark .katen-news-ticker .katen-news-ticker__nav button {
  background: #1e2d3d !important;
  color: #e2e8f0 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

body.dark .katen-news-ticker .katen-news-ticker__nav button:hover {
  background: #38bdf8 !important;
  color: #0f172a !important;
}

/* Style 2 (Image 2 - Gradient Cyan/Blue Ticker) in Dark Mode */
body.dark .katen-news-ticker--2 {
  background: linear-gradient(90deg, #1b5b73 0%, #257898 50%, #2e8cae 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45) !important;
  color: #ffffff !important;
}

body.dark .katen-news-ticker--2 .katen-news-ticker__label {
  background: rgba(10, 25, 36, 0.55) !important;
  color: #ffffff !important;
}

body.dark .katen-news-ticker--2 .katen-news-ticker__track a {
  color: #ffffff !important;
  font-weight: 600 !important;
}

body.dark .katen-news-ticker--2 .katen-news-ticker__track a:hover {
  color: #7dd3fc !important;
}

body.dark .katen-news-ticker--2 .katen-news-ticker__nav button {
  background: #0f172a !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

body.dark .katen-news-ticker--2 .katen-news-ticker__nav button:hover {
  background: #1e2d3d !important;
  color: #38bdf8 !important;
  transform: scale(1.08) !important;
}

/* ==========================================================================
   4. Pure Print Mode ("Hanya Tulisan Saja dan Tidak Ada Apapun")
   ========================================================================== */
@media print {
  @page {
    margin: 15mm 18mm !important;
  }

  *, *::before, *::after {
    box-shadow: none !important;
    text-shadow: none !important;
  }

  html, body {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 11pt !important;
    line-height: 1.65 !important;
  }

  header,
  .header-default,
  .header-classic,
  .header-personal,
  .header-minimal,
  .header-default.clone,
  .header-personal nav.clone,
  .header-classic .header-bottom.clone,
  footer,
  footer.footer,
  .breadcrumbs,
  .sidebar,
  aside,
  .col-lg-4,
  .col-md-4,
  .post-header .meta,
  .post-header .thumb,
  .post-header figure,
  .katen-reading-toolbar,
  .reading-bar-wrapper,
  #katen-reading-progress,
  .katen-topbar-promo,
  .katen-zen-floating-bar,
  .katen-ad-wrapper,
  .katen-ad-slot,
  .adsbygoogle,
  .katen-nextprev-post,
  .nextprev-post,
  .comments-area,
  .comments,
  #comments,
  .comment-respond,
  .katen-inline-related,
  .katen-after-content,
  .katen-ticker,
  .katen-news-ticker,
  .katen-collaboration,
  .katen-author-boxes,
  .katen-community-box,
  .katen-community-article-box,
  .about-author,
  .tags,
  .post-bottom,
  .katen-share-open,
  .katen-share-dialog,
  .switcher-button,
  .canvas-menu,
  .search-popup,
  .main-overlay,
  .whatsapp-icon,
  .whatsapp-float,
  .back-to-top,
  .katen-skip-link,
  #wpadminbar,
  #preloader,
  .load-more {
    display: none !important;
  }

  .main-content {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }

  .main-content > .container-xl,
  .post-container {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }

  .main-content .row {
    display: block !important;
    margin: 0 !important;
  }

  .main-content .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .post-single {
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
  }

  .post-header {
    margin: 0 0 16pt 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .post-header .title {
    font-size: 24pt !important;
    font-weight: 800 !important;
    color: #000000 !important;
    line-height: 1.25 !important;
    margin: 0 0 14pt 0 !important;
    page-break-after: avoid;
    break-after: avoid;
  }

  .post-content {
    font-size: 11pt !important;
    line-height: 1.65 !important;
    color: #000000 !important;
    text-align: justify !important;
  }

  .post-content p {
    margin-bottom: 12pt !important;
    orphans: 3;
    widows: 3;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .post-content a {
    color: #000000 !important;
    text-decoration: underline !important;
  }

  .post-content img {
    max-width: 100% !important;
    height: auto !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .post-content h2,
  .post-content h3,
  .post-content h4 {
    color: #000000 !important;
    page-break-after: avoid;
    break-after: avoid;
    margin-top: 16pt !important;
    margin-bottom: 8pt !important;
  }
}

/* ==========================================================================
   Certificate Print Override Fix
   ========================================================================== */
@media print {
  body.katen-printing-cert {
    background: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body.katen-printing-cert * {
    visibility: hidden !important;
  }
  body.katen-printing-cert #katen-cert-modal,
  body.katen-printing-cert #katen-cert-modal *,
  body.katen-printing-cert .katen-cert-preview-card,
  body.katen-printing-cert .katen-cert-preview-card *,
  body.katen-printing-cert .kte-lms-certificate,
  body.katen-printing-cert .kte-lms-certificate *,
  body.katen-printing-cert .kte-cert-wrap,
  body.katen-printing-cert .kte-cert-wrap * {
    visibility: visible !important;
  }
  body.katen-printing-cert #katen-cert-modal {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: auto !important;
    background: #ffffff !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
    z-index: 9999999 !important;
  }
  body.katen-printing-cert #katen-cert-modal .katen-cert-modal-box {
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 100% !important;
    width: 100% !important;
  }
  body.katen-printing-cert .katen-cert-modal-actions,
  body.katen-printing-cert .katen-cert-modal-head {
    display: none !important;
  }
  body.katen-printing-cert .katen-cert-preview-card {
    display: block !important;
    box-shadow: none !important;
    border: 3px double #2d83a3 !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    margin: 0 auto !important;
  }
}

/* ==========================================================================
   Mobile Layout Optimization (Title, 16:9 Image & First Paragraph in First Viewport)
   ========================================================================== */
@media (max-width: 768px) {
  .post.post-single {
    padding-top: 8px !important;
  }

  .post-header {
    margin-bottom: 8px !important;
  }

  .post-header .title {
    font-size: 20px !important;
    line-height: 1.3 !important;
    margin-bottom: 6px !important;
  }

  .post-header .meta,
  .post-header .meta.list-inline,
  .katen-post-authors {
    font-size: 11px !important;
    gap: 6px !important;
    margin-bottom: 8px !important;
    line-height: 1.25 !important;
  }

  .katen-author-stack {
    width: 26px !important;
    height: 26px !important;
  }

  /* Single-line horizontal scroll reading toolbar */
  .katen-reading-toolbar {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin: 6px 0 12px 0 !important;
    padding: 5px 12px !important;
    gap: 8px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  .katen-reading-toolbar::-webkit-scrollbar {
    display: none;
  }

  .katen-reading-toolbar__left,
  .katen-reading-toolbar__right {
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
  }

  .katen-reading-time {
    font-size: 11px !important;
    white-space: nowrap !important;
    gap: 4px !important;
  }

  .katen-font-resizer {
    padding: 1px 3px !important;
  }

  .katen-font-btn {
    font-size: 10.5px !important;
    padding: 2px 6px !important;
  }

  .katen-toolbar-btn,
  .katen-tts-toggle-btn {
    font-size: 11px !important;
    padding: 4px 9px !important;
    gap: 4px !important;
    white-space: nowrap !important;
    border-radius: 999px !important;
  }

  .katen-toolbar-btn i,
  .katen-tts-toggle-btn i {
    font-size: 11px !important;
  }

  /* 16:9 compact mobile featured image to guarantee title + image + text screenshot */
  .post-single .featured-image,
  .post-single .thumb,
  .post-single figure.featured-image,
  .post-header .thumb {
    margin-bottom: 12px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    max-height: 200px !important;
    aspect-ratio: 16 / 9 !important;
    width: 100% !important;
  }

  .post-single .featured-image img,
  .post-single .thumb img,
  .post-header .thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 10px !important;
  }

  /* Opening paragraph visible in first viewport */
  .post-content > p:first-of-type {
    font-size: 14.5px !important;
    line-height: 1.55 !important;
    margin-bottom: 10px !important;
  }
}

/* ==========================================================================
   Integrated Community Box (Minimalist, Scrollable, Configurable)
   ========================================================================== */
.katen-community-box {
  margin: 24px 0;
  padding: 16px 18px;
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  border-radius: 14px;
  background: var(--katen-pro-surface, #f8fafc);
  color: var(--katen-pro-text, #1e293b);
  position: relative;
}

body.dark .katen-community-box {
  background: #1a2536;
  border-color: #2b3a4f;
  color: #f1f5f9;
}

.katen-community-box__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--katen-pro-border, #e2e8f0);
}

body.dark .katen-community-box__head {
  border-bottom-color: #2b3a4f;
}

.katen-community-box__title {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .02em;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--katen-pro-accent, #2d83a3);
}

.katen-community-box__desc {
  font-size: 11.5px;
  color: var(--katen-pro-muted, #64748b);
  margin: 0 0 12px;
  line-height: 1.4;
}

/* Scroll layout */
.katen-community-box--scroll .katen-community-grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  gap: 10px !important;
  padding-bottom: 6px;
  margin: 0;
  list-style: none;
  scrollbar-width: thin;
}

.katen-community-box--scroll .katen-community-grid::-webkit-scrollbar {
  height: 4px;
}
.katen-community-box--scroll .katen-community-grid::-webkit-scrollbar-thumb {
  background: var(--katen-pro-border, #cbd5e1);
  border-radius: 4px;
}

.katen-community-box--scroll .katen-community-card {
  flex: 0 0 155px !important;
  min-width: 140px;
  max-width: 170px;
  scroll-snap-align: start;
}

/* Compact layout */
.katen-community-box--compact .katen-community-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 8px;
}

/* Grid layout default */
.katen-community-box--grid .katen-community-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 12px;
}

/* Sleek Minimalist Community Card */
.katen-community-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 12px 10px;
  border: 1px solid var(--katen-pro-border, #e2e8f0);
  border-radius: 10px;
  background: var(--katen-pro-bg, #ffffff);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  position: relative;
  text-decoration: none !important;
}

body.dark .katen-community-card {
  background: #141c2a;
  border-color: #273549;
}

.katen-community-card:hover {
  transform: translateY(-2px);
  border-color: var(--katen-pro-accent, #2d83a3);
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
}

.katen-community-card__icon {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-bottom: 6px;
  font-size: 16px;
  color: #fff;
  flex-shrink: 0;
}

.katen-community-card__icon--whatsapp {
  background: #25d366;
}

.katen-community-card__icon--telegram {
  background: #0088cc;
}

.katen-community-card__icon--default {
  background: var(--katen-pro-accent, #2d83a3);
}

.katen-community-card__name {
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--katen-pro-text, #1e293b);
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

body.dark .katen-community-card__name {
  color: #f1f5f9;
}

.katen-community-card__meta {
  font-size: 10px;
  color: var(--katen-pro-muted, #64748b);
  margin-bottom: 8px;
}

.katen-community-card__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 600;
  color: #fff !important;
  background: var(--katen-pro-accent, #2d83a3);
  text-decoration: none !important;
  line-height: 1;
  transition: opacity .2s ease;
  width: 90%;
}

.katen-community-card__btn--whatsapp {
  background: #25d366;
}

.katen-community-card__btn--telegram {
  background: #0088cc;
}

.katen-community-card__btn:hover {
  opacity: .9;
  color: #fff !important;
}

/* ==========================================================================
   Header Layout Customizer Styles
   ========================================================================== */
.header--density-compact .navbar {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  min-height: 52px !important;
}
.header--density-compact .navbar-brand img {
  max-height: 28px !important;
  width: auto;
}

.header--density-spacious .navbar {
  padding-top: 22px !important;
  padding-bottom: 22px !important;
}

.header--nav-uppercase .navbar-nav .nav-link {
  text-transform: uppercase !important;
  font-size: 12.5px !important;
  letter-spacing: 0.05em !important;
}

.header--nav-bold .navbar-nav .nav-link {
  font-weight: 700 !important;
}

.header-cta-btn {
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  background: var(--katen-pro-accent, #2d83a3) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(45, 131, 163, .25) !important;
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease !important;
}

.header-cta-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(45, 131, 163, .35) !important;
  opacity: .95 !important;
  color: #fff !important;
}