/* Ricardo Romero — Tech Forward / Swiss / Dark Mode Portfolio */
:root {
    --bg: #07090b;
    --bg-deep: #040506;
    --surface: #0d1114;
    --surface-2: #11171b;
    --surface-glass: rgba(14, 18, 21, .72);
    --line: rgba(255,255,255,.10);
    --line-strong: rgba(255,255,255,.18);
    --text: #f4f6f7;
    --muted: #89939a;
    --soft: #b9c1c6;
    --accent: #f3a51c;
    --accent-bright: #ffc14b;
    --accent-dim: rgba(243,165,28,.13);
    --accent-glow: rgba(243,165,28,.20);
    --max: 1240px;
    --ease: cubic-bezier(.16,1,.3,1);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--bg-deep); }
body {
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    background:
        radial-gradient(circle at 75% 8%, rgba(243,165,28,.055), transparent 25rem),
        linear-gradient(180deg,var(--bg-deep),var(--bg));
    color:var(--text); line-height:1.6; overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}
body::before {
    content:""; position:fixed; inset:0; pointer-events:none; z-index:-2;
    background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
                     linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
    background-size:72px 72px;
    mask-image:linear-gradient(to bottom,black,transparent 80%);
}
a { color:inherit; }
.noise { position:fixed; inset:0; pointer-events:none; opacity:.035; z-index:50; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); }
.ambient { position:fixed; width:28rem; height:28rem; border-radius:50%; filter:blur(100px); opacity:.08; pointer-events:none; z-index:-1; }
.ambient-one { top:10%; right:-15rem; background:var(--accent); }
.ambient-two { bottom:5%; left:-18rem; background:#3976a8; }

.announcement-banner {
    min-height:34px; display:flex; align-items:center; justify-content:center; gap:.65rem;
    padding:.48rem 1rem; position:fixed; inset:0 0 auto; z-index:1003;
    background:rgba(6,8,10,.82); border-bottom:1px solid var(--line);
    backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px);
    font:600 .67rem/1.2 "Space Grotesk",sans-serif; letter-spacing:.11em; text-transform:uppercase;
    color:var(--soft);
}
.announcement-banner strong { color:var(--accent); font-weight:700; }
.status-dot { width:6px; height:6px; border-radius:50%; background:#63d28b; box-shadow:0 0 12px #63d28b; }
.announcement-location { color:#626d74; }

nav {
    position:fixed; top:34px; left:50%; transform:translateX(-50%); width:min(100% - 28px, 1380px);
    z-index:1000; display:flex; align-items:center; justify-content:space-between;
    padding:.72rem .85rem .72rem 1rem; margin-top:.55rem;
    border:1px solid var(--line); border-radius:14px;
    background:rgba(9,12,14,.72); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
    box-shadow:0 16px 50px rgba(0,0,0,.28); transition:.35s var(--ease);
}
nav.scrolled { background:rgba(7,10,12,.94); border-color:var(--line-strong); }
.nav-logo { display:flex; align-items:center; gap:.65rem; text-decoration:none; font:600 .82rem "Space Grotesk",sans-serif; letter-spacing:.02em; }
.logo-mark,.footer-mark { display:grid; place-items:center; width:31px; height:31px; border:1px solid rgba(243,165,28,.5); color:var(--accent); font:700 .62rem "Space Grotesk",sans-serif; letter-spacing:.03em; }
.nav-links { list-style:none; display:flex; align-items:center; gap:.15rem; }
.nav-links a { text-decoration:none; color:#89939a; font:500 .67rem "Space Grotesk",sans-serif; text-transform:uppercase; letter-spacing:.07em; padding:.65rem .68rem; border-radius:8px; transition:.2s ease; }
.nav-links a span { color:#515a60; margin-right:.35rem; font-size:.56rem; }
.nav-links a:hover,.nav-links a:focus-visible { color:var(--text); background:rgba(255,255,255,.045); }
.nav-download-btn { color:var(--accent)!important; border:1px solid rgba(243,165,28,.35); background:var(--accent-dim); margin-left:.35rem; }
.nav-download-btn span { color:var(--accent)!important; }
.dropdown { position:relative; }
.dropdown-content { display:none; position:absolute; right:0; top:calc(100% + .55rem); min-width:220px; padding:.35rem; border:1px solid var(--line-strong); border-radius:11px; background:rgba(12,16,19,.97); backdrop-filter:blur(22px); box-shadow:0 24px 60px rgba(0,0,0,.55); animation:drop .22s var(--ease); }
.dropdown.active .dropdown-content { display:block; }
@keyframes drop { from{opacity:0;transform:translateY(-7px)} to{opacity:1;transform:none} }
.dropdown-content a { display:flex; justify-content:space-between; color:var(--soft); padding:.72rem .75rem; }
.dropdown-content a span { color:var(--accent); border:1px solid var(--line); padding:.12rem .3rem; margin:0; }
.mobile-menu-btn { display:none; border:0; background:transparent; cursor:pointer; padding:.5rem; }
.mobile-menu-btn span { display:block; width:23px; height:1px; background:var(--text); margin:5px 0; transition:.3s var(--ease); }
.mobile-menu-btn.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.mobile-menu-btn.open span:nth-child(2){opacity:0}
.mobile-menu-btn.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.hero {
    min-height:100vh; position:relative; display:grid; place-items:center; overflow:hidden;
    padding:9rem 2rem 6rem; isolation:isolate;
    background:
        radial-gradient(circle at 50% 45%, rgba(243,165,28,.08), transparent 26rem),
        linear-gradient(180deg,#080a0c 0%,#080a0c 65%,#060708 100%);
}
.hero::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 49.9%,rgba(243,165,28,.07) 50%,transparent 50.1%); opacity:.45; pointer-events:none; }
.hero-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:80px 80px; mask-image:radial-gradient(circle at center,black 0,transparent 72%); }
.hero-orbit { position:absolute; border:1px solid rgba(243,165,28,.10); border-radius:50%; transform:rotate(-18deg); }
.orbit-one { width:55rem;height:18rem; }
.orbit-two { width:75rem;height:25rem; border-color:rgba(255,255,255,.045); transform:rotate(18deg); }
.hero-content { position:relative; z-index:2; width:min(100%,1050px); text-align:left; animation:heroIn 1.1s var(--ease) both; }
@keyframes heroIn { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:none} }
.hero-kicker { display:inline-flex; align-items:center; gap:.55rem; color:var(--accent); font:600 .7rem "Space Grotesk",sans-serif; letter-spacing:.15em; text-transform:uppercase; }
.hero-kicker span { width:20px;height:1px;background:var(--accent); box-shadow:0 0 12px var(--accent); }
.hero-index { margin-top:2.2rem; color:#59636a; font:500 .62rem "Space Grotesk",sans-serif; letter-spacing:.2em; }
.hero h1 { margin:.55rem 0 .75rem; font:700 clamp(4rem,10vw,9.2rem)/.87 "Space Grotesk",sans-serif; letter-spacing:-.075em; max-width:1000px; }
.hero h1 em { color:transparent; -webkit-text-stroke:1px rgba(244,246,247,.75); font-style:normal; }
.hero-rule { width:min(100%,760px); height:1px; background:linear-gradient(90deg,var(--accent),rgba(255,255,255,.15),transparent); }
.hero-lead { max-width:670px; margin:1.25rem 0 1.7rem; color:#a6afb5; font-size:clamp(1rem,1.7vw,1.22rem); line-height:1.65; font-weight:300; }
.hero-actions { display:flex; gap:.7rem; flex-wrap:wrap; }
.primary-action,.secondary-action { display:inline-flex; align-items:center; gap:1rem; padding:.78rem 1rem; border-radius:7px; text-decoration:none; font:600 .7rem "Space Grotesk",sans-serif; text-transform:uppercase; letter-spacing:.08em; transition:.25s var(--ease); }
.primary-action { background:var(--accent); color:#0a0b0c; }
.primary-action:hover { transform:translateY(-3px); box-shadow:0 12px 35px var(--accent-glow); }
.secondary-action { border:1px solid var(--line-strong); color:var(--soft); }
.secondary-action:hover { border-color:var(--accent); color:var(--accent); }
.contact-pills { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:3.2rem; }
.pill { display:inline-flex; align-items:center; gap:.45rem; padding:.48rem .7rem; color:#778188; border:1px solid var(--line); background:rgba(255,255,255,.025); border-radius:5px; text-decoration:none; font-size:.69rem; transition:.2s ease; }
.pill span { color:var(--accent); }
.pill:hover { color:var(--text); border-color:rgba(243,165,28,.35); background:var(--accent-dim); }
.hero-scroll { position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:.6rem; color:#515b62; font:500 .57rem "Space Grotesk",sans-serif; letter-spacing:.18em; }
.hero-scroll i { width:1px;height:34px;background:linear-gradient(var(--accent),transparent); }

main { width:min(calc(100% - 40px),var(--max)); margin:auto; padding:9rem 0 5rem; }
section { margin-bottom:11rem; scroll-margin-top:120px; }
.section-heading { display:grid; grid-template-columns:70px 1fr; gap:1.5rem; align-items:start; margin-bottom:2.7rem; }
.section-number { color:var(--accent); font:600 .65rem "Space Grotesk",sans-serif; padding-top:.55rem; letter-spacing:.12em; }
.eyebrow { color:#626d74; font:600 .63rem "Space Grotesk",sans-serif; text-transform:uppercase; letter-spacing:.18em; margin-bottom:.3rem; }
.section-title { font:600 clamp(2.5rem,5vw,4.5rem)/1 "Space Grotesk",sans-serif; letter-spacing:-.06em; }
.section-title span { color:#606a71; }

.profile-layout { display:grid; grid-template-columns:1.2fr .8fr; gap:4rem; padding:3rem 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.profile-statement p { font:400 clamp(1.45rem,2.6vw,2.25rem)/1.35 "Space Grotesk",sans-serif; letter-spacing:-.035em; color:#dce1e4; }
.profile-statement p::first-letter { color:var(--accent); }
.profile-detail { border-left:1px solid var(--line); padding-left:2rem; color:#89939a; font-size:.94rem; line-height:1.8; }
.metric-row { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2.5rem; }
.metric-row div { padding-top:1rem; border-top:1px solid var(--line); }
.metric-row strong { display:block; color:var(--accent); font:600 1.55rem "Space Grotesk",sans-serif; }
.metric-row span { display:block; color:#59636a; font-size:.63rem; text-transform:uppercase; letter-spacing:.08em; margin-top:.15rem; }

.visual-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:.8rem; }
.visual-card { position:relative; min-height:340px; overflow:hidden; border:1px solid var(--line); background:#0b0e10; }
.visual-card.visual-wide { min-height:430px; }
.visual-card:nth-child(2),.visual-card:nth-child(3) { min-height:300px; }
.visual-card img { width:100%; height:100%; min-height:inherit; object-fit:cover; filter:grayscale(.65) saturate(.7) brightness(.58); transition:transform .8s var(--ease),filter .8s var(--ease); }
.visual-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 25%,rgba(4,6,7,.92)); }
.visual-card:hover img { transform:scale(1.06); filter:grayscale(.1) saturate(1) brightness(.7); }
.visual-overlay { position:absolute; inset:auto 1.3rem 1.25rem; z-index:2; }
.visual-overlay > span { color:var(--accent); font:600 .6rem "Space Grotesk",sans-serif; letter-spacing:.12em; }
.visual-overlay h3 { margin-top:.2rem; font:500 1.25rem/1.15 "Space Grotesk",sans-serif; letter-spacing:-.025em; }
.visual-overlay p { margin-top:.35rem; color:#89939a; font-size:.7rem; }

.cert-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.cert-badge-card { position:relative; min-height:175px; padding:1.35rem; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.012); display:flex; flex-direction:column; justify-content:flex-end; transition:.35s var(--ease); overflow:hidden; }
.cert-badge-card::before { content:""; position:absolute; width:90px;height:90px; border:1px solid rgba(243,165,28,.07); transform:rotate(45deg); top:-50px; right:-50px; transition:.4s var(--ease); }
.cert-badge-card:hover { background:rgba(243,165,28,.035); border-color:rgba(243,165,28,.28); transform:translateY(-2px); z-index:1; }
.cert-badge-card:hover::before { transform:rotate(45deg) scale(1.25); border-color:rgba(243,165,28,.2); }
.cert-index { position:absolute; top:1rem; right:1rem; color:#414a50; font:500 .58rem "Space Grotesk",sans-serif; }
.cert-issuer { color:var(--accent); font:600 .6rem "Space Grotesk",sans-serif; text-transform:uppercase; letter-spacing:.13em; }
.cert-name { margin-top:.35rem; color:#d8dde0; font:500 .98rem/1.3 "Space Grotesk",sans-serif; }
.cert-meta { margin-top:.5rem; color:#68737a; font-size:.62rem; }

.timeline { position:relative; display:flex; flex-direction:column; gap:.8rem; }
.timeline-line { position:absolute; top:0; bottom:0; left:19px; width:1px; background:linear-gradient(var(--accent),rgba(255,255,255,.06) 80%,transparent); }
.experience-card { position:relative; margin-left:0; padding:2rem 2rem 2rem 4.4rem; border:1px solid var(--line); background:linear-gradient(135deg,rgba(255,255,255,.025),rgba(255,255,255,.008)); transition:.35s var(--ease); }
.experience-card:hover { border-color:rgba(243,165,28,.28); transform:translateX(5px); background:rgba(243,165,28,.025); }
.timeline-marker { position:absolute; top:2rem; left:0; width:39px; height:39px; display:grid; place-items:center; border:1px solid rgba(243,165,28,.38); background:#0a0d0f; color:var(--accent); font:600 .54rem "Space Grotesk",sans-serif; letter-spacing:.05em; z-index:2; }
.exp-header { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; }
.exp-title { color:#e7eaec; font:600 1.12rem/1.25 "Space Grotesk",sans-serif; letter-spacing:-.015em; }
.exp-company { color:var(--accent); font-size:.78rem; margin-top:.25rem; }
.exp-company span { color:#525d64; }
.exp-date { flex:none; padding:.34rem .55rem; border:1px solid var(--line); color:#747f86; font:500 .61rem "Space Grotesk",sans-serif; text-transform:uppercase; letter-spacing:.04em; }
.exp-date small { color:#4e585e; }
.exp-details { list-style:none; display:grid; gap:.55rem; margin-top:1.45rem; }
.exp-details li { position:relative; padding-left:1rem; color:#838e95; font-size:.83rem; line-height:1.7; }
.exp-details li::before { content:""; position:absolute; left:0; top:.72em; width:4px;height:1px;background:var(--accent); }

.education-grid { display:grid; grid-template-columns:1fr 1fr; gap:.8rem; }
.education-card { display:grid; grid-template-columns:70px 1fr; gap:1.2rem; padding:1.7rem; border:1px solid var(--line); background:rgba(255,255,255,.015); transition:.3s var(--ease); }
.education-card:hover { border-color:rgba(243,165,28,.3); transform:translateY(-3px); }
.education-year { color:var(--accent); font:600 .72rem "Space Grotesk",sans-serif; }
.education-card .exp-title { font-size:1rem; }
.education-card .exp-company { margin-top:.45rem; }

.reveal { opacity:0; transform:translateY(38px); transition:opacity .8s var(--ease),transform .8s var(--ease); }
.reveal.active { opacity:1; transform:none; }
.reveal .cert-badge-card,.reveal .experience-card { opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease),transform .7s var(--ease); }
.reveal.active .cert-badge-card,.reveal.active .experience-card { opacity:1; transform:none; }
.reveal.active .cert-badge-card:nth-child(n) { transition-delay:calc((var(--i, 1) - 1) * 45ms); }
.reveal.active .experience-card:nth-of-type(2){transition-delay:.06s}
.reveal.active .experience-card:nth-of-type(3){transition-delay:.12s}
.reveal.active .experience-card:nth-of-type(4){transition-delay:.18s}

footer { padding:4rem 1.5rem 3rem; border-top:1px solid var(--line); text-align:center; background:#050708; }
.footer-mark { margin:0 auto 1rem; width:38px;height:38px; }
footer p { color:#737d84; font:600 .62rem "Space Grotesk",sans-serif; letter-spacing:.17em; }
footer p span { color:var(--accent); margin:0 .35rem; }
footer small { display:block; margin-top:.55rem; color:#414a50; font-size:.65rem; }

@media (max-width:900px) {
    .nav-links { gap:0; }
    .nav-links a { padding:.6rem .45rem; font-size:.6rem; }
    .nav-links a span { display:none; }
    .profile-layout { grid-template-columns:1fr; gap:2rem; }
    .profile-detail { border-left:0; border-top:1px solid var(--line); padding:2rem 0 0; }
    .visual-grid { grid-template-columns:1fr 1fr; }
    .visual-card.visual-wide { min-height:330px; }
    .cert-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .education-grid { grid-template-columns:1fr; }
}
@media (max-width:700px) {
    .announcement-banner { justify-content:flex-start; white-space:nowrap; overflow:hidden; font-size:.57rem; }
    .announcement-location { display:none; }
    nav { top:34px; width:calc(100% - 18px); margin-top:.35rem; }
    .mobile-menu-btn { display:block; z-index:1002; }
    .nav-links { position:fixed; inset:0; width:100vw; height:100vh; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:.5rem; background:rgba(6,8,10,.97); backdrop-filter:blur(25px); transform:translateX(100%); transition:transform .4s var(--ease); }
    .nav-links.active { transform:none; }
    .nav-links a { font-size:.85rem; padding:.8rem 1.2rem; }
    .nav-links a span { display:inline; }
    .nav-download-btn { margin:.5rem 0 0; }
    .dropdown-content { position:static; margin-top:.4rem; box-shadow:none; }
    .hero { padding:9rem 1.2rem 6rem; min-height:100svh; }
    .hero h1 { font-size:clamp(3.3rem,17vw,6rem); }
    .hero-lead { font-size:1rem; }
    .contact-pills { margin-top:2rem; }
    main { width:min(calc(100% - 24px),var(--max)); padding-top:6rem; }
    section { margin-bottom:8rem; }
    .section-heading { grid-template-columns:38px 1fr; gap:.7rem; }
    .section-title { font-size:2.5rem; }
    /* Keep the desktop grid structures on mobile; scale the cards instead of stacking them. */
    .visual-grid { grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(.35rem,1.8vw,.8rem); }
    .visual-card,
    .visual-card.visual-wide,
    .visual-card:nth-child(2),
    .visual-card:nth-child(3) { min-height:clamp(150px,42vw,330px); }
    .visual-overlay { inset:auto clamp(.55rem,2.7vw,1.3rem) clamp(.55rem,2.7vw,1.25rem); }
    .visual-overlay h3 { font-size:clamp(.68rem,2.8vw,1.25rem); line-height:1.08; }
    .visual-overlay p { margin-top:.2rem; font-size:clamp(.46rem,1.7vw,.7rem); line-height:1.25; }
    .visual-overlay > span { font-size:clamp(.42rem,1.45vw,.6rem); }

    .cert-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .cert-badge-card { min-width:0; min-height:clamp(105px,30vw,175px); padding:clamp(.55rem,2.7vw,1.35rem); }
    .cert-badge-card::before { width:clamp(52px,16vw,90px); height:clamp(52px,16vw,90px); top:clamp(-50px,-8vw,-28px); right:clamp(-50px,-8vw,-28px); }
    .cert-index { top:clamp(.45rem,2vw,1rem); right:clamp(.45rem,2vw,1rem); font-size:clamp(.42rem,1.4vw,.58rem); }
    .cert-issuer { font-size:clamp(.42rem,1.45vw,.6rem); letter-spacing:clamp(.04em,.7vw,.13em); overflow-wrap:anywhere; }
    .cert-name { margin-top:clamp(.18rem,1vw,.35rem); font-size:clamp(.58rem,2.2vw,.98rem); line-height:1.18; overflow-wrap:anywhere; }
    .cert-meta { margin-top:clamp(.2rem,1vw,.5rem); font-size:clamp(.42rem,1.4vw,.62rem); }
    .exp-header { flex-direction:column; }
    .exp-date { white-space:normal; }
    .experience-card { padding:1.5rem 1.2rem 1.5rem 3.5rem; }
    .timeline-marker { top:1.5rem; left:-1px; width:33px;height:33px; }
    .timeline-line { left:15px; }
    .metric-row { gap:.5rem; }
    .metric-row strong { font-size:1.25rem; }
    .metric-row span { font-size:.54rem; }
}
@media (prefers-reduced-motion:reduce) {
    html { scroll-behavior:auto; }
    *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
    .reveal,.reveal .cert-badge-card,.reveal .experience-card { opacity:1!important; transform:none!important; }
}
@media print {
    body { background:#fff;color:#111; }
    .announcement-banner,nav,header.hero,main section,footer,.noise,.ambient { display:none!important; }
    #resume-print-container { display:block!important; }
}


/* ===== 2026 Visual Enhancement Layer ===== */
:root {
    --cursor-x: 50%;
    --cursor-y: 45%;
}

/* Coordinated page-load sequence */
.js .hero-content > *,
.js .hero-scroll,
.js .hero-grid,
.js .hero-orbit {
    opacity: 0;
}
.js.is-loaded .hero-content > * {
    animation: stagedHeroIn .72s var(--ease) both;
}
.js.is-loaded .hero-kicker { animation-delay:.06s; }
.js.is-loaded .hero-index { animation-delay:.13s; }
.js.is-loaded .hero h1 { animation-delay:.20s; }
.js.is-loaded .hero-rule { animation-delay:.30s; transform-origin:left center; }
.js.is-loaded .hero-lead { animation-delay:.35s; }
.js.is-loaded .hero-actions { animation-delay:.43s; }
.js.is-loaded .contact-pills { animation-delay:.50s; }
.js.is-loaded .hero-scroll { animation:fadeInUp .65s .62s var(--ease) both; }
.js.is-loaded .hero-grid { animation:gridFade 1.2s .05s var(--ease) both, gridDrift 22s 1.3s linear infinite alternate; }
.js.is-loaded .hero-orbit { animation:orbitIn 1.2s .18s var(--ease) both, orbitFloat 18s 1.4s ease-in-out infinite alternate; }
.js.is-loaded .orbit-two { animation-delay:.25s,1.5s; animation-duration:1.35s,24s; }
@keyframes stagedHeroIn { from { opacity:0; transform:translateY(20px); filter:blur(5px); } to { opacity:1; transform:none; filter:none; } }
@keyframes fadeInUp { from { opacity:0; transform:translate(-50%,14px); } to { opacity:1; transform:translate(-50%,0); } }
@keyframes gridFade { from { opacity:0; transform:scale(1.035); } to { opacity:1; transform:none; } }
@keyframes gridDrift { from { background-position:0 0,0 0; } to { background-position:40px 26px,40px 26px; } }
@keyframes orbitIn { from { opacity:0; transform:rotate(-18deg) scale(.92); } to { opacity:1; } }
@keyframes orbitFloat { from { translate:-1.5% -1%; } to { translate:1.5% 1%; } }
.hero-content { animation:none; }

/* Hero depth upgrade */
.hero::before {
    content:"";
    position:absolute;
    inset:-15%;
    z-index:-1;
    pointer-events:none;
    background:
        radial-gradient(circle 16rem at var(--cursor-x) var(--cursor-y), rgba(243,165,28,.095), transparent 72%),
        radial-gradient(circle at 80% 18%, rgba(57,118,168,.07), transparent 22rem);
    transition:background-position .15s linear;
}
.hero-grid { opacity:.82; background-size:72px 72px; }
.hero-grid::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(115deg,transparent 36%,rgba(243,165,28,.035) 49%,transparent 62%);
    transform:translateX(-42%);
    animation:heroSweep 14s 1.8s ease-in-out infinite;
}
@keyframes heroSweep { 0%,62% { transform:translateX(-42%); opacity:0; } 72% { opacity:1; } 100% { transform:translateX(42%); opacity:0; } }
.hero h1 { text-shadow:0 20px 55px rgba(0,0,0,.28); }
.hero h1 em { -webkit-text-stroke-color:rgba(244,246,247,.82); }
.hero-rule { box-shadow:0 0 22px rgba(243,165,28,.11); }

/* Navigation: active section + more compact scrolled state */
nav.scrolled {
    padding:.52rem .68rem .52rem .78rem;
    border-radius:12px;
    box-shadow:0 12px 34px rgba(0,0,0,.38);
}
nav.scrolled .logo-mark { width:27px; height:27px; }
nav.scrolled .nav-logo { font-size:.76rem; }
.nav-links .nav-link-item { position:relative; }
.nav-links .nav-link-item::after {
    content:"";
    position:absolute;
    left:.68rem;
    right:.68rem;
    bottom:.34rem;
    height:1px;
    background:var(--accent);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .28s var(--ease);
    box-shadow:0 0 10px rgba(243,165,28,.4);
}
.nav-links .nav-link-item.active { color:var(--text); background:rgba(243,165,28,.05); }
.nav-links .nav-link-item.active span { color:var(--accent); }
.nav-links .nav-link-item.active::after { transform:scaleX(1); }

/* Technical section transitions */
main section { position:relative; }
main section:not(:last-child)::after {
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-5.5rem;
    height:1px;
    background:linear-gradient(90deg,transparent,var(--line) 12%,var(--line) 88%,transparent);
}
.section-heading { position:relative; }
.section-heading::after {
    content:"";
    position:absolute;
    left:0;
    top:-1.2rem;
    width:38px;
    height:1px;
    background:var(--accent);
    box-shadow:0 0 12px rgba(243,165,28,.25);
}
.section-heading::before {
    content:"+";
    position:absolute;
    right:0;
    top:-1.65rem;
    color:#3e474d;
    font:500 .72rem "Space Grotesk",sans-serif;
}

/* Fieldwork: more cinematic presentation */
.visual-grid { perspective:1200px; }
.visual-card {
    isolation:isolate;
    border-color:rgba(255,255,255,.12);
    box-shadow:0 18px 45px rgba(0,0,0,.16);
    transition:border-color .45s var(--ease),box-shadow .45s var(--ease),transform .22s ease-out;
}
.visual-card::before {
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    pointer-events:none;
    background:radial-gradient(circle 220px at var(--mouse-x,50%) var(--mouse-y,50%),rgba(243,165,28,.12),transparent 70%);
    opacity:0;
    transition:opacity .35s ease;
}
.visual-card::after {
    background:linear-gradient(180deg,rgba(2,4,5,.02) 10%,rgba(4,6,7,.16) 44%,rgba(4,6,7,.96) 100%);
    transition:background .5s var(--ease);
}
.visual-card img { transform:scale(1.015); }
.visual-overlay {
    padding:.82rem .9rem .74rem;
    border:1px solid transparent;
    border-radius:8px;
    backdrop-filter:blur(0);
    transform:translateY(8px);
    transition:transform .45s var(--ease),background .45s ease,border-color .45s ease,backdrop-filter .45s ease;
}
.visual-card:hover {
    border-color:rgba(243,165,28,.28);
    box-shadow:0 24px 58px rgba(0,0,0,.32),0 0 0 1px rgba(243,165,28,.035) inset;
}
.visual-card:hover::before { opacity:1; }
.visual-card:hover img { transform:scale(1.085); filter:grayscale(.05) saturate(1.05) brightness(.72); }
.visual-card:hover .visual-overlay {
    transform:none;
    background:rgba(8,11,13,.34);
    border-color:rgba(255,255,255,.09);
    backdrop-filter:blur(10px);
}
.visual-overlay > span::before { content:"FIELD / "; color:#6c757b; }

/* Desktop pointer-reactive cards */
@media (hover:hover) and (pointer:fine) {
    .tilt-card {
        --rx:0deg;
        --ry:0deg;
        --lift:0px;
        transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--lift));
        transform-style:preserve-3d;
        will-change:transform;
        transition:transform .22s ease-out,border-color .3s ease,background .3s ease,box-shadow .3s ease;
        background-image:radial-gradient(circle 180px at var(--mouse-x,50%) var(--mouse-y,50%),rgba(243,165,28,.07),transparent 72%);
    }
    .tilt-card:hover { --lift:-3px; }
    .cert-badge-card.tilt-card:hover,
    .education-card.tilt-card:hover { transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(-3px); }
}

/* Reveal polish */
.reveal { filter:blur(2px); }
.reveal.active { filter:none; }
.reveal .visual-card,
.reveal .education-card { opacity:0; transform:translateY(16px); transition:opacity .68s var(--ease),transform .68s var(--ease); }
.reveal.active .visual-card,
.reveal.active .education-card { opacity:1; transform:none; }
.reveal.active .visual-card:nth-child(2),
.reveal.active .education-card:nth-child(2) { transition-delay:.07s; }
.reveal.active .visual-card:nth-child(3) { transition-delay:.12s; }
.reveal.active .visual-card:nth-child(4) { transition-delay:.17s; }

/* Mobile polish without collapsing the requested grids */
@media (max-width:700px) {
    nav.scrolled { padding:.48rem .58rem .48rem .7rem; }
    .nav-links .nav-link-item::after { left:1.2rem; right:1.2rem; bottom:.55rem; }
    .nav-links .nav-link-item.active { background:rgba(243,165,28,.07); }
    .hero { padding-inline:clamp(1rem,5vw,1.35rem); }
    .hero::before { background:radial-gradient(circle 12rem at 65% 36%,rgba(243,165,28,.085),transparent 74%); }
    .hero-grid { background-size:48px 48px; }
    .hero-orbit { opacity:.55!important; }
    .hero-actions { width:100%; }
    .primary-action,.secondary-action { justify-content:space-between; flex:1 1 150px; min-height:44px; }
    .pill { min-height:38px; }
    main section:not(:last-child)::after { bottom:-4rem; }
    section { margin-bottom:clamp(6.5rem,18vw,8rem); }
    .section-heading { margin-bottom:clamp(1.7rem,6vw,2.4rem); }
    .section-heading::after { top:-.8rem; width:25px; }
    .section-heading::before { top:-1.2rem; }
    .visual-card { box-shadow:0 10px 26px rgba(0,0,0,.18); }
    .visual-overlay { padding:clamp(.35rem,1.8vw,.72rem); transform:none; border-radius:6px; }
    .visual-overlay p { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
    .cert-badge-card { touch-action:manipulation; }
    .cert-badge-card:hover,.education-card:hover,.experience-card:hover { transform:none; }
    .experience-card { border-radius:0; }
}
@media (max-width:480px) {
    .announcement-banner { gap:.45rem; padding-inline:.7rem; }
    .announcement-banner span:not(.status-dot):not(.announcement-location) { text-overflow:ellipsis; overflow:hidden; }
    .nav-logo > span:last-child { display:none; }
    .hero-kicker { font-size:.58rem; letter-spacing:.1em; }
    .hero-index { margin-top:1.5rem; font-size:.5rem; letter-spacing:.13em; }
    .hero h1 { font-size:clamp(3.15rem,18vw,5.3rem); }
    .hero-scroll { display:none; }
    .contact-pills { gap:.35rem; }
    .pill { font-size:.6rem; padding:.42rem .52rem; }
    .section-title { font-size:clamp(2rem,10vw,2.6rem); }
    .profile-layout { padding:2rem 0; }
    .profile-statement p { font-size:clamp(1.15rem,5.8vw,1.55rem); }
    .profile-detail { font-size:.79rem; line-height:1.7; }
    .visual-grid { gap:.3rem; }
    .visual-card,.visual-card.visual-wide,.visual-card:nth-child(2),.visual-card:nth-child(3) { min-height:clamp(138px,41vw,200px); }
    .visual-overlay h3 { font-size:clamp(.6rem,2.75vw,.8rem); }
    .visual-overlay p { font-size:clamp(.42rem,1.75vw,.55rem); }
    .cert-badge-card { min-height:clamp(98px,28vw,122px); padding:.48rem; }
    .cert-name { font-size:clamp(.52rem,2.12vw,.68rem); }
    .cert-issuer { font-size:clamp(.38rem,1.35vw,.48rem); }
    .cert-index { font-size:.38rem; }
    .metric-row { margin-top:1.7rem; }
}

@media (prefers-reduced-motion:reduce) {
    .js .hero-content > *, .js .hero-scroll, .js .hero-grid, .js .hero-orbit { opacity:1!important; animation:none!important; filter:none!important; transform:none!important; }
    .hero-grid::after { animation:none!important; display:none; }
    .tilt-card { transform:none!important; }
    .reveal { filter:none!important; }
}


/* Professional References */
.references-section { position: relative; }

.references-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    background: var(--line);
    border: 1px solid var(--line);
    overflow: hidden;
}

.reference-card {
    position: relative;
    min-width: 0;
    min-height: 220px;
    padding: 1.35rem;
    background: linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.008)), var(--bg);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
    transition: transform .35s var(--ease), background .35s var(--ease);
}

.reference-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 25%, rgba(243,165,28,.09), transparent 38%);
    opacity: 0;
    transition: opacity .3s ease;
    pointer-events: none;
}

.reference-card::after {
    content: "";
    position: absolute;
    width: 84px;
    height: 84px;
    right: -44px;
    top: -44px;
    border: 1px solid rgba(243,165,28,.10);
    transform: rotate(45deg);
    transition: transform .4s var(--ease), border-color .4s var(--ease);
    pointer-events: none;
}

.reference-card:hover {
    transform: translateY(-2px);
    background: linear-gradient(180deg, rgba(243,165,28,.035), rgba(255,255,255,.01)), var(--bg);
}

.reference-card:hover::before { opacity: 1; }
.reference-card:hover::after {
    transform: rotate(45deg) scale(1.18);
    border-color: rgba(243,165,28,.22);
}

.reference-index {
    position: absolute;
    top: 1rem;
    left: 1.1rem;
    color: var(--accent);
    font: 600 .62rem/1 "Space Grotesk", sans-serif;
    letter-spacing: .12em;
}

.reference-card h3 {
    position: relative;
    z-index: 1;
    margin: 0;
    font: 500 clamp(1rem, 1.5vw, 1.25rem)/1.1 "Space Grotesk", sans-serif;
    letter-spacing: -.025em;
}

.reference-role {
    position: relative;
    z-index: 1;
    margin: .5rem 0 0;
    color: var(--soft);
    font-size: .78rem;
}

.reference-company {
    position: relative;
    z-index: 1;
    margin: .2rem 0 0;
    color: #6f787d;
    font-size: .66rem;
    text-transform: uppercase;
    letter-spacing: .12em;
}

.reference-phone {
    position: relative;
    z-index: 1;
    display: inline-flex;
    width: fit-content;
    margin-top: 1rem;
    color: var(--accent);
    text-decoration: none;
    font: 600 .72rem/1 "Space Grotesk", sans-serif;
    letter-spacing: .04em;
}

.reference-phone:hover { opacity: .72; }

@media (max-width: 900px) {
    .references-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .reference-card {
        min-height: clamp(150px, 24vw, 210px);
        padding: clamp(.6rem, 2vw, 1.15rem);
    }
    .reference-index {
        top: clamp(.55rem, 1.8vw, 1rem);
        left: clamp(.55rem, 1.8vw, 1.1rem);
        font-size: clamp(.42rem, 1.1vw, .62rem);
    }
    .reference-card h3 { font-size: clamp(.72rem, 2vw, 1rem); }
    .reference-role { font-size: clamp(.5rem, 1.45vw, .72rem); line-height: 1.2; }
    .reference-company { font-size: clamp(.4rem, 1.08vw, .58rem); }
    .reference-phone {
        margin-top: clamp(.45rem, 1.3vw, .8rem);
        font-size: clamp(.48rem, 1.25vw, .68rem);
        white-space: nowrap;
    }
}

@media (max-width: 520px) {
    .references-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .reference-card { min-height: 132px; padding: .48rem; }
    .reference-card::after {
        width: 54px; height: 54px; right: -30px; top: -30px;
    }
    .reference-index { top: .42rem; left: .44rem; font-size: .36rem; }
    .reference-card h3 { font-size: clamp(.58rem, 2.55vw, .72rem); line-height: 1.05; }
    .reference-role { font-size: clamp(.41rem, 1.85vw, .52rem); }
    .reference-company { font-size: clamp(.34rem, 1.45vw, .44rem); letter-spacing: .08em; }
    .reference-phone { margin-top: .4rem; font-size: clamp(.38rem, 1.65vw, .48rem); letter-spacing: 0; }
}


/* ===== 2026 Refined Motion & Depth Pass ===== */
:root {
    --scroll-progress: 0%;
    --ambient-shift: 0px;
}

/* Minimal page progress indicator: useful, but visually almost invisible at rest. */
.page-progress {
    position: fixed;
    top: 33px;
    left: 0;
    right: 0;
    height: 1px;
    z-index: 1005;
    pointer-events: none;
    background: rgba(255,255,255,.035);
}
.page-progress i {
    display: block;
    width: var(--scroll-progress);
    height: 100%;
    background: linear-gradient(90deg,var(--accent),var(--accent-bright));
    box-shadow: 0 0 13px rgba(243,165,28,.48);
    transition: width .08s linear;
}

/* Ambient depth follows the document very slightly. */
.ambient-one { transform: translate3d(0, calc(var(--ambient-shift) * .16), 0); }
.ambient-two { transform: translate3d(0, calc(var(--ambient-shift) * -.11), 0); }

/* CTA micro-interactions. */
.primary-action span,
.secondary-action span { transition: transform .28s var(--ease); }
.primary-action:hover span { transform: translateY(3px); }
.secondary-action:hover span { transform: translate(3px,-2px); }
.pill { position:relative; overflow:hidden; }
.pill::after {
    content:"";
    position:absolute;
    inset:auto 12% 0;
    height:1px;
    background:linear-gradient(90deg,transparent,var(--accent),transparent);
    transform:scaleX(0);
    transition:transform .32s var(--ease);
}
.pill:hover::after { transform:scaleX(1); }

/* Section headings draw in instead of introducing extra floating words. */
.reveal .section-heading::after {
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .65s .12s var(--ease);
}
.reveal.active .section-heading::after { transform: scaleX(1); }
.reveal .section-number,
.reveal .eyebrow {
    opacity:0;
    transform:translateY(7px);
    transition:opacity .5s .08s ease, transform .5s .08s var(--ease);
}
.reveal.active .section-number,
.reveal.active .eyebrow { opacity:1; transform:none; }

/* Experience timeline gets a scroll-driven accent line and active markers. */
.timeline-line {
    overflow: visible;
    background: rgba(255,255,255,.065);
}
.timeline-line::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,var(--accent),rgba(243,165,28,.32));
    box-shadow:0 0 12px rgba(243,165,28,.22);
    transform:scaleY(var(--timeline-progress,0));
    transform-origin:top center;
    transition:transform .12s linear;
}
.timeline-marker {
    transition:border-color .4s ease, color .4s ease, box-shadow .4s ease, background .4s ease;
}
.experience-card.in-view .timeline-marker {
    color:var(--accent-bright);
    border-color:rgba(243,165,28,.75);
    background:#10110e;
    box-shadow:0 0 0 3px rgba(243,165,28,.05),0 0 20px rgba(243,165,28,.14);
}
.experience-card::after {
    content:"";
    position:absolute;
    left:-1px;
    top:18%;
    bottom:18%;
    width:1px;
    background:linear-gradient(transparent,var(--accent),transparent);
    opacity:0;
    transform:scaleY(.4);
    transition:opacity .35s ease,transform .45s var(--ease);
}
.experience-card:hover::after,
.experience-card.in-view::after { opacity:.52; transform:scaleY(1); }

/* Soft moving light on the informational cards. */
.cert-badge-card,
.education-card,
.reference-card { isolation:isolate; }
.cert-badge-card::after,
.education-card::after,
.reference-card .reference-sheen {
    pointer-events:none;
}
@media (hover:hover) and (pointer:fine) {
    .cert-badge-card,
    .education-card,
    .reference-card {
        background-image:radial-gradient(circle 170px at var(--mouse-x,50%) var(--mouse-y,50%),rgba(243,165,28,.055),transparent 72%);
    }
}

/* References now enter with the same rhythm as the rest of the page. */
.reveal .reference-card {
    opacity:0;
    transform:translateY(16px);
    transition:opacity .65s var(--ease),transform .65s var(--ease),background .35s var(--ease);
}
.reveal.active .reference-card { opacity:1; transform:none; }
.reveal.active .reference-card:nth-child(2) { transition-delay:.06s; }
.reveal.active .reference-card:nth-child(3) { transition-delay:.11s; }
.reveal.active .reference-card:nth-child(4) { transition-delay:.16s; }

/* Better focus states for keyboard users. */
a:focus-visible, button:focus-visible {
    outline:1px solid var(--accent);
    outline-offset:4px;
}

/* Tiny breathing motion on the availability indicator, without flashing. */
.status-dot { animation:statusBreath 3.2s ease-in-out infinite; }
@keyframes statusBreath {
    0%,100% { box-shadow:0 0 7px rgba(99,210,139,.52); }
    50% { box-shadow:0 0 14px rgba(99,210,139,.82); }
}

@media (max-width:700px) {
    .page-progress { top:33px; }
    .ambient-one,.ambient-two { transform:none; }
    .experience-card::after { display:none; }
}

@media (prefers-reduced-motion:reduce) {
    .page-progress i { transition:none!important; }
    .ambient-one,.ambient-two { transform:none!important; }
    .status-dot { animation:none!important; }
    .reveal .section-heading::after,
    .reveal .section-number,.reveal .eyebrow,
    .reveal .reference-card { transition:none!important; opacity:1!important; transform:none!important; }
    .timeline-line::after { transition:none!important; }
}


/* Recruiter additions */
.availability-panel{width:min(1180px,calc(100% - 2rem));margin:0 auto 3rem;display:grid;grid-template-columns:.9fr 2.1fr;border:1px solid var(--line);background:rgba(255,255,255,.012)}
.availability-status{display:flex;align-items:center;gap:.9rem;padding:1rem 1.1rem;border-right:1px solid var(--line)}
.status-dot{width:9px;height:9px;border-radius:50%;background:#38d67a;box-shadow:0 0 0 5px rgba(56,214,122,.08),0 0 18px rgba(56,214,122,.35)}
.availability-status small{display:block;color:#727d83;font:600 .55rem/1 "Space Grotesk",sans-serif;letter-spacing:.15em;margin-bottom:.3rem}
.availability-status strong{font:500 .9rem/1.2 "Space Grotesk",sans-serif}
.availability-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.availability-meta div{padding:.85rem 1rem;border-right:1px solid var(--line)}
.availability-meta div:last-child{border-right:0}
.availability-meta span{display:block;color:#687279;font-size:.56rem;text-transform:uppercase;letter-spacing:.12em}
.availability-meta strong{display:block;margin-top:.3rem;color:var(--soft);font-size:.7rem;font-weight:500}

.competency-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);background:var(--line);gap:1px}
.competency-card{position:relative;min-height:170px;padding:1.1rem;background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.006)),var(--bg);overflow:hidden;transition:.3s var(--ease)}
.competency-card:hover{transform:translateY(-2px);background:linear-gradient(180deg,rgba(243,165,28,.035),rgba(255,255,255,.008)),var(--bg)}
.competency-card>span{color:var(--accent);font:600 .55rem/1 "Space Grotesk",sans-serif;letter-spacing:.12em}
.competency-card h3{margin:.75rem 0 .45rem;font:500 .98rem/1.1 "Space Grotesk",sans-serif;letter-spacing:-.02em}
.competency-card p{margin:0;color:#7b858b;font-size:.68rem;line-height:1.55}

.experience-toggle{width:100%;margin-top:1rem;padding:.75rem 0 0;border:0;border-top:1px solid var(--line);background:none;color:var(--soft);display:flex;justify-content:space-between;align-items:center;cursor:pointer;font:500 .64rem/1 "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase}
.experience-toggle:hover{color:var(--accent)}
.toggle-icon{font-size:1rem;transition:transform .25s ease}
.experience-toggle[aria-expanded="true"] .toggle-icon{transform:rotate(45deg)}
.experience-extra{padding:.8rem 0 0;color:#7d878d;font-size:.7rem;line-height:1.6}

.contact-cta{width:min(1180px,calc(100% - 2rem));margin:5rem auto 2rem;display:grid;grid-template-columns:1.7fr .7fr;border:1px solid var(--line);background:radial-gradient(circle at 82% 30%,rgba(243,165,28,.07),transparent 27%),rgba(255,255,255,.012)}
.contact-cta-copy{padding:clamp(1.4rem,4vw,3.25rem)}
.contact-cta h2{margin:.3rem 0 .7rem;font:500 clamp(1.8rem,4vw,3.4rem)/.98 "Space Grotesk",sans-serif;letter-spacing:-.045em}
.contact-cta p{max-width:650px;color:#7b858b;font-size:.78rem;line-height:1.65}
.contact-cta-actions{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.35rem}
.cta-button{appearance:none;border:1px solid var(--line);background:rgba(255,255,255,.02);color:var(--soft);text-decoration:none;padding:.72rem .9rem;cursor:pointer;font:600 .6rem/1 "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;transition:.25s ease}
.cta-button:hover{border-color:rgba(243,165,28,.45);color:#fff;transform:translateY(-1px)}
.cta-primary{background:var(--accent);color:#111;border-color:var(--accent)}
.qr-panel{border-left:1px solid var(--line);padding:1.3rem;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.7rem;text-align:center}
.qr-panel img{width:min(160px,75%);aspect-ratio:1;background:#fff;padding:8px;border-radius:4px}
.qr-label{color:var(--accent);font:600 .55rem/1 "Space Grotesk",sans-serif;letter-spacing:.13em}
.qr-panel span:last-child{color:#707a80;font-size:.6rem}

body.recruiter-mode{--bg:#f5f3ed;--soft:#1b1e21;--line:#d8d5cd;--accent:#a85e00;color:#17191b;background:#f5f3ed}
body.recruiter-mode .competency-card,body.recruiter-mode .reference-card,body.recruiter-mode .cert-badge-card,body.recruiter-mode .education-card,body.recruiter-mode .exp-card,body.recruiter-mode .experience-item{background:#fff!important;box-shadow:none!important}

@media(max-width:800px){
.availability-panel{grid-template-columns:1fr}.availability-status{border-right:0;border-bottom:1px solid var(--line)}
.competency-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.contact-cta{grid-template-columns:1fr}.qr-panel{border-left:0;border-top:1px solid var(--line)}
}
@media(max-width:520px){
.availability-panel,.contact-cta{width:calc(100% - 1rem)}
.availability-meta strong{font-size:.54rem}.availability-meta span{font-size:.44rem}
.competency-card{min-height:145px;padding:.7rem}.competency-card h3{font-size:.72rem}.competency-card p{font-size:.52rem}
}
@media print{
*{animation:none!important;transition:none!important}
body{background:#fff!important;color:#111!important}
nav,.announcement-banner,.scroll-progress,.mobile-menu,.contact-cta-actions,.experience-toggle{display:none!important}
.experience-extra[hidden]{display:block!important}
.hero,main section,.availability-panel,.contact-cta{background:#fff!important;box-shadow:none!important}
.visual-card,.cert-badge-card,.reference-card,.competency-card,.education-card,.exp-card,.experience-item{break-inside:avoid;background:#fff!important;color:#111!important;box-shadow:none!important}
.qr-panel img{width:110px!important}
a{color:#111!important;text-decoration:none!important}
}