/* ═══════════════════════════════════════
    CSS VARIABLES & THEMES
═══════════════════════════════════════ */
:root {
    --accent:       #5e9fa4;
    --accent-light: #85bfc4;
    --accent-dark:  #3d7f84;
    --accent-glow:  rgba(94,159,164,.18);
    --accent-glow2: rgba(94,159,164,.35);

    --bg:           #ffffff;
    --bg-secondary: #f3f8f9;
    --bg-card:      #ffffff;
    --text:         #0d1f22;
    --text-secondary:#3d5c60;
    --text-muted:   #7fa5a9;
    --border:       rgba(94,159,164,.15);
    --border-strong:rgba(94,159,164,.3);
    --nav-bg:       rgba(255,255,255,.82);
    --shadow-card:  0 2px 24px rgba(94,159,164,.08);
    --shadow-hover: 0 20px 60px rgba(94,159,164,.2);
    --transition:   all .3s cubic-bezier(.4,0,.2,1);
}
[data-theme="dark"] {
    --bg:           #09161a;
    --bg-secondary: #0e1e22;
    --bg-card:      #112328;
    --text:         #dff0f2;
    --text-secondary:#7fb8bd;
    --text-muted:   #3d6a6f;
    --border:       rgba(94,159,164,.15);
    --border-strong:rgba(94,159,164,.28);
    --nav-bg:       rgba(9,22,26,.88);
    --shadow-card:  0 2px 24px rgba(0,0,0,.28);
    --shadow-hover: 0 20px 60px rgba(94,159,164,.14);
}

/* ═══════════════════════════════════════
    RESET & BASE
═══════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden}
body{
    font-family:'DM Sans',sans-serif;
    background:var(--bg);
    color:var(--text);
    transition:background .45s ease,color .45s ease;
    cursor:none;
    overflow-x:hidden;
}
img{display:block;max-width:100%}
a{cursor:none}
button{cursor:none}

/* ═══════════════════════════════════════
    CUSTOM CURSOR
═══════════════════════════════════════ */
.cur-dot{
    position:fixed;width:8px;height:8px;
    background:var(--accent);border-radius:50%;
    pointer-events:none;z-index:9999;
    transform:translate(-50%,-50%);
    transition:width .15s,height .15s,opacity .15s;
}
.cur-ring{
    position:fixed;width:34px;height:34px;
    border:1.5px solid var(--accent);border-radius:50%;
    pointer-events:none;z-index:9998;
    transform:translate(-50%,-50%);
    transition:width .2s,height .2s,opacity .2s;
    opacity:.55;
}
body.hov .cur-dot{width:14px;height:14px;opacity:.8}
body.hov .cur-ring{width:50px;height:50px;opacity:.25}

/* ═══════════════════════════════════════
    SCROLLBAR
═══════════════════════════════════════ */
::-webkit-scrollbar{width:3px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--accent);border-radius:2px}

/* ═══════════════════════════════════════
    NAV
═══════════════════════════════════════ */
nav{
    position:fixed;top:0;left:0;right:0;z-index:1000;
    height:62px;display:flex;align-items:center;
    justify-content:space-between;padding:0 2.5rem;
    background:var(--nav-bg);
    backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
    border-bottom:1px solid var(--border);
    transition:var(--transition);
}
nav.scrolled{box-shadow:0 4px 30px rgba(0,0,0,.08);height:54px}

.nav-logo{
    font-family:'Outfit',sans-serif;font-weight:900;font-size:1.15rem;
    color:var(--text);text-decoration:none;letter-spacing:-.03em;
    white-space:nowrap;
}
.nav-logo span{color:var(--accent)}

.nav-links{display:flex;align-items:center;gap:.15rem;list-style:none}
.nav-links a{
    color:var(--text-secondary);text-decoration:none;
    font-size:.82rem;font-weight:400;
    padding:.38rem .72rem;border-radius:7px;
    transition:var(--transition);letter-spacing:.01em;
}
.nav-links a:hover{color:var(--accent);background:var(--accent-glow)}

.nav-right{display:flex;align-items:center;gap:.65rem}

