/* Article layout from UI's blog detail template, with the site's original content. */
#page #main.blog-detail-template{padding:0;margin:0;background:#fff;color:var(--brand-ink);font:400 14px/1.6 'ZP Poppins',Poppins,sans-serif}
.blog-detail-template *{box-sizing:border-box}
#main.blog-detail-template [hidden]{display:none!important}
#main.blog-detail-template .bd-container{width:100%;max-width:1280px;margin:0 auto;padding:0 24px}
#main.blog-detail-template .bd-heading{margin:0;padding:40px 0 48px;background:var(--brand-surface)}
#main.blog-detail-template .bd-heading.bd-with-cover{padding-bottom:136px}
.bd-breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:18px;color:var(--brand-muted);font-size:13px}.bd-breadcrumbs a{color:inherit;text-decoration:none}.bd-breadcrumbs [aria-current]{color:var(--brand-ink)}
.bd-metadata{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px;color:var(--brand-muted);font-size:13px}
.bd-badge{padding:6px 14px;border:1px solid rgba(var(--brand-accent-rgb),0.349);border-radius:999px;background:var(--brand-accent-soft);color:var(--brand-accent);font-size:11.5px;font-weight:500;letter-spacing:.3px;text-transform:uppercase}
#main.blog-detail-template .bd-heading h1{max-width:1120px;margin:0 0 14px;padding:0;color:var(--brand-ink);font:600 clamp(30px,5vw,52px)/1.25 'ZP Poppins',Poppins,sans-serif;letter-spacing:normal;text-align:left;overflow-wrap:anywhere}
#main.blog-detail-template .bd-intro{max-width:1040px;margin:0;padding:0;color:rgba(var(--brand-ink-rgb),0.800);font-size:16px;line-height:1.65;text-align:left}
#main.blog-detail-template .bd-cover{position:relative;z-index:1;margin-top:-104px;margin-bottom:48px}
.bd-cover>div{aspect-ratio:16/9;overflow:hidden;border-radius:16px;background:#f0f1f3}.bd-cover img{display:block;width:100%;height:100%;margin:0;object-fit:cover}
#main.blog-detail-template .bd-reading-layout{display:grid;grid-template-columns:200px minmax(0,1fr);align-items:start;gap:48px;max-width:1040px;padding-top:40px;padding-bottom:80px}
#main.blog-detail-template .bd-cover+.bd-reading-layout{padding-top:0}
.bd-reading-column{min-width:0;max-width:680px}
.bd-sidebar{position:sticky;top:calc(var(--zp-header-height,129px) + 24px);min-width:0}
.bd-contents summary,.bd-sidebar-label{color:var(--brand-muted);font-size:11.5px;font-weight:600;letter-spacing:1px;text-transform:uppercase}
.bd-contents summary{display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;list-style:none}.bd-contents summary::-webkit-details-marker{display:none}.bd-contents[open]>summary svg{transform:rotate(180deg)}
#bd-toc{display:grid;gap:5px;max-height:40dvh;overflow-y:auto;margin-top:14px;padding-right:4px;scrollbar-width:thin}
#bd-toc a{display:block;padding:6px 8px;border-left:2px solid transparent;color:var(--brand-muted);font-size:12px;line-height:1.6;text-decoration:none;overflow-wrap:anywhere}
#bd-toc a:hover,#bd-toc a[aria-current]{border-color:var(--brand-accent);background:var(--brand-surface);color:var(--brand-accent-strong)}
#bd-toc .bd-toc-child{padding-left:18px;font-size:11px}
.bd-share{margin-top:20px;padding-top:16px;border-top:1px solid var(--brand-border)}.bd-share-actions{display:flex;gap:8px;margin-top:10px}
#main.blog-detail-template .bd-share-actions :is(a,button){display:flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;margin:0;padding:0;border:1px solid var(--brand-border);border-radius:50%;background:#fff!important;color:var(--brand-ink);box-shadow:none;cursor:pointer}
#main.blog-detail-template .bd-share-actions :is(a,button):hover{border-color:var(--brand-accent);color:var(--brand-accent)}.bd-share-actions svg{width:16px;height:16px}
#bd-copy-status{display:block;margin-top:8px;color:#006124;font-size:11px;line-height:1.5}#bd-copy-status:empty{display:none}
#main.blog-detail-template .bd-prose{color:rgba(var(--brand-ink-rgb),0.800);font:400 16px/1.75 'ZP Poppins',Poppins,sans-serif;overflow-wrap:anywhere;overflow-x:auto}
#main.blog-detail-template .bd-prose>:first-child{margin-top:0}
#main.blog-detail-template .bd-prose :is(p,ul,ol,figure,pre,table,blockquote,dl){margin-bottom:20px}
#main.blog-detail-template .bd-prose :is(h1,h2,h3,h4,h5,h6){margin:32px 0 16px;color:var(--brand-ink);font-weight:600;line-height:1.4;letter-spacing:normal;scroll-margin-top:calc(var(--zp-header-height,129px) + 24px)}
#main.blog-detail-template .bd-prose h1{font-size:30px}#main.blog-detail-template .bd-prose h2{font-size:26px}#main.blog-detail-template .bd-prose h3{font-size:22px}
#main.blog-detail-template .bd-prose a{color:var(--brand-accent-strong);text-underline-offset:3px}#main.blog-detail-template .bd-prose :is(ul,ol){padding-left:24px}
#main.blog-detail-template .bd-prose blockquote{padding:20px 24px;border-left:3px solid var(--brand-accent);border-radius:0 10px 10px 0;background:var(--brand-surface);color:rgba(var(--brand-ink-rgb),0.800)}
#main.blog-detail-template .bd-prose :is(img,video){max-width:100%;height:auto;border-radius:12px}#main.blog-detail-template .bd-prose iframe{display:block;width:100%;max-width:100%;height:auto;min-height:200px;aspect-ratio:16/9;border:0;border-radius:12px}
#main.blog-detail-template .bd-prose table{max-width:100%;border-collapse:collapse;font-size:14px}#main.blog-detail-template .bd-prose :is(td,th){padding:10px 14px;border-color:var(--brand-border)}#main.blog-detail-template .bd-prose th{background:var(--brand-accent-soft)}
#main.blog-detail-template .bd-prose :is(code,pre){background:#f5f5f5;color:var(--brand-ink)}#main.blog-detail-template .bd-prose pre{padding:20px;border-radius:10px}#main.blog-detail-template .bd-prose pre code{background:transparent}
.bd-tags{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}.bd-tags a{padding:5px 10px;border:1px solid var(--brand-border);border-radius:6px;background:#f0f1f3;color:#5b5f66;font-size:11px;text-decoration:none}.bd-tags a:hover{border-color:var(--brand-accent);color:var(--brand-accent-strong)}
#main.blog-detail-template .bd-question{margin:36px 0 0!important;padding:28px 30px;border-radius:16px;background:var(--brand-primary);color:#fff}
#main.blog-detail-template .bd-question h2{margin:0 0 6px;color:#fff;font-size:15px;font-weight:500;line-height:1.5}
#main.blog-detail-template .bd-question p{margin:0 0 16px;color:#ffffffb3;font-size:13.5px;line-height:1.65}
.bd-question>div{display:flex;flex-wrap:wrap;gap:10px}
#main.blog-detail-template .bd-question a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 20px;border:1px solid #ffffff40;border-radius:10px;color:var(--brand-gold-light);font-size:13px;font-weight:500;text-decoration:none}
#main.blog-detail-template .bd-question .bd-whatsapp{flex:1;border-color:#25d366;background:#25d366;color:#fff}#main.blog-detail-template .bd-whatsapp:hover{background:#1ebe59;border-color:#1ebe59}.bd-whatsapp svg{flex-shrink:0;width:16px;height:16px}
.bd-author{display:flex;align-items:center;gap:14px;margin-top:40px;padding-top:24px;border-top:1px solid var(--brand-border)}.bd-author img{display:block;flex:0 0 72px;width:72px;height:48px;object-fit:contain}.bd-author strong{display:block;color:var(--brand-ink);font-size:14px;font-weight:500}.bd-author span{display:block;margin-top:4px;color:var(--brand-muted);font-size:12px}
.bd-article-end{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;padding-top:24px;border-top:1px solid var(--brand-border)}.bd-article-end a{color:var(--brand-accent-strong);font-size:12px;text-decoration:none}
#main.blog-detail-template .bd-related{margin:0!important;padding:76px 0;background:var(--brand-surface)}
.bd-related-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:36px}.bd-eyebrow{display:block;margin-bottom:12px;color:var(--brand-accent);font-size:12px;letter-spacing:1.2px;text-transform:uppercase}
#main.blog-detail-template .bd-related-heading h2{margin:0;padding:0;color:var(--brand-ink);font:600 clamp(28px,4.4vw,42px)/1.25 'ZP Poppins',Poppins,sans-serif}.bd-related-heading>a{flex-shrink:0;padding:12px 18px;border:1px solid var(--brand-accent);border-radius:10px;color:var(--brand-accent);font-size:13px;text-decoration:none}
#main.blog-detail-template .bd-missing{padding-top:72px;padding-bottom:80px}#main.blog-detail-template .bd-missing h1{margin:0 0 16px;color:var(--brand-ink);font-size:36px}#main.blog-detail-template .bd-missing p{margin-bottom:24px;color:var(--brand-muted)}.bd-button{display:inline-flex;padding:12px 20px;border-radius:8px;background:var(--brand-accent);color:#fff;text-decoration:none;font-size:13px}
#main.blog-detail-template :is(a,button,summary):focus-visible{outline:2px solid var(--brand-accent);outline-offset:3px}
@media(max-width:1023px){#main.blog-detail-template .bd-reading-layout{grid-template-columns:170px minmax(0,1fr);gap:32px}.bd-sidebar{top:calc(var(--zp-header-height,82px) + 24px)}}
@media(max-width:767px){#main.blog-detail-template .bd-heading{padding-top:28px}#main.blog-detail-template .bd-heading.bd-with-cover{padding-bottom:88px}#main.blog-detail-template .bd-heading h1{font-size:clamp(28px,6vw,38px)}.bd-metadata{gap:8px;font-size:11px}.bd-badge{padding:5px 10px;font-size:10px}#main.blog-detail-template .bd-intro{font-size:14px}#main.blog-detail-template .bd-cover{margin-top:-56px;margin-bottom:20px}.bd-cover>div{border-radius:12px}#main.blog-detail-template .bd-reading-layout{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:20px;padding-bottom:48px}.bd-sidebar{position:static;display:flex;flex-direction:column;gap:20px}.bd-contents{order:1;padding:14px;border:1px solid var(--brand-border);border-radius:10px}.bd-share{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0;padding:0;border:0}.bd-share-actions{margin:0}#bd-copy-status{width:100%;margin:0}.bd-reading-column{max-width:none}#main.blog-detail-template .bd-prose{font-size:15px;line-height:1.8}#main.blog-detail-template .bd-prose h2{font-size:23px}#main.blog-detail-template .bd-prose h3{font-size:20px}#main.blog-detail-template .bd-question{padding:24px}#main.blog-detail-template .bd-related{padding:48px 0}.bd-related-heading{flex-wrap:wrap;gap:18px;margin-bottom:28px}.bd-related-heading>a{font-size:12px}.bd-article-end{flex-wrap:wrap}.bd-author{margin-top:28px}}