/* Portfolio 2026 visual & accessibility refinements (loaded after the original theme). */
:root{--portfolio-radius:18px;--portfolio-border:rgba(204,236,220,.16)}
.section.sec6{display:none;transform:translateY(0) scale(1)}
.section.sec6.active{display:block}
body{overflow-x:hidden}
body p{text-align:left}
#home .right-header p{line-height:1.85}
#home .right-header .name{line-height:1.16}
#home .right-header .btn-con{margin-top:8px}
a:focus-visible,button:focus-visible{outline:3px solid var(--color-secondary);outline-offset:4px}
.controlls{gap:0;right:2.4%;align-items:center}
.controlls .control{border:0;color:inherit;position:relative;flex-shrink:0;font:inherit;isolation:isolate}
.controlls .control .nav-label{position:absolute;right:calc(100% + 13px);top:50%;transform:translate(10px,-50%);white-space:nowrap;pointer-events:none;opacity:0;border-radius:8px;padding:10px 14px;background:var(--color-grey-5);border:1px solid var(--portfolio-border);color:var(--color-white);font-size:.78rem;font-weight:700;box-shadow:0 5px 16px #0005;transition:opacity .18s,transform .18s;z-index:21}
.controlls .control:hover .nav-label,.controlls .control:focus-visible .nav-label,.controlls .control:focus-within .nav-label{opacity:1;transform:translate(0,-50%)}
.controlls .control:hover{background-color:var(--color-secondary);color:var(--color-white)}
.controlls .control:hover i{color:var(--color-white)}
.theme-btn{border:0;z-index:11}
.theme-btn:focus-visible{outline:3px solid var(--color-secondary)}
.about-container .left-about p{line-height:1.88}
.skills-intro{text-align:center!important;max-width:740px;margin:-1rem auto 2rem;color:var(--color-grey-2);font-size:.9rem}
.skill-collections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:4rem}
.skill-category{border:1px solid var(--portfolio-border);background:var(--color-grey-5);border-radius:var(--portfolio-radius);padding:25px;min-width:0}
.skill-heading{display:flex;gap:13px;align-items:center;margin-bottom:17px}.skill-heading i{font-size:1.1rem;color:var(--color-secondary)}.skill-heading h5{font-size:1.04rem;margin:0}
.skill-chips{display:flex;flex-wrap:wrap;gap:9px;padding:0;margin:0}.skill-chips li{list-style:none;border:1px solid var(--portfolio-border);background:var(--color-primary);border-radius:50px;padding:6px 12px;font-size:.75rem;line-height:1.5;color:var(--color-grey-1)}
.timeline .timeline-item{min-width:0}.timeline .timeline-item h5{font-size:1.21rem;line-height:1.5}.timeline .timeline-item h5 span{font-size:.88rem;line-height:1.65}.timeline .timeline-item p:not(.tl-duration){font-size:.88rem;line-height:1.8}
.services-section .main-services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px;margin-top:3.2rem}
.main-service-card{min-height:266px;display:flex;flex-direction:column;padding:25px;border-radius:var(--portfolio-radius);background:var(--color-grey-5);border:1px solid var(--portfolio-border);transition:transform .2s,border-color .2s,box-shadow .2s}
.main-service-card:hover{transform:translateY(-4px);border-color:var(--color-secondary);box-shadow:0 17px 24px #0003}.service-card-icon{width:50px;height:50px;display:grid;place-items:center;background:rgba(39,174,96,.16);color:var(--color-secondary);border-radius:13px;margin-bottom:16px;font-size:1.3rem}.main-service-card h3{font-size:1.02rem;line-height:1.5;margin:0 0 12px}.main-service-card p{font-size:.78rem;color:var(--color-grey-2);line-height:1.9;margin-bottom:18px}.main-service-card>span{margin-top:auto;color:var(--color-secondary);font-size:.78rem;font-weight:700}.main-service-card>span i{padding-left:8px}.service-bottom{display:flex;justify-content:center;margin:42px 0 100px}
.blogs{align-items:stretch}.blogs .blog{border-radius:var(--portfolio-radius);overflow:hidden;border:1px solid var(--portfolio-border);display:flex;flex-direction:column;box-shadow:none;min-width:0}.blogs .blog .blog-art{height:180px;width:100%;display:grid;place-items:center;background:radial-gradient(circle at 60% 32%,#2c6658,#20293b 70%);position:relative;overflow:hidden}.blog-art>i{font-size:3.6rem;color:#61db9b}.blogs .blog .blog-art img{width:100%;height:100%;object-fit:cover;filter:none!important;border-radius:0!important;transform:none!important;box-shadow:none!important}.blogs .blog:hover img{transform:scale(1.04)!important;box-shadow:none!important}.blog-category{position:absolute;bottom:12px;left:12px;background:#172539ee;border-radius:30px;padding:6px 10px;font-size:.64rem;font-weight:800;letter-spacing:.04em;color:#8ff3bc}.blogs .blog .blog-text{margin-top:0;padding:24px;display:flex;flex-direction:column;flex:1;border-top:3px solid var(--color-secondary)}.blogs .blog .blog-text h4{font-size:1.1rem;line-height:1.55;margin:11px 0}.blogs .blog .blog-text p{font-size:.79rem;line-height:1.85;padding:0;margin:0 0 23px;color:var(--color-grey-2)}.blogs .blog .blog-text h4 a:hover{color:var(--color-secondary)}.blogs .blog .blog-date{font-size:.67rem;font-weight:800;letter-spacing:.1em;color:var(--color-secondary)}.blogs .blog .read-more{color:var(--color-secondary);font-size:.81rem;font-weight:700;margin-top:auto}.blogs .blog .read-more i{margin-left:7px}
#contact-form .main-btn{cursor:pointer;background:transparent;font-family:inherit;font-size:inherit}.form-note{font-size:.72rem;color:var(--color-grey-2);margin-top:14px}.contact-content-con .left-contact .contact-info a:hover{color:var(--color-secondary)}
@media(max-width:1350px){.services-section .main-services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:970px){.skill-collections{grid-template-columns:1fr}.main-service-card{min-height:220px}}
@media(max-width:700px){.section{padding-bottom:115px!important}.services-section .main-services-grid{grid-template-columns:1fr;margin-top:2rem}.main-service-card{min-height:205px}.skill-category{padding:19px}.skills-intro{margin:0 auto 2rem}.controlls{width:100%;left:0;right:0;bottom:0;top:auto;transform:none!important;display:grid;grid-template-columns:repeat(6,1fr);gap:0;padding:9px 5px max(10px,env(safe-area-inset-bottom));background:var(--color-grey-5);border-top:1px solid var(--portfolio-border)}.controlls .control{width:43px;height:43px;padding:9px;margin:0 auto;border-radius:50%;box-shadow:none}.controlls .control i{font-size:1rem}.controlls .control .nav-label{display:none}.theme-btn{top:14px;right:14px;width:45px;height:45px}.theme-btn i{font-size:1.05rem}.services-section .port-text{font-size:.85rem}.blogs .blog .blog-art{height:190px}.service-bottom{margin-bottom:60px}}
@media(min-width:701px) and (max-width:900px){.controlls{right:12px}.controlls .control{width:48px;height:48px}}
@media(prefers-reduced-motion:reduce){.section.active{animation:none}.controlls .control .nav-label,.main-service-card{transition:none}}
/* Project-detail compatibility */
.project-preview{max-width:900px;margin:20px auto 35px;text-align:center}.project-preview img{display:block;width:100%;max-height:500px;object-fit:contain;border-radius:16px;background:#222c39}.project-preview p,.media-note{margin:13px 0;text-align:center;color:var(--color-grey-2);font-size:.84rem}.project-page{padding-bottom:90px}
/* SVG icon fallback: works without third-party icon fonts. */
.controlls .control svg{width:20px;height:20px;color:var(--color-grey-2);pointer-events:none;flex-shrink:0}.controlls .control:hover svg,.controlls .active-btn svg{color:var(--color-white)}
.theme-btn svg{width:26px;height:26px;color:var(--color-grey-2);pointer-events:none}
.service-card-icon svg{width:26px;height:26px}.skill-heading svg{width:21px;height:21px;color:var(--color-secondary);flex-shrink:0}
.tl-icon svg{width:22px;height:22px;color:var(--color-white)}
.blog-art svg{width:62px;height:62px;color:#61db9b}
@media(max-width:700px){.controlls .control svg{width:19px;height:19px}.theme-btn svg{width:22px;height:22px}}

/* Keep section entry readable immediately instead of a full-screen scale animation. */
.section.active{animation:portfolioFade .28s ease-out both}@keyframes portfolioFade{from{opacity:.6}to{opacity:1}}