.lang-switcher{
    display:flex;background:var(--bg-secondary);
    border:1px solid var(--border);border-radius:9px;padding:3px;gap:2px;
}
.lang-btn{
    background:none;border:none;
    color:var(--text-muted);
    font-family:'Outfit',sans-serif;font-size:.72rem;font-weight:700;
    padding:.22rem .48rem;border-radius:6px;
    transition:var(--transition);letter-spacing:.06em;
}
.lang-btn.active{background:var(--accent);color:#fff}
.lang-btn:hover:not(.active){color:var(--accent);background:var(--accent-glow)}

.theme-btn{
    background:none;border:1px solid var(--border);
    border-radius:9px;width:36px;height:36px;
    display:flex;align-items:center;justify-content:center;
    transition:var(--transition);color:var(--text-secondary);font-size:.95rem;
}
.theme-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-glow)}

.cv-btn{
    background:var(--accent);color:#fff;border:none;
    border-radius:9px;padding:.4rem 1rem;
    font-family:'DM Sans',sans-serif;font-size:.8rem;font-weight:500;
    display:flex;align-items:center;gap:.4rem;
    transition:var(--transition);white-space:nowrap;
}
.cv-btn:hover{background:var(--accent-dark);transform:translateY(-1px);box-shadow:0 6px 20px var(--accent-glow2)}

/* ═══════════════════════════════════════
    HERO
═══════════════════════════════════════ */
.hero{
    min-height:100vh;display:flex;align-items:center;
    position:relative;overflow:hidden;padding:80px 2.5rem 3rem;
}
#hero-canvas{position:absolute;inset:0;z-index:0}

.hero-bg-grad{
    position:absolute;inset:0;z-index:0;
    background:radial-gradient(ellipse 70% 80% at 80% 50%, var(--accent-glow) 0%, transparent 70%);
    pointer-events:none;
}

.hero-inner{
    position:relative;z-index:1;
    max-width:1200px;margin:0 auto;width:100%;
    display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;
}

.hero-eyebrow{
    font-family:'Outfit',sans-serif;font-size:.72rem;font-weight:600;
    color:var(--accent);letter-spacing:.18em;text-transform:uppercase;
    margin-bottom:1rem;
    display:flex;align-items:center;gap:.6rem;
    opacity:0;transform:translateY(18px);
    animation:fadeUp .7s ease .2s forwards;
}
.hero-eyebrow::before{
    content:'';width:28px;height:1px;background:var(--accent);
}

.hero-name{
    font-family:'Outfit',sans-serif;
    font-size:clamp(3rem,5.5vw,5.2rem);
    font-weight:900;line-height:.92;letter-spacing:-.04em;
    margin-bottom:.6rem;
    opacity:0;transform:translateY(30px);
    animation:fadeUp .9s ease .38s forwards;
}
.hero-name .first{display:block;color:var(--text)}
.hero-name .last{
    display:block;color:var(--accent);
    text-shadow:0 0 60px var(--accent-glow2);
}

.hero-title-line{
    font-size:.98rem;font-weight:300;color:var(--text-secondary);
    margin-bottom:1.8rem;letter-spacing:.01em;
    opacity:0;transform:translateY(18px);
    animation:fadeUp .7s ease .55s forwards;
}

.hero-desc{
    font-size:.95rem;line-height:1.85;color:var(--text-secondary);
    max-width:460px;margin-bottom:2.5rem;
    opacity:0;transform:translateY(18px);
    animation:fadeUp .7s ease .7s forwards;
}

.hero-ctas{
    display:flex;gap:.9rem;flex-wrap:wrap;
    opacity:0;transform:translateY(18px);
    animation:fadeUp .7s ease .88s forwards;
}
.btn-p{
    background:var(--accent);color:#fff;text-decoration:none;
    padding:.72rem 1.6rem;border-radius:11px;font-weight:500;
    font-size:.88rem;transition:var(--transition);
    display:inline-flex;align-items:center;gap:.45rem;
}
.btn-p:hover{background:var(--accent-dark);transform:translateY(-3px);box-shadow:0 10px 30px var(--accent-glow2)}
.btn-o{
    background:none;color:var(--text);text-decoration:none;
    padding:.72rem 1.6rem;border-radius:11px;
    border:1px solid var(--border-strong);font-weight:400;
    font-size:.88rem;transition:var(--transition);
    display:inline-flex;align-items:center;gap:.45rem;
}
.btn-o:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-glow);transform:translateY(-3px)}

