/* ─── AEDev CV — One‑Pager, Clean, ATS‑Friendly ───────────────────────── */

:root{
    --ink:#222;
    --ink-soft:#444;
    --ink-muted:#666;
    --brand:#4c6ef5;
    --bg-soft:#f8f9fa;
    --card-a:#f0f0f5;
    --card-b:#e4e6eb;
    --maxw:820px;
}

/* ─── Base layout & type ──────────────────────────────────────────────── */
*{box-sizing:border-box}
html,body{height:100%}
body{
    font-family:'Segoe UI','Open Sans',system-ui,-apple-system,sans-serif;
    font-size:10.5pt;
    color:var(--ink);
    background:#fff;
    margin:0;
    padding:2.2cm 2.2cm 2.0cm;
    line-height:1.4;
}
.resume{max-width:var(--maxw); margin:0 auto}

/* ─── Web-only top bar ───────────────────────────────────────────────── */
.top-bar{
    background:#444; color:#fff;
    padding:.5em 2em; font-size:.9rem;
    display:flex; justify-content:center; align-items:center;
    margin:0 auto 1.2em; max-width:var(--maxw);
}
.top-bar-content{display:flex; gap:1em; align-items:center; flex-wrap:wrap}
.top-bar button,.top-bar a{
    background:transparent; color:#fff; border:1px solid #fff;
    padding:.3em .8em; font-size:.9em; border-radius:4px;
    cursor:pointer; text-decoration:none;
}
.top-bar button:hover,.top-bar a:hover{background:#666}

/* ─── Header ─────────────────────────────────────────────────────────── */
.header{
    background:linear-gradient(to right,var(--card-a),var(--card-b));
    border:1px solid #ccc; border-radius:6px;
    padding:.6rem 1.2rem;
    display:grid; grid-template-areas:"title qr" "contact links";
    grid-template-columns:1fr auto; gap:.6rem 1.2rem; align-items:center;
}
.header-center-overlay{grid-area:title; text-align:left; max-width:100%}
.header-center-overlay h1{font-size:30pt; line-height:1; margin:0; font-weight:700}
#section-title{font-size:11pt; margin:.15rem 0 0; color:var(--ink-soft); font-weight:500}

/* QR box fully centered */
.header-right{
    grid-area:qr;
    background:#fff; border-radius:8px; padding:.4rem;
    box-shadow:0 0 6px rgba(0,0,0,.05);
    display:flex; align-items:center; justify-content:center;
    min-width:90px; min-height:90px;
}
img.qr{width:70px; height:70px; object-fit:contain; border-radius:4px}

.header-contact-row{
    grid-area:contact; font-size:9pt; color:#333;
    display:flex; flex-wrap:wrap; gap:.8rem; align-items:center;
}
.header-link-row{
    grid-area:links; display:flex; flex-wrap:wrap; justify-content:flex-end;
    gap:.8rem; font-size:9pt;
}
.header-link-row a,.header-contact-row a{color:#004080; text-decoration:none}
.header-link-row a:hover,.header-contact-row a:hover{text-decoration:underline}

/* ─── Sections ───────────────────────────────────────────────────────── */
section{margin:.8em 0}
h2{
    border-left:4px solid var(--brand); background:var(--bg-soft);
    padding:.35em .75em; margin:.6em 0 .6em;
    font-weight:600; color:#2e2e2e; font-size:13.5pt;
    display:flex; align-items:center; gap:.5em;
}
h2 i{color:var(--brand)}

/* ─── Skills ─────────────────────────────────────────────────────────── */
ul.skills{
    list-style:none; padding:0;
    display:grid; grid-template-columns:1fr 1fr; gap:.35em 1.2em;
}
ul.skills li{display:flex; align-items:flex-start; gap:.5em}
ul.skills li i{flex-shrink:0; margin-top:.15em; color:#666}
ul.skills li strong{font-weight:700; font-size:.95em; color:#333}

/* ─── Education ──────────────────────────────────────────────────────── */
.education-grid{display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-items:start; margin-top:.3em}
.education-left,.education-right{display:flex; flex-direction:column; gap:.25rem}
.education-grid div{margin:0; padding:0; font-size:10.5pt; line-height:1.35}
@media (max-width:640px){ .education-grid{grid-template-columns:1fr} }

/* ─── Experience (structured) ────────────────────────────────────────── */
.experience .xp{margin:0 0 .5em; page-break-inside:avoid}
.experience .xp h3{margin:0 0 .2em; font-size:13pt; font-weight:700}
.experience .meta{font-size:9.5pt; color:var(--ink-muted); margin:0 0 .25em}
.experience ul{margin:.1em 0 .3em 1.1em; padding:0; list-style:disc}
.experience li{margin:0 0 .15em}
/* compact last (Personal Projects) line */
.experience .xp:last-child ul{margin:.05em 0 0 1.1em}
.experience .xp:last-child li{margin:0}
.experience .xp em{font-style:italic}

/* ─── Utility (hidden ATS keywords) ──────────────────────────────────── */
.visually-hidden{
    position:absolute!important; height:1px; width:1px; overflow:hidden;
    clip:rect(1px,1px,1px,1px); white-space:nowrap;
}

/* ─── Icon color consistency ─────────────────────────────────────────── */
i.fa-solid,i.fab{color:#666; margin-right:6px}

/* ─── Print / PDF ────────────────────────────────────────────────────── */
@page{margin:1.1cm}
@media print{
    body{
        padding:.2cm; font-size:10pt; color:#000;
        -webkit-print-color-adjust:exact!important; print-color-adjust:exact!important; background:#fff!important;
    }
    .top-bar,#lang-toggle,#btn-download{display:none!important}
    a{color:#000; text-decoration:none}

    .header{
        grid-template-areas:"title qr" "contact links";
        background:#eef0f5!important; border:1px solid #ccc!important; border-radius:6px!important;
        padding:.7rem!important; margin-bottom:.9rem!important; box-shadow:none!important;
    }
    .header-right{
        padding:.3rem!important; border-radius:6px!important;
        min-width:80px!important; min-height:80px!important;
    }
    img.qr{filter:grayscale(100%); width:64px!important; height:64px!important}

    .header-center-overlay h1{font-size:22pt!important; margin:0 0 .1rem!important}
    #section-title{font-size:10.5pt!important}

    h2{background:none!important; border-left:3px solid #000!important; color:#000!important}
    i.fa-solid,i.fab{color:#000!important}

    /* tighter spacing for lists in print */
    ul.skills{gap:.25em .9em}
    .experience .xp h3{font-size:12.5pt}
    .experience .meta{font-size:9pt}
    .experience ul{margin:.05em 0 .25em 1.1em}
    .experience li{margin:0}

    /* auto-show phone in print */
    .reveal-phone{display:none!important}
    .phone-wrapper::after{content:'(418) 520-0999'; display:inline!important; margin-left:.3em}
}
/* Show ATS keywords only when printing, as a tiny muted line */
@media print {
    #ats{
        position: static !important;
        clip: auto !important;
        height: auto !important;
        width: auto !important;
        white-space: normal !important;
        font-size: 5pt !important;
        line-height: 1.1 !important;
        color: #000 !important;   /* ensure it exists in text layer */
        opacity: .6 !important;
        margin-top: .2rem !important;
    }
}
/* Keep it invisible on screen */
#ats{ position:absolute!important; height:1px; width:1px; overflow:hidden; clip:rect(1px,1px,1px,1px) }