/*!
 * theme.css - DevCard v2.1 custom styles, ported to Bootstrap 5.
 * Colour-neutral: accent is driven by --bs-primary / --bs-primary-rgb
 * (set per theme in static/vendor/css/theme-N.css).
 * GENERATED by scripts/build_theme.py from scripts/devcard-theme.src.css
 * — edit the source/script, not this file.
 */
/*!  
 * DevCard - Bootstrap 4 vCard and Portfolio Theme For Developers
 * Version: 2.1
 * Author: Xiaoying Riley
 * Copyright: 3rd Wave Media Ltd.
 * Website: http://themes.3rdwavemedia.com/
 * Twitter: @3rdwave_themes
*/body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#4f4f4f}
h1,h2,h3,h4,h5,h6{color:#292929;font-weight:bold}
a.theme-link{color:#292929;text-decoration:underline;-webkit-text-decoration-color:rgba(41,41,41,0.3);text-decoration-color:rgba(41,41,41,0.3)}
a.theme-link:hover{color:var(--bs-primary);-webkit-text-decoration-color:rgba(var(--bs-primary-rgb),0.8);text-decoration-color:rgba(var(--bs-primary-rgb),0.8)}
.single-col-max-width{max-width:820px}
hr{border-color:rgba(0,0,0,0.08)}
.btn{font-weight:bold;padding:.375rem 1rem;height:2.5rem;-webkit-transition:all 0.4s ease-in-out;transition:all 0.4s ease-in-out;font-size:1rem}
@media (prefers-reduced-motion: reduce){.btn{-webkit-transition:none;transition:none}
}
.btn:focus,.btn.focus{box-shadow:none !important}
.btn-primary{color:#fff}
.form-control{padding-top:0.875rem;padding-bottom:0.875rem;height:2.5rem;border-color:#c2c2c2}
.form-control::-webkit-input-placeholder{color:#8f8f8f}
.form-control:-moz-placeholder{color:#8f8f8f}
.form-control::-moz-placeholder{color:#8f8f8f}
.form-control:-ms-input-placeholder{color:#8f8f8f}
.error{color:#D9603C}
.form-group label.error{font-size:0.875rem;padding:0.5rem 0}
.form-group .btn{line-height:1}
.custom-select{border-color:#c2c2c2;height:2.5rem;color:#8f8f8f}
.theme-bg-light{background:#fafafa !important}
.theme-bg-dark{background:#223142 !important}
.table-bordered th,.table-bordered td{border-color:rgba(0,0,0,0.08)}
.header{position:fixed;left:0;top:0;height:100vh;width:280px;background:var(--bs-primary);color:#fff;overflow-y:auto;scrollbar-color:rgba(0,0,0,0.2) var(--bs-primary);scrollbar-width:thin}
.header::-webkit-scrollbar{width:6px;background-color:var(--bs-primary)}
.header::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,0.2);border-radius:.5rem}
.header .blog-name{font-weight:bold;font-size:1.5rem;color:#fff}
.header .blog-name a{color:#fff}
.header .blog-name a:hover{text-decoration:none}
.header .btn-primary{background:rgba(0,0,0,0.3);border-color:transparent;font-size:1rem}
.header .btn-primary:hover{background:rgba(0,0,0,0.4);border-color:transparent}
.header .navbar{padding:1.5rem 1rem}
.header .navbar-dark .navbar-toggler{border-radius:2px;-webkit-opacity:.8;-moz-opacity:.8;opacity:.8;border:1px solid rgba(255,255,255,0.8);padding:.25rem .6rem}
.header .navbar-dark .navbar-toggler:hover{-webkit-opacity:1;-moz-opacity:1;opacity:1}
.header .navbar-dark .navbar-toggler-icon{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(256,256,256, 1)' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E")}
.header .nav-item{font-weight:bold}
.header .nav-item.active .nav-link{color:rgba(0,0,0,0.5)}
.header .nav-item.active .nav-link:hover{text-decoration:none}
.header .nav-item .nav-link{color:rgba(255,255,255,0.8)}
.header .nav-item .nav-link:hover{color:rgba(0,0,0,0.6)}
.header .nav-item .nav-link[aria-expanded="true"]{color:rgba(0,0,0,0.5)}
.header .nav-item .dropdown-menu{position:static;background:color-mix(in srgb, var(--bs-primary), #000 8%);border:none;border-radius:0;padding:0;margin:0}
.header .nav-item .dropdown-menu .dropdown-item{color:#fff;padding:0.5rem;font-size:0.875rem;padding-left:2.25rem;font-weight:bold}
.header .nav-item .dropdown-menu .dropdown-item:hover,.header .nav-item .dropdown-menu .dropdown-item:active,.header .nav-item .dropdown-menu .dropdown-item:focus,.header .nav-item .dropdown-menu .dropdown-item.active{background:color-mix(in srgb, var(--bs-primary), #000 16%)}
.profile-section .profile-image{max-width:160px}
.profile-section .bio{font-size:0.875rem}
.profile-section .bio a{color:#fff;text-decoration:underline}
.profile-section .bio a:hover{color:rgba(0,0,0,0.6)}
.social-list a{width:32px;height:32px;padding-top:5px;display:inline-block;text-align:center;border-radius:50%;-webkit-transition:all 0.4s ease-in-out;transition:all 0.4s ease-in-out;background-color:#fff}
@media (prefers-reduced-motion: reduce){.social-list a{-webkit-transition:none;transition:none}
}
.social-list a:hover{color:color-mix(in srgb, var(--bs-primary), #000 16%);background-color:rgba(255,255,255,0.8)}
.main-wrapper{margin-left:280px;background:#fff}
.main-wrapper .container-single-col{max-width:820px}
.cta-section .heading{font-size:2rem;font-weight:bold}
.promo-section{margin-bottom:40px}
.promo-section .promo-image{max-width:320px}
.promo-section .promo-section-inner{background:var(--bs-primary)}
.footer.theme-bg-light{color:#828282}
.footer.theme-bg-light a{color:#828282}
.footer.theme-bg-light a:hover{color:#767676}
.footer.theme-bg-dark{color:rgba(255,255,255,0.7)}
.footer.theme-bg-dark a{color:rgba(255,255,255,0.7)}
.footer.theme-bg-dark a:hover{color:rgba(255,255,255,0.8)}
.dark-mode-toggle .toggle-name{color:#fff;font-size:0.875rem}
.dark-mode-toggle .toggle{display:none}
.dark-mode-toggle .toggle+.toggle-btn{outline:0;display:block;width:70px;height:30px;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:2px;-webkit-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;border:3px solid rgba(255,255,255,0.4);border-radius:16px}
@media (prefers-reduced-motion: reduce){.dark-mode-toggle .toggle+.toggle-btn{-webkit-transition:none;transition:none}
}
.dark-mode-toggle .toggle+.toggle-btn::-moz-selection{background:none}
.dark-mode-toggle .toggle+.toggle-btn::selection{background:none}
.dark-mode-toggle .toggle+.toggle-btn:after,.dark-mode-toggle .toggle+.toggle-btn:before{position:relative;display:block;content:"";width:50%;height:100%}
.dark-mode-toggle .toggle+.toggle-btn:after{left:0;-webkit-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;background:rgba(255,255,255,0.4);content:"";border-radius:16px}
@media (prefers-reduced-motion: reduce){.dark-mode-toggle .toggle+.toggle-btn:after{-webkit-transition:none;transition:none}
}
.dark-mode-toggle .toggle+.toggle-btn:before{display:none}
.dark-mode-toggle .toggle:checked+.toggle-btn{border:4px solid rgba(255,255,255,0.9);border:3px solid var(--bs-primary);background:rgba(0,0,0,0.2)}
.dark-mode-toggle .toggle:checked+.toggle-btn:after{left:50%;background:rgba(255,255,255,0.9);background:var(--bs-primary)}
.section-title{font-size:2rem;position:relative;padding-left:1.5rem}
.section-title:before{content:"";display:inline-block;width:5px;height:100%;background:var(--bs-primary);position:absolute;left:0;top:0}
.profile-teaser .name{font-size:3rem}
.profile-teaser .profile-image{max-width:400px}
.profile-teaser .tagline{font-size:1.5rem;font-weight:300}
.overview-section .item{margin-bottom:2rem}
.overview-section .item-desc{color:#4f4f4f;font-size:0.875rem}
.overview-section .item-icon{font-size:1.875rem;color:var(--bs-primary)}
.overview-section .item-icon .fa-angular{color:#CA3327}
.overview-section .item-icon .fa-js-square{color:#F1DE4F}
.overview-section .item-icon .fa-react{color:#62D4FA}
.overview-section .item-icon .fa-vuejs{color:#64B687}
.overview-section .item-icon .nodejs{color:#55AC63}
.overview-section .item-icon .fa-python{color:#456E9C}
.overview-section .item-icon .fa-php{color:#777BAF}
.overview-section .item-icon .fa-java{color:#2E68AB}
.overview-section .item-icon .fa-html5,.overview-section .item-icon .fa-html5-alt{color:#DE6E3C}
.overview-section .item-icon .fa-css3,.overview-section .item-icon .fa-css3-alt{color:#53A7DC}
.overview-section .item-icon .fa-sass{color:#BF6B97}
.overview-section .item-icon .fa-less{color:#324B7C}
.overview-section .item-icon .fa-gulp{color:#C9514E}
.overview-section .item-icon .fa-grunt{color:#EFAC42}
.overview-section .item-icon .fa-npm{color:#BB443E}
.overview-section .item-title{font-size:1rem}
.testimonial-carousel .item{padding:1.5rem;padding-left:3rem;border:1px solid rgba(0,0,0,0.025);background:#fafafa;height:100%;position:relative}
.testimonial-carousel .item:before{content:"";display:inline-block;position:absolute;left:0;top:0;width:0;height:0;border-style:solid;border-width:40px 40px 0 0;border-color:var(--bs-primary) transparent transparent transparent;-webkit-transform:rotate(360deg)}
.testimonial-carousel .source-profile img{max-width:60px}
.testimonial-carousel .fa-quote-left{position:absolute;left:0.35rem;top:0.3rem;color:#fff;font-size:0.75rem}
.testimonial-carousel .source-holder{position:relative;padding-left:76px;height:60px}
.testimonial-carousel .source-holder .source-profile{position:absolute;left:0;top:0}
.testimonial-carousel .source-holder .meta{padding-top:.5rem}
.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#292929}
.owl-theme .owl-nav.disabled+.owl-dots{margin-top:1rem}
.project-card{border-radius:0;background:#fafafa;border:1px solid rgba(0,0,0,0.025);position:relative;height:100%}
.project-card:hover .link-mask{visibility:visible;background:rgba(41,41,41,0.4)}
.project-card:hover .link-mask-text{display:block}
.project-card .card-img{border-radius:0}
.project-card .card-title{font-size:1.125rem}
.project-card .card-text{font-size:0.875rem}
.project-card .card-img-holder{max-height:200px;overflow:hidden;vertical-align:middle}
.project-card .link-mask{position:absolute;left:0;top:0;width:100%;height:100%;visibility:hidden;-webkit-transition:all 0.4s ease-in-out;transition:all 0.4s ease-in-out}
@media (prefers-reduced-motion: reduce){.project-card .link-mask{-webkit-transition:none;transition:none}
}
.project-card .link-mask .link-mask-link{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
.project-card .link-mask-text{position:absolute;left:0;top:0;width:100%;height:100%;text-align:center;vertical-align:middle;color:#fff;display:none}
.project-card .link-mask-text .btn{top:50%;margin-top:-20px;position:relative}
.blog-post-card{background:#fafafa;border:1px solid rgba(0,0,0,0.025);height:100%;border-radius:0}
.blog-post-card .card-title{font-size:1.125rem}
.blog-post-card .card-text,.blog-post-card .more-link{font-size:0.875rem}
.blog-post-card .card-footer{border-top:none;background:none;padding-top:0}
.filters{list-style:none;font-size:0.875rem}
.filters .type{display:inline-block;padding:0.275rem 0.25rem;cursor:pointer;margin-right:2rem;color:#8f8f8f;font-weight:bold}
.filters .type:last-child{margin-right:0}
.filters .type.active{border-top:2px solid var(--bs-primary);color:var(--bs-primary);font-weight:bold}
.filters .type.active:hover{border-top:2px solid var(--bs-primary)}
.filters .type:hover{color:#292929}
.project-meta{border:1px solid rgba(0,0,0,0.025);font-size:0.875rem}
.project-meta .client-name{font-size:1.5rem}
.project-meta .subheading{font-size:1rem}
.project-meta .client-meta{font-size:1rem}
.project-meta .client-meta i{color:#4f4f4f}
.metric .inner{border:1px solid rgba(0,0,0,0.025);height:100%}
.metric-desc{font-size:0.875rem;color:#8f8f8f}
.metric-name{color:var(--bs-primary);font-weight:bold}
.metric-data{font-weight:bold;font-size:2rem}
.metric-data .unit{font-size:1rem;color:#8f8f8f}
.client-quote{padding:1.5rem;padding-left:3rem;border:1px solid rgba(0,0,0,0.025);background:#fafafa;height:100%;position:relative}
.client-quote:before{content:"";display:inline-block;position:absolute;left:0;top:0;width:0;height:0;border-style:solid;border-width:40px 40px 0 0;border-color:var(--bs-primary) transparent transparent transparent;-webkit-transform:rotate(360deg)}
.client-quote .source-profile img{max-width:60px}
.client-quote .fa-quote-left{position:absolute;left:0.35rem;top:0.3rem;color:#fff;font-size:0.75rem}
.client-quote .source-holder{position:relative;padding-left:76px;height:60px}
.client-quote .source-holder .source-profile{position:absolute;left:0;top:0}
.client-quote .source-holder .meta{padding-top:.5rem}
.pricing-table .pricing-package-title{font-size:1rem;color:var(--bs-primary);background:#fafafa;text-align:center;padding:1rem}
.pricing-table .price-number{font-size:1.5rem;font-weight:bold}
.pricing-table .pricing-desc-row{vertical-align:inherit}
.pricing-table tbody th{background:#fafafa;padding:1rem;width:30%;font-size:0.875rem}
.pricing-table tbody td{padding:1rem;width:23.3333333%;text-align:center;font-size:0.875rem}
.pricing-table tbody td .pricing-package-desc{font-size:0.875rem;line-height:1}
.pricing-table .pricing-desc-row td{text-align:left;line-height:1.4}
.pricing-table tfoot td{padding:1rem;text-align:center}
.pricing-table .btn{height:inherit}
.pricing-tab{display:block;text-align:center;padding:0.5rem;width:100%;border-radius:4px;font-weight:bold;background:#e1e1e1;color:#4f4f4f}
.pricing-tab:hover{text-decoration:none;color:#4f4f4f}
.pricing-tab.active{background:var(--bs-primary);color:#fff}
.faq-accordion .card-toggle{color:#4f4f4f;text-decoration:none;display:block}
.faq-accordion .card-toggle:hover{color:#292929}
.faq-accordion .card-title{position:relative;padding-right:2rem;font-size:1rem}
.faq-accordion .card-title i{position:absolute;right:0;top:0}
.faq-accordion .card-body{font-size:0.875rem}
.resume-wrapper{border:1px solid rgba(0,0,0,0.025)}
.resume-section-heading{position:relative;padding-left:1rem;font-size:1.125rem;letter-spacing:0.15rem;color:var(--bs-primary)}
.resume-section-heading:before{content:"";display:inline-block;width:5px;height:100%;background:var(--bs-primary);position:absolute;left:0;top:0}
.resume-name{font-size:2.75rem;font-weight:900;letter-spacing:0.4rem;color:var(--bs-primary)}
.resume-tagline{font-size:1.25rem;font-weight:300}
.resume-contact{border-left:1px solid rgba(0,0,0,0.08);font-size:0.75rem}
a.resume-link{color:#4f4f4f}
a.resume-link:hover{color:var(--bs-primary)}
.resume-profile-image{max-width:120px}
.resume-intro{font-size:0.875rem}
.resume-main .item-title{font-size:1rem}
.resume-main .item-meta{font-size:0.75rem}
.resume-main .item-content{font-size:0.875rem}
.resume-aside{border-left:1px solid rgba(0,0,0,0.08)}
.resume-aside .item{font-size:0.875rem}
.resume-aside .item-title{font-size:1rem}
.resume-education-list,.resume-awards-list{font-size:0.875rem}
.resume-degree-time-org,.resume-degree-time{font-size:0.75rem}
.resume-lang-list,.resume-interests-list{font-size:0.875rem}
.resume-social-list{font-size:0.75rem}
.blog-list .item .title{font-size:1.275rem}
.blog-list .item .title a{color:#292929}
.blog-list .item .title a:hover{color:#292929}
.blog-list .item .post-thumb{max-width:110px;border-radius:2px}
.blog-list .item .intro{font-size:0.875rem}
.blog-list .item .more-link{font-size:0.8125rem}
.meta{color:#8f8f8f;font-size:0.8125rem}
.meta span{display:inline-block}
.meta span a{color:#8f8f8f}
.meta span a:hover{color:#4f4f4f}
.meta span:after{content:"";display:inline-block;width:3px;height:3px;border-radius:50%;background:#8f8f8f;margin-left:0.5rem;margin-right:0.5rem;position:relative;top:-3px}
.meta span:last-child:after{display:none}
.blog-nav .nav-link{background:var(--bs-primary);color:#fff;font-size:1rem;padding:1rem;font-weight:bold;position:relative}
.blog-nav .nav-link:hover{background:color-mix(in srgb, var(--bs-primary), #000 16%)}
.blog-nav .nav-link-prev{border-right:1px solid color-mix(in srgb, var(--bs-primary), #000 32%)}
.blog-nav .arrow-prev{position:absolute;left:1rem;top:1.25rem;color:#fff}
.blog-nav .arrow-next{position:absolute;right:1rem;top:1.25rem;color:#fff}
.blog-post .title{font-weight:bold;font-size:2rem}
.blog-post .blog-post-body p,.blog-post .blog-post-body li{font-size:1.125rem;line-height:1.6}
.blog-post .blog-post-body h1{font-size:2.125rem}
.blog-post .blog-post-body h2{font-size:2rem}
.blog-post .blog-post-body h3{font-size:1.75rem}
.blog-post .blog-post-body h4{font-size:1.5rem}
.blog-post .blog-post-body h5{font-size:1.25rem}
.blog-post .blog-post-body h6{font-size:1.125rem}
.blog-post .image-caption{color:#8f8f8f;font-size:0.875rem}
.blog-post .image-caption a{color:#8f8f8f;text-decoration:underline}
.blog-post .image-caption a:hover{color:#4f4f4f}
.blog-post .blockquote{font-family:Georgia,"Times New Roman",Times,serif;border-left:2px solid #292929;font-size:1.5rem}
.blog-post .blockquote p{font-size:1.5rem}
@media (min-width: 768px){.theme-btn-cta{width:inherit;display:inline-block}
.cta-section .form-inline .form-control{width:360px}
.project-thumb{max-width:200px}
.pricing-table td,.pricing-table th{display:table-cell !important}
}
@media (min-width: 992px){.profile-teaser .profile-image{max-width:250px}
.project-thumb{max-width:200px}
}
@media (min-width: 1200px){.profile-teaser .profile-image{max-width:400px}
.project-thumb{max-width:300px}
}
@media (max-width: 991.98px){.header{position:static;width:inherit;height:auto}
.header .blog-name{width:100%;position:absolute;left:0;top:1.2rem}
.header .btn-primary{width:100%}
.header .navbar{padding:1rem}
.main-wrapper{margin-left:0}
.resume-aside{border-left:0}
}
@media (max-width: 767.98px){.signup-form .form-group{width:100%;margin-bottom:0.5rem}
.signup-form .form-control{width:100%}
.signup-form .btn-primary{width:100%}
.profile-teaser .profile-image{max-width:100%}
.header .nav-item .dropdown-menu .dropdown-item{padding-left:1.875rem}
.resume-contact{border-left:0}
.mobile-is-hidden{display:none}
}
@media (max-width: 575.98px){.header .nav-item .dropdown-menu .dropdown-item{padding-left:1.875rem}
.link-mask{display:none !important}
.mobile-is-hidden{display:none}
}
body.dark-mode{background:#151e29}
body.dark-mode .theme-bg-light{background:#151e29 !important}
body.dark-mode h1,body.dark-mode h2,body.dark-mode h3,body.dark-mode h4,body.dark-mode h5,body.dark-mode h6{color:rgba(255,255,255,0.95)}
body.dark-mode hr{border-color:rgba(255,255,255,0.08)}
body.dark-mode .meta{color:rgba(255,255,255,0.4)}
body.dark-mode .blockquote-footer{color:rgba(255,255,255,0.4)}
body.dark-mode .text-muted{color:rgba(255,255,255,0.4) !important}
body.dark-mode .copyright{color:rgba(255,255,255,0.4)}
body.dark-mode a.theme-link{color:rgba(255,255,255,0.95);-webkit-text-decoration-color:rgba(255,255,255,0.4);text-decoration-color:rgba(255,255,255,0.4)}
body.dark-mode a.theme-link:hover{color:var(--bs-primary);-webkit-text-decoration-color:var(--bs-primary);text-decoration-color:var(--bs-primary)}
body.dark-mode .btn-secondary{background:#2f435c;border-color:#2f435c}
body.dark-mode .btn-secondary:hover{background:#384f6c;border-color:#384f6c}
body.dark-mode .table{color:rgba(255,255,255,0.7)}
body.dark-mode .table td,body.dark-mode .table th{border-color:rgba(255,255,255,0.05)}
body.dark-mode .table thead th{border-color:rgba(255,255,255,0.05)}
body.dark-mode .table-bordered td,body.dark-mode .table-bordered th{border:1px solid rgba(255,255,255,0.05)}
body.dark-mode .table-striped tbody tr:nth-of-type(odd){background:rgba(0,0,0,0.15)}
body.dark-mode .header{background:#1e2a3a;scrollbar-color:rgba(255,255,255,0.05) #1e2a3a}
body.dark-mode .header::-webkit-scrollbar{background:#1e2a3a}
body.dark-mode .header::-webkit-scrollbar-thumb{background-color:rgba(255,255,255,0.05);border-radius:.5rem}
body.dark-mode .header .nav-item.active .nav-link{color:var(--bs-primary)}
body.dark-mode .header .nav-item.active .nav-link:hover{color:var(--bs-primary)}
body.dark-mode .header .nav-item .nav-link{color:rgba(255,255,255,0.7)}
body.dark-mode .header .nav-item .nav-link:hover{color:#fff}
body.dark-mode .header .nav-item .dropdown-menu{background:rgba(0,0,0,0.1)}
body.dark-mode .header .nav-item .dropdown-menu .dropdown-item:hover,body.dark-mode .header .nav-item .dropdown-menu .dropdown-item:focus,body.dark-mode .header .nav-item .dropdown-menu .dropdown-item:active{background:rgba(0,0,0,0.2)}
body.dark-mode .header .nav-item .dropdown-menu .dropdown-item.active{color:var(--bs-primary);background:rgba(0,0,0,0.2)}
body.dark-mode .header .btn-primary{background:var(--bs-primary)}
body.dark-mode .social-list a{background:var(--bs-primary)}
body.dark-mode .social-list a i{color:#fff}
body.dark-mode .main-wrapper{background:#111821;color:rgba(255,255,255,0.7)}
body.dark-mode .main-wrapper>.cta-section{border-bottom:1px solid rgba(255,255,255,0.05);background:none !important}
body.dark-mode .about-me-section{border-bottom:1px solid rgba(255,255,255,0.05);background:none !important}
body.dark-mode .overview-section .item-desc{color:rgba(255,255,255,0.7)}
body.dark-mode .testimonial-carousel .item{background:#151e29}
body.dark-mode .project-card{background:#151e29;border:none}
body.dark-mode .project-card:hover .link-mask{background:rgba(0,0,0,0.5)}
body.dark-mode .blog-post-card{background:#151e29;border:none}
body.dark-mode .blog-post .blockquote{border-color:var(--bs-primary)}
body.dark-mode .filters .type{color:rgba(255,255,255,0.4)}
body.dark-mode .filters .type.active{color:var(--bs-primary)}
body.dark-mode .filters .type.active:hover{color:var(--bs-primary)}
body.dark-mode .filters .type:hover{color:rgba(255,255,255,0.7)}
body.dark-mode .pricing-table{background:#151e29}
body.dark-mode .pricing-table tbody th{background:#151e29}
body.dark-mode .pricing-table .pricing-package-title{background:#151e29}
body.dark-mode .faq-accordion .card-toggle{color:rgba(255,255,255,0.7)}
body.dark-mode .faq-accordion .card-toggle:hover{color:rgba(255,255,255,0.95)}
body.dark-mode .faq-accordion .card-toggle[aria-expanded="true"]{color:rgba(255,255,255,0.95)}
body.dark-mode a.resume-link{color:rgba(255,255,255,0.7)}
body.dark-mode .project-meta .client-meta i{color:rgba(255,255,255,0.95)}
body.dark-mode .metric-data{color:rgba(255,255,255,0.95)}
body.dark-mode .metric-data .unit{color:rgba(255,255,255,0.4)}
body.dark-mode .metric-desc{color:rgba(255,255,255,0.7)}
body.dark-mode .client-quote{background:#151e29}
body.dark-mode .blog-list .item .title a{color:rgba(255,255,255,0.95)}
body.dark-mode .owl-theme .owl-dots .owl-dot span{background:rgba(255,255,255,0.4)}
body.dark-mode .owl-theme .owl-dots .owl-dot.active span,body.dark-mode .owl-theme .owl-dots .owl-dot:hover span{background:rgba(255,255,255,0.95)}
body{overflow-x:hidden}
.config-trigger{position:absolute;top:30px;left:-36px;width:36px;height:36px;background:#223142;color:#fff;text-align:center;border-radius:4px;border-top-right-radius:0;border-bottom-right-radius:0;text-decoration:none}
.config-trigger:hover{background:#111820;text-decoration:none}
.config-trigger:hover .fa-cog{color:#fff}
.config-trigger .fa-cog{font-size:1.25rem;display:block;color:#fff}
.dark-mode .config-trigger{background:#000}
.config-panel{position:absolute;top:50px;right:-190px;z-index:30;width:190px}
.config-panel .panel-inner{position:relative;background:#223142;color:#fff;padding:15px;border-top-left-radius:4px;border-top-right-radius:4px;border-top-right-radius:0;border-bottom-right-radius:0}
.dark-mode .config-panel .panel-inner{background:#000}
.config-panel .panel-title{font-weight:600;margin-bottom:10px;font-size:14px;text-transform:uppercase;color:#fff}
.config-panel label{color:#fff}
.config-panel #color-options{margin-bottom:0px}
.config-panel #color-options li a{display:block;width:20px;height:20px;border:2px solid transparent;margin-top:5px}
.config-panel #color-options li a:hover{-webkit-opacity:.9;-moz-opacity:.9;opacity:.9;border:2px solid rgba(255,255,255,0.9)}
.config-panel #color-options li.list-inline-item{margin-right:5px}
.config-panel #color-options li.active a{border:2px solid #fff}
.config-panel #color-options li.theme-1 a{background:#54B689}
.config-panel #color-options li.theme-2 a{background-color:#5BC3D5}
.config-panel #color-options li.theme-3 a{background-color:#3B7EEB}
.config-panel #color-options li.theme-4 a{background-color:#5ECCA9}
.config-panel #color-options li.theme-5 a{background-color:#EEA73B}
.config-panel #color-options li.theme-6 a{background-color:#5469C9}
.config-panel #color-options li.theme-7 a{background-color:#5D6BA7}
.config-panel #color-options li.theme-8 a{background-color:#6C51A4}
.config-panel #color-options li.theme-9 a{background-color:#D67553}
.config-panel #color-options li.theme-10 a{background-color:#5FCB71}
.config-panel .close{position:absolute;right:5px;top:5px;color:#fff}
.config-panel .close .fa{color:#fff}

/* ---- Bootstrap 5 bridge (re-points component vars at --bs-primary) ---- */
:root{--bs-link-color-rgb:var(--bs-primary-rgb);--bs-link-hover-color-rgb:var(--bs-primary-rgb)}
/* Typography: Inter for UI/headings/body, JetBrains Mono for code, Lora (serif)
   scoped to blog article body. Fonts are self-hosted (static/css/fonts.css). */
:root{--bs-font-sans-serif:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:"JetBrains Mono",SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-font-serif:"Lora",Georgia,Cambria,"Times New Roman",Times,serif}
/* Blog article body in serif; keep its headings in the sans (Inter). Blog list
   cards use .blog-post-card (a different class) and stay sans. code/pre keep mono. */
.blog-post{font-family:var(--bs-font-serif)}
.blog-post :is(h1,h2,h3,h4,h5,h6){font-family:var(--bs-font-sans-serif)}
/* Bootstrap 5 underlines links by default; Bootstrap 4 did not. .theme-link keeps
   its own underline via higher specificity. */
a{text-decoration:none}
/* Restore Bootstrap 4 card padding (1.25rem) and title spacing (.75rem); BS5
   defaults are tighter (1rem / .5rem). */
.card{--bs-card-spacer-y:1.25rem;--bs-card-spacer-x:1.25rem;--bs-card-title-spacer-y:.75rem}
.btn-primary{--bs-btn-bg:var(--bs-primary);--bs-btn-border-color:var(--bs-primary);--bs-btn-hover-bg:color-mix(in srgb,var(--bs-primary),#000 8%);--bs-btn-hover-border-color:color-mix(in srgb,var(--bs-primary),#000 10%);--bs-btn-active-bg:color-mix(in srgb,var(--bs-primary),#000 16%);--bs-btn-active-border-color:color-mix(in srgb,var(--bs-primary),#000 20%);--bs-btn-disabled-bg:var(--bs-primary);--bs-btn-disabled-border-color:var(--bs-primary)}
.btn-outline-primary{--bs-btn-color:var(--bs-primary);--bs-btn-border-color:var(--bs-primary);--bs-btn-hover-bg:var(--bs-primary);--bs-btn-hover-border-color:var(--bs-primary);--bs-btn-active-bg:var(--bs-primary);--bs-btn-active-border-color:var(--bs-primary);--bs-btn-disabled-color:var(--bs-primary);--bs-btn-disabled-border-color:var(--bs-primary)}
.btn-secondary{--bs-btn-bg:#4f4f4f;--bs-btn-border-color:#4f4f4f;--bs-btn-hover-bg:#3f3f3f;--bs-btn-hover-border-color:#3a3a3a;--bs-btn-active-bg:#3a3a3a;--bs-btn-active-border-color:#353535;--bs-btn-disabled-bg:#4f4f4f;--bs-btn-disabled-border-color:#4f4f4f}
.pagination{--bs-pagination-color:var(--bs-primary);--bs-pagination-hover-color:color-mix(in srgb,var(--bs-primary),#000 16%);--bs-pagination-focus-color:color-mix(in srgb,var(--bs-primary),#000 16%);--bs-pagination-active-bg:var(--bs-primary);--bs-pagination-active-border-color:var(--bs-primary);--bs-pagination-focus-box-shadow:0 0 0 .25rem rgba(var(--bs-primary-rgb),.25)}
.form-control:focus,.form-select:focus{border-color:color-mix(in srgb,var(--bs-primary),#fff 50%);box-shadow:0 0 0 .25rem rgba(var(--bs-primary-rgb),.25)}
.form-check-input:checked{background-color:var(--bs-primary);border-color:var(--bs-primary)}
.form-check-input:focus{border-color:color-mix(in srgb,var(--bs-primary),#fff 50%);box-shadow:0 0 0 .25rem rgba(var(--bs-primary-rgb),.25)}
/* Style switcher panel: CSS-driven slide (vanilla switcher toggles .config-panel-open). */
.config-panel{transition:right .4s ease-in-out}
.config-panel.config-panel-open{right:0}
/* FAQ accordion chevron flip, driven by Bootstrap's .collapsed class (no JS). */
.card-toggle .fa-chevron-down{transition:transform .2s ease-in-out}
.card-toggle:not(.collapsed) .fa-chevron-down{transform:rotate(180deg)}