/* Photo */
.hero-photo{
    display:flex;justify-content:center;align-items:center;
    opacity:0;transform:scale(.88) translateY(20px);
    animation:photoReveal 1.1s cubic-bezier(.34,1.36,.64,1) .5s forwards;
}
@keyframes photoReveal{to{opacity:1;transform:scale(1) translateY(0)}}

.photo-wrap{position:relative;width:320px;height:320px}

.photo-hex{
    width:100%;height:100%;
    clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);
    overflow:hidden;position:relative;z-index:2;
}
.photo-hex img{
    width:100%;height:100%;
    object-fit:cover;object-position:top center;
    transition:transform .6s ease;
}
.photo-hex:hover img{transform:scale(1.06)}

.photo-glow{
    position:absolute;inset:-30px;z-index:1;
    background:radial-gradient(circle,var(--accent-glow2) 0%,transparent 70%);
    animation:pulse 3.5s ease-in-out infinite;
}
.photo-ring{
    position:absolute;border-radius:50%;border:1px solid var(--accent);
    pointer-events:none;
}
.pr1{
    width:370px;height:370px;top:-25px;left:-25px;
    opacity:.22;border-style:dashed;
    animation:spin 22s linear infinite;
}
.pr2{
    width:410px;height:410px;top:-45px;left:-45px;
    opacity:.1;animation:spin 40s linear infinite reverse;
}

.hero-scroll{
    position:absolute;bottom:2rem;left:50%;
    transform:translateX(-50%);
    display:flex;flex-direction:column;align-items:center;gap:.4rem;
    opacity:0;animation:fadeUp .6s ease 1.6s forwards;
}
.scroll-line{
    width:1px;height:44px;
    background:linear-gradient(to bottom,var(--accent),transparent);
    animation:scrollAnim 2.2s ease-in-out infinite;
}
@keyframes scrollAnim{
    0%{transform:scaleY(0);transform-origin:top}
    50%{transform:scaleY(1);transform-origin:top}
    51%{transform:scaleY(1);transform-origin:bottom}
    100%{transform:scaleY(0);transform-origin:bottom}
}
.scroll-txt{
    font-size:.6rem;letter-spacing:.18em;
    color:var(--text-muted);text-transform:uppercase;
    font-family:'Outfit',sans-serif;
}

/* ═══════════════════════════════════════
    SECTION SHARED
═══════════════════════════════════════ */
.sec{
    padding:7rem 2.5rem;
    max-width:1200px;margin:0 auto;
}
.sec-alt{
    background:var(--bg-secondary);
    border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
    padding:7rem 0;
}
.sec-alt .sec-in{max-width:1200px;margin:0 auto;padding:0 2.5rem}

.sec-hd{margin-bottom:4rem}
.sec-lbl{
    font-family:'Outfit',sans-serif;font-size:.7rem;font-weight:700;
    color:var(--accent);letter-spacing:.22em;text-transform:uppercase;
    margin-bottom:.7rem;display:flex;align-items:center;gap:.65rem;
}
.sec-lbl::after{content:'';height:1px;width:36px;background:var(--accent);opacity:.45}
.sec-ttl{
    font-family:'Outfit',sans-serif;
    font-size:clamp(1.8rem,3.5vw,2.8rem);
    font-weight:700;letter-spacing:-.025em;line-height:1.1;
    color:var(--text);
}
.sec-ttl em{color:var(--accent);font-style:normal}

/* ═══════════════════════════════════════
    ABOUT
═══════════════════════════════════════ */
#about{border-top:1px solid var(--border)}
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:5rem;align-items:center}
.about-text p{
    font-size:.97rem;line-height:1.92;
    color:var(--text-secondary);margin-bottom:1.2rem;
}

