/* BAYU Revisi 07 — actual components; no changes to core Canva composition.
   Disable with BAYU_CONFIG.enhancements.visibleElements = false. */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.scroll-cue,.work-timeline-marker,.project-step-icon,.portfolio-steps,.video-play,.skill-title-symbol,.cta-arrow{display:none}
/* HOME — anchored scroll cue, placed underneath existing buttons */
.feature-elements #home .scroll-cue{display:inline-flex;align-items:center;gap:9px;margin-top:26px;font:600 10px/1.2 'Poppins',sans-serif;letter-spacing:.19em;color:#97cbec;transition:color .25s}
.feature-elements #home .scroll-cue:hover{color:#fff}
.feature-elements #home .scroll-cue-icon{display:flex;width:29px;height:29px;justify-content:center;align-items:center;border:1px solid rgba(36,165,255,.57);border-radius:50%;background:rgba(9,106,178,.16)}
.feature-elements #home .scroll-cue svg{width:14px;height:14px;fill:none;stroke:#48b9ff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
/* WORK — numbered timeline connected with hairline; keep all original text. */
.feature-elements .slide-work .experience-copy{position:relative}
.feature-elements .slide-work .experience-group{position:relative;padding-left:39px}
.feature-elements .slide-work .experience-group:not(:nth-child(3))::before{content:"";position:absolute;left:13px;top:27px;bottom:-13px;width:1px;background:linear-gradient(#148fe4,rgba(60,160,216,.12))}
.feature-elements .slide-work .work-timeline-marker{position:absolute;left:0;top:2px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:#104772;border:1px solid #36a6ef;border-radius:50%;box-shadow:0 0 0 3px rgba(11,52,86,.75);font:700 9px 'Space Mono',monospace;color:#f5fbff;letter-spacing:-.07em}
/* PROJECTS — three physical icon tags next to original headings. */
.feature-elements .slide-project .project-block h3{display:inline-flex;align-items:center;gap:9px}
.feature-elements .slide-project .project-step-icon{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(56,163,240,.4);border-radius:4px;background:rgba(23,124,199,.18)}
.feature-elements .slide-project .project-step-icon svg{width:15px;height:15px;fill:none;stroke:#77ceff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* SKILLS — compact symbols, retain existing tool artwork */
.feature-elements #skills .skill-title-symbol{display:inline-flex;vertical-align:middle;margin-right:10px}
.feature-elements #skills .skill-title-symbol svg{width:19px;height:19px;fill:none;stroke:#64c6ff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
/* PROJECT / GALLERY — real, clickable dot pager for the 9 items in project showcase. */
.feature-elements .portfolio-steps{position:absolute;left:30px;bottom:23px;display:flex;align-items:center;gap:13px;z-index:2}
.feature-elements .steps-counter{color:#bbd9ef;font:600 11px 'Space Mono',monospace;white-space:nowrap}
.feature-elements .steps-dots{display:flex;align-items:center;gap:8px}
.feature-elements .steps-dots>a{display:block;width:7px;height:7px;border-radius:50%;background:rgba(185,214,238,.28);border:1px solid rgba(190,227,255,.35);transition:background .2s,transform .2s,box-shadow .2s}
.feature-elements .steps-dots>a.is-current{background:#21a9ff;box-shadow:0 0 0 3px rgba(20,152,239,.13);transform:scale(1.13)}
.feature-elements .steps-dots>a:hover{background:#8adaff;transform:scale(1.25)}
.feature-elements .steps-dots>a:focus-visible{outline:2px solid white;outline-offset:5px}
/* VIDEO — a REAL clickable play link over the actual thumbnail. */
.feature-elements .slide-videos .video-thumb{position:relative;overflow:hidden}
.feature-elements .slide-videos .video-thumb img{display:block}
.feature-elements .slide-videos .video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:inline-flex;width:45px;height:45px;align-items:center;justify-content:center;border:1px solid rgba(240,248,255,.82);background:rgba(2,23,43,.73);color:#fff;border-radius:50%;backdrop-filter:blur(4px);transition:background .2s,box-shadow .2s,transform .2s}
.feature-elements .slide-videos .video-play svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-left:3px}
.feature-elements .slide-videos .video-play:hover{background:#0a93f0;box-shadow:0 0 0 5px rgba(14,164,255,.18);transform:translate(-50%,-50%) scale(1.07)}
/* Avoid old video-item <a> styling affecting play button */
.feature-elements .slide-videos .video-item .video-play{text-decoration:none;padding:0}
.feature-elements .slide-videos .video-item img{object-fit:cover}
.feature-elements #contact .cta-arrow{display:inline-block;font-size:16px;font-weight:600;margin-left:5px}
@media(max-width:1100px){.feature-elements .slide-work .experience-group{padding-left:31px}.feature-elements .slide-work .experience-group:not(:nth-child(3))::before{left:12px}.feature-elements .slide-work .work-timeline-marker{width:25px;height:25px}.feature-elements .portfolio-steps{bottom:23px}}
@media(max-width:600px){
 .feature-elements #home .scroll-cue{margin-top:16px;letter-spacing:.11em;font-size:9px}
 .feature-elements .slide-work .experience-group{padding-left:32px}
 .feature-elements .slide-work .experience-group:not(:nth-child(3))::before{bottom:-12px}
 .feature-elements .portfolio-steps{left:17px;bottom:22px;gap:8px}
 .feature-elements .steps-counter{font-size:9px}
 .feature-elements .steps-dots{gap:5px}
 .feature-elements .steps-dots>a{width:6px;height:6px}
 .feature-elements .slide-videos .video-play{height:40px;width:40px}
}
@media(max-width:380px){.feature-elements .portfolio-steps{gap:6px}.feature-elements .steps-dots{gap:4px}.feature-elements .steps-counter{font-size:8px}}
@media(prefers-reduced-motion:reduce){.feature-elements .scroll-cue,.feature-elements .steps-dots>a,.feature-elements .video-play{transition:none}}