.about-cards{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.acard{
    background:var(--bg-card);border:1px solid var(--border);
    border-radius:16px;padding:1.5rem;
    transition:var(--transition);
}
.acard:hover{border-color:var(--accent);transform:translateY(-5px);box-shadow:var(--shadow-hover)}
.acard-num{
    font-family:'Outfit',sans-serif;font-size:2.4rem;
    font-weight:900;color:var(--accent);line-height:1;margin-bottom:.2rem;
}
.acard-lbl{font-size:.78rem;color:var(--text-muted);line-height:1.4}

/* ═══════════════════════════════════════
    TIMELINE (Experience & Education)
═══════════════════════════════════════ */
.timeline{position:relative;padding-left:1.5rem}
.timeline::before{
    content:'';position:absolute;left:0;top:0;bottom:0;
    width:1px;background:linear-gradient(to bottom,var(--accent),transparent);
}
.tl-item{
    position:relative;padding:0 0 3rem 2.5rem;
    opacity:0;transform:translateX(-24px);
    transition:opacity .65s ease,transform .65s ease;
}
.tl-item.visible{opacity:1;transform:translateX(0)}
.tl-item::before{
    content:'';position:absolute;left:-1.55rem;top:.4rem;
    width:11px;height:11px;border-radius:50%;
    background:var(--accent);
    box-shadow:0 0 0 5px var(--accent-glow);
}
.tl-date{
    font-family:'Outfit',sans-serif;font-size:.68rem;font-weight:700;
    color:var(--accent);letter-spacing:.12em;text-transform:uppercase;margin-bottom:.5rem;
}
.tl-co{
    font-family:'Outfit',sans-serif;font-size:1.15rem;
    font-weight:700;color:var(--text);margin-bottom:.2rem;
}
.tl-role{font-size:.82rem;color:var(--accent);font-weight:500;margin-bottom:.8rem}
.tl-desc{font-size:.88rem;line-height:1.75;color:var(--text-secondary)}
.tl-desc ul{list-style:none}
.tl-desc ul li{
    padding-left:1rem;position:relative;margin-bottom:.35rem;
}
.tl-desc ul li::before{
    content:'›';position:absolute;left:0;
    color:var(--accent);font-weight:700;
}

/* ═══════════════════════════════════════
    SKILLS
═══════════════════════════════════════ */
.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:2.5rem}
.sk-group-ttl{
    font-family:'Outfit',sans-serif;font-size:.75rem;font-weight:700;
    color:var(--text);letter-spacing:.1em;text-transform:uppercase;
    margin-bottom:1.25rem;display:flex;align-items:center;gap:.5rem;
}
.sk-group-ttl span{
    width:6px;height:6px;border-radius:50%;
    background:var(--accent);display:inline-block;flex-shrink:0;
}
.sk-group-ttl span#sirka{
    width:200px;
    background: none;
}

.skill-bar{margin-bottom:1.1rem}
.skill-bar-hd{
    display:flex;justify-content:space-between;margin-bottom:.35rem;
}
.skill-bar-nm{font-size:.83rem;color:var(--text-secondary);font-weight:500}
.skill-bar-pc{
    font-family:'Outfit',sans-serif;font-size:.75rem;
    color:var(--text-muted);font-weight:600;
}
.skill-bar-tr{
    height:3px;background:var(--border);border-radius:2px;overflow:hidden;
}
.skill-bar-fl{
    height:100%;
    background:linear-gradient(90deg,var(--accent-dark),var(--accent-light));
    border-radius:2px;width:0;
    transition:width 1.4s cubic-bezier(.4,0,.2,1);
}

.tags{display:flex;flex-wrap:wrap;gap:.5rem}
.tag{
    background:var(--bg-card);border:1px solid var(--border);
    color:var(--text-secondary);font-size:.78rem;
    padding:.3rem .8rem;border-radius:999px;
    transition:var(--transition);
}
.tag:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-glow);transform:translateY(-2px)}

/* ═══════════════════════════════════════
    CERTIFICATES
═══════════════════════════════════════ */
#certificates{border-top:1px solid var(--border)}
.cert-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
    gap:1rem;
}
.cert-card{
    background:var(--bg-card);border:1px solid var(--border);
    border-radius:16px;padding:1.5rem;
    text-decoration:none;color:inherit;
    display:flex;flex-direction:column;gap:.55rem;
    min-height:170px;
    transition:var(--transition);
}
.cert-card:hover{
    border-color:var(--accent);
    transform:translateY(-5px);
    box-shadow:var(--shadow-hover);
}
.cert-name{
    font-family:'Outfit',sans-serif;
    font-size:1rem;font-weight:700;color:var(--text);
}
.cert-desc{
    font-size:.84rem;line-height:1.65;color:var(--text-secondary);
    flex:1;
}
.cert-link{
    font-family:'Outfit',sans-serif;
    font-size:.72rem;font-weight:700;letter-spacing:.08em;
    color:var(--accent);text-transform:uppercase;
}

/* ═══════════════════════════════════════
    PORTFOLIO
═══════════════════════════════════════ */
.port-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
    gap:1.5rem;
}
.pcard{
    background:var(--bg-card);border:1px solid var(--border);
    border-radius:18px;padding:2rem;
    text-decoration:none;color:inherit;
    position:relative;overflow:hidden;
    display:block;
    opacity:0;transform:translateY(32px);
    transition:opacity .65s ease,transform .65s ease,
                border-color .3s,box-shadow .3s;
}
.pcard.visible{opacity:1;transform:translateY(0)}
.pcard::before{
    content:'';position:absolute;top:0;left:0;right:0;height:2px;
    background:linear-gradient(90deg,var(--accent-dark),var(--accent-light));
    transform:scaleX(0);transform-origin:left;transition:transform .35s ease;
}
.pcard:hover::before{transform:scaleX(1)}
.pcard:hover{
    border-color:var(--accent);
    transform:translateY(-8px)!important;
    box-shadow:var(--shadow-hover);
}
.pcard-icon{
    width:46px;height:46px;background:var(--accent-glow);
    border-radius:12px;display:flex;align-items:center;justify-content:center;
    margin-bottom:1.2rem;transition:var(--transition);
}
.pcard:hover .pcard-icon{background:var(--accent);transform:rotate(6deg) scale(1.1)}
.pcard-icon img{
    width:26px;height:26px;object-fit:contain;
    filter:none;transition:var(--transition);
}
.pcard:hover .pcard-icon img{filter:brightness(0) invert(1)}
.pcard-ttl{
    font-family:'Outfit',sans-serif;font-size:1.05rem;
    font-weight:700;color:var(--text);margin-bottom:.45rem;
    transition:var(--transition);
}
.pcard:hover .pcard-ttl{color:var(--accent)}
.pcard-desc{font-size:.84rem;line-height:1.72;color:var(--text-secondary);margin-bottom:1.2rem}
.pcard-tags{display:flex;flex-wrap:wrap;gap:.38rem}
.pcard-tag{
    font-size:.7rem;padding:.18rem .58rem;border-radius:999px;
    background:var(--bg-secondary);color:var(--text-muted);font-weight:500;
}
.pcard-arr{
    position:absolute;top:1.4rem;right:1.4rem;
    color:var(--text-muted);font-size:1rem;transition:var(--transition);
}
.pcard:hover .pcard-arr{color:var(--accent);transform:translate(3px,-3px)}

/* ═══════════════════════════════════════
    CONTACT
═══════════════════════════════════════ */
#contact{border-top:1px solid var(--border)}
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:5rem;align-items:start}
.contact-outro h3{
    font-family:'Outfit',sans-serif;font-size:clamp(1.5rem,2.8vw,2.2rem);
    font-weight:700;color:var(--text);margin-bottom:1rem;line-height:1.2;
}
.contact-outro p{font-size:.96rem;line-height:1.85;color:var(--text-secondary)}

.contact-items{display:flex;flex-direction:column;gap:.75rem;margin-top:2rem}
.citem{
    display:flex;align-items:center;gap:.9rem;
    padding:.95rem 1rem;border:1px solid var(--border);
    border-radius:13px;text-decoration:none;color:var(--text-secondary);
    transition:var(--transition);
}
.citem:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-glow);transform:translateX(5px)}
.citem-ico{
    width:40px;height:40px;flex-shrink:0;
    background:var(--bg-secondary);border-radius:10px;
    display:flex;align-items:center;justify-content:center;
    font-size:1rem;transition:var(--transition);
}
.citem:hover .citem-ico{background:var(--accent);color:#fff}
.citem-lbl{font-size:.68rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;font-family:'Outfit',sans-serif}
.citem-val{font-size:.88rem;font-weight:500}

/* ═══════════════════════════════════════
    FOOTER
═══════════════════════════════════════ */
footer{
    border-top:1px solid var(--border);
    padding:2rem;text-align:center;
    font-size:.78rem;color:var(--text-muted);
}
footer a{color:var(--accent);text-decoration:none}
footer a:hover{text-decoration:underline}

/* ═══════════════════════════════════════
    CV MODAL
═══════════════════════════════════════ */
.modal-ov{
    position:fixed;inset:0;z-index:3000;
    background:rgba(0,0,0,.45);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    display:flex;align-items:center;justify-content:center;
    opacity:0;pointer-events:none;
    transition:opacity .3s ease;
}
.modal-ov.open{opacity:1;pointer-events:all}
.modal-box{
    background:var(--bg-card);border:1px solid var(--border-strong);
    border-radius:22px;padding:2.5rem;width:92%;max-width:430px;
    position:relative;
    transform:scale(.88) translateY(24px);
    transition:transform .38s cubic-bezier(.34,1.36,.64,1);
    box-shadow:0 40px 100px rgba(0,0,0,.3);
}
.modal-ov.open .modal-box{transform:scale(1) translateY(0)}
.modal-ttl{
    font-family:'Outfit',sans-serif;font-size:1.25rem;
    font-weight:700;color:var(--text);margin-bottom:.3rem;
}
.modal-sub{font-size:.82rem;color:var(--text-muted);margin-bottom:1.8rem}
.modal-opts{display:flex;flex-direction:column;gap:.65rem}
.modal-opt{
    background:var(--bg-secondary);border:1px solid var(--border);
    border-radius:13px;padding:1rem 1.2rem;
    display:flex;align-items:center;gap:.9rem;
    text-decoration:none;color:var(--text);
    transition:var(--transition);
}
.modal-opt:hover{border-color:var(--accent);background:var(--accent-glow);transform:translateX(5px)}
.modal-opt-flag{font-size:1.55rem;line-height:1}
.modal-opt-info{flex:1}
.modal-opt-lbl{font-family:'Outfit',sans-serif;font-weight:600;font-size:.92rem}
.modal-opt-sub{font-size:.74rem;color:var(--text-muted);margin-top:.1rem}
.modal-opt-dl{color:var(--accent);font-size:.95rem;flex-shrink:0}
.modal-close-btn{
    position:absolute;top:1.1rem;right:1.1rem;
    background:none;border:none;color:var(--text-muted);
    font-size:1.15rem;padding:.25rem;
    transition:var(--transition);border-radius:6px;
}
.modal-close-btn:hover{color:var(--text);background:var(--bg-secondary)}

/* ═══════════════════════════════════════
    SCROLL REVEAL
═══════════════════════════════════════ */
.rev{opacity:0;transform:translateY(36px);transition:opacity .7s ease,transform .7s ease}
.rev.visible{opacity:1;transform:translateY(0)}
.rev.d1{transition-delay:.1s}.rev.d2{transition-delay:.2s}.rev.d3{transition-delay:.3s}

/* ═══════════════════════════════════════
    KEYFRAMES
═══════════════════════════════════════ */
@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes pulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}

/* ═══════════════════════════════════════
    RESPONSIVE
═══════════════════════════════════════ */
@media(max-width:900px){
    .hero-inner{grid-template-columns:1fr;text-align:center}
    .hero-photo{order:-1}
    .hero-ctas{justify-content:center}
    .hero-desc{margin:0 auto 2rem}
    .hero-eyebrow{justify-content:center}
    .about-grid,.contact-grid{grid-template-columns:1fr;gap:3rem}
    .nav-links{display:none}
    .photo-wrap{width:240px;height:240px}
    .pr1{width:280px;height:280px;top:-20px;left:-20px}
    .pr2{width:310px;height:310px;top:-35px;left:-35px}
}
@media(max-width:640px){
    nav{padding:0 1.25rem}
    .sec{padding:5rem 1.25rem}
    .sec-alt .sec-in{padding:0 1.25rem}
    .about-cards{grid-template-columns:1fr 1fr}
    .cv-btn span{display:none}
}

.symbol {
font-family: "Segoe UI Symbol", Arial, sans-serif;
}