:root{
    --bg:#33332d;
    --card:#403f38;
    --text:#ffffff;
    --muted:#c7c6bf;
    --accent:#e68c3a;
    --line:#514f45;
    --font-mono:'IBM Plex Mono',Consolas,monospace;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:'IBM Plex Sans',Inter,sans-serif;
    background:var(--bg);
    color:var(--text);
    line-height:1.7;
}

.container{
    width:min(1150px,92%);
    margin:auto;
}

header{
    border-bottom:1px solid var(--line);
}

header .container{
    padding:15px 0;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
}

.logo{
    font-size:1rem;
    font-weight:700;
    letter-spacing:.5px;
    color:var(--text);
}

nav{
    display:flex;
    gap:24px;
    justify-content:space-between;
    align-items:center;
}

nav a{
    color:var(--muted);
    text-decoration:none;
}

nav a:hover{
    color:var(--text);
}

.nav-highlight{
    color:var(--accent);
    font-weight:700;
    padding:4px 10px;
    border:1px solid var(--accent);
}

.nav-highlight:hover{
    background:rgba(230,140,58,.28);
    color:var(--accent);
}

.lang-btn{
    background:none;
    border:1px solid transparent;
    font-size:1.2rem;
    cursor:pointer;
    padding:2px 4px;
    line-height:1;
    border-radius:4px;
    opacity:.55;
    transition:opacity .2s, border-color .2s;
}

.lang-btn:hover{
    opacity:.85;
}

.lang-btn.active{
    opacity:1;
    border-color:var(--accent);
}

.intro{
    padding:64px 0 48px;
    display:flex;
    align-items:center;
    gap:28px;
}

.intro-photo{
    flex-shrink:0;
    width:110px;
    height:110px;
    border-radius:50%;
    object-fit:cover;
    border:3px solid var(--accent);
}

.intro h1{
    font-size:1.7rem;
    font-weight:700;
    margin-bottom:10px;
}

.intro p{
    color:var(--muted);
    max-width:600px;
    font-size:.95rem;
}

.btn-row{
    display:flex;
    gap:14px;
    margin-top:22px;
    flex-wrap:wrap;
}

.btn{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:12px 22px;
    border:2px solid var(--text);
    border-radius:0;
    font-family:var(--font-mono);
    font-weight:700;
    font-size:.92rem;
    color:var(--text);
    background:transparent;
    text-decoration:none;
    transition:background .15s ease, color .15s ease;
}

.btn:hover{
    background:var(--text);
    color:var(--bg);
}

.btn-accent{
    border-color:var(--accent);
    color:var(--accent);
}

.btn-accent:hover{
    background:var(--accent);
    color:var(--bg);
}

@media(max-width:640px){
    .intro{
        flex-direction:column;
        align-items:flex-start;
        text-align:left;
    }
}

.about{
    padding:48px 0 60px;
    border-top:1px solid var(--line);
}

.about p{
    color:var(--muted);
    max-width:680px;
    font-size:.95rem;
    margin-bottom:14px;
}

.about p:last-child{
    margin-bottom:0;
}

.skills{
    padding:0 0 60px;
    border-top:1px solid var(--line);
    padding-top:60px;
}

.skill-bars{
    display:flex;
    flex-direction:column;
    gap:16px;
    max-width:520px;
    margin-bottom:28px;
}

.skill-bar-head{
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    margin-bottom:6px;
}

.skill-bar-name{
    font-family:var(--font-mono);
    font-size:.88rem;
    font-weight:600;
}

.skill-bar-pct{
    font-family:var(--font-mono);
    font-size:.78rem;
    font-weight:600;
    color:var(--accent);
}

.skill-bar-track{
    height:6px;
    background:var(--card);
    border:1px solid var(--line);
    border-radius:4px;
    overflow:hidden;
}

.skill-bar-fill{
    height:100%;
    width:0;
    background:var(--accent);
    border-radius:4px;
    transition:width 1s ease;
}

.skill-tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.skill-tag{
    display:inline-block;
    padding:6px 14px;
    background:var(--card);
    border:1px solid var(--line);
    border-radius:6px;
    font-family:var(--font-mono);
    font-size:.8rem;
    color:var(--text);
    transition:border-color .2s;
}

.skill-tag:hover{
    border-color:var(--accent);
}

.growth{
    padding:0 0 60px;
}

.growth-text{
    color:var(--muted);
    max-width:600px;
    font-size:.9rem;
    margin-bottom:12px;
}

.skill-tag.growth-tag{
    border-style:dashed;
    color:var(--muted);
}

.skill-tag.growth-tag:hover{
    border-color:var(--accent);
    color:var(--text);
}

.content{
    padding:60px 0;
    border-top:1px solid var(--line);
}

.section-title{
    margin-bottom:24px;
    color:var(--muted);
    font-family:var(--font-mono);
    font-size:.85rem;
    letter-spacing:2px;
    text-transform:uppercase;
}

.item{
    margin-bottom:28px;
}

.item a{
    text-decoration:none;
    color:var(--text);
    font-size:1.15rem;
    font-weight:600;
}

.item a:hover{
    color:var(--accent);
}

.tech-stack{
    display:block;
    font-family:var(--font-mono);
    color:var(--accent);
    font-size:.78rem;
    font-weight:500;
    margin-top:3px;
}

.item p{
    color:var(--muted);
    margin-top:4px;
    font-size:.9rem;
}

.case-study-link{
    display:inline-block;
    margin-top:8px;
    color:var(--accent);
    font-size:.82rem;
    font-weight:600;
    text-decoration:none;
}

.case-study-link:hover{
    color:var(--text);
}

.page-header{
    padding:48px 0 40px;
}

.page-header .back-link{
    display:inline-block;
    color:var(--muted);
    font-size:.88rem;
    text-decoration:none;
    margin-bottom:18px;
}

.page-header .back-link:hover{
    color:var(--accent);
}

.page-header h1{
    font-size:1.8rem;
    font-weight:700;
    margin-bottom:10px;
}

.page-header p{
    color:var(--muted);
    max-width:640px;
    font-size:.95rem;
}

.project-detail{
    border-top:1px solid var(--line);
    padding:48px 0;
}

.project-detail-head{
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:6px;
}

.project-detail-head h2{
    font-size:1.35rem;
    font-weight:700;
}

.project-status{
    font-family:var(--font-mono);
    font-size:.75rem;
    color:var(--muted);
    border:1px solid var(--line);
    padding:3px 10px;
    white-space:nowrap;
}

.project-detail p{
    color:var(--muted);
    max-width:720px;
    font-size:.95rem;
    margin-top:14px;
}

.project-feature-list{
    list-style:none;
    padding:0;
    margin-top:14px;
    max-width:720px;
}

.project-feature-list li{
    position:relative;
    padding-left:20px;
    margin-bottom:6px;
    color:var(--muted);
    font-size:.9rem;
    line-height:1.5;
}

.project-feature-list li::before{
    content:"›";
    position:absolute;
    left:0;
    color:var(--accent);
    font-weight:700;
}

.project-links{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:20px;
}

.project-links .btn{
    padding:9px 18px;
    font-size:.85rem;
}

footer{
    border-top:1px solid var(--line);
    padding:40px 0;
    color:var(--muted);
    text-align: center;
}

.courses{
    border-top:1px solid var(--line);
    padding:70px 0;
}

.cards{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
    gap:20px;
}

.card{
    display:flex;
    flex-direction:column;
    background:var(--card);
    border-radius:10px;
    text-decoration:none;
    color:var(--text);
    border:1px solid var(--line);
    overflow:hidden;
    transition:border-color .2s, transform .2s;
}

.card:hover{
    border-color:var(--accent);
    transform:translateY(-4px);
}

.card-img{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:28px 20px 16px;
}

.card-img img{
    width:48px;
    height:48px;
    object-fit:contain;
}

.card-hint{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(20,19,17,.92);
    color:var(--accent);
    font-size:.8rem;
    font-weight:600;
    letter-spacing:.5px;
    opacity:0;
    transition:opacity .25s;
}

.card:hover .card-hint{
    opacity:1;
}

.card-body{
    padding:0 16px 20px;
}

.card-body strong{
    display:block;
    font-size:.9rem;
    font-weight:600;
    line-height:1.4;
}

.card-institution{
    display:block;
    font-family:var(--font-mono);
    color:var(--accent);
    font-size:.75rem;
    font-weight:500;
    margin-top:3px;
}

.card-body p{
    color:var(--muted);
    font-size:.8rem;
    margin-top:4px;
    line-height:1.4;
}

.experience{
    border-top:1px solid var(--line);
    padding:70px 0;
    scroll-margin-top:24px;
}

.exp-item{
    margin-bottom:32px;
}

.exp-head{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

.exp-head h3{
    font-size:1.05rem;
    font-weight:600;
}

.exp-period{
    font-family:var(--font-mono);
    color:var(--muted);
    font-size:.85rem;
}

.exp-role{
    color:var(--accent);
    font-size:.9rem;
    font-weight:600;
    margin-top:2px;
}

.exp-desc{
    color:var(--muted);
    font-size:.9rem;
    margin-top:6px;
    max-width:600px;
    list-style:none;
    padding:0;
}

.exp-desc li{
    position:relative;
    padding-left:14px;
    margin-bottom:4px;
    line-height:1.5;
}

.exp-desc li::before{
    content:"–";
    position:absolute;
    left:0;
    color:var(--accent);
}

.exp-more{
    margin-top:12px;
}

.exp-more summary{
    cursor:pointer;
    list-style:none;
    font-family:var(--font-mono);
    font-size:.82rem;
    font-weight:600;
    color:var(--accent);
    display:inline-flex;
    align-items:center;
    gap:6px;
}

.exp-more summary::-webkit-details-marker{
    display:none;
}

.exp-more summary::marker{
    content:"";
}

.exp-more summary:hover{
    color:var(--text);
}

.exp-more .chevron{
    display:inline-block;
    transition:transform .2s ease;
}

.exp-more[open] .chevron{
    transform:rotate(90deg);
}

.exp-more-body{
    margin-top:14px;
    padding:18px 20px;
    background:var(--card);
    border:1px solid var(--line);
    max-width:640px;
}

.exp-more-body p{
    color:var(--muted);
    font-size:.9rem;
    margin-bottom:14px;
}

.exp-highlight-title{
    font-family:var(--font-mono);
    font-size:.75rem;
    letter-spacing:1.5px;
    text-transform:uppercase;
    color:var(--muted);
    margin-bottom:10px;
}

.exp-highlight-list{
    list-style:none;
    padding:0;
    margin:0;
}

.exp-highlight-list li{
    position:relative;
    padding-left:18px;
    margin-bottom:7px;
    font-size:.88rem;
    color:var(--muted);
    line-height:1.5;
}

.exp-highlight-list li::before{
    content:"–";
    position:absolute;
    left:0;
    color:var(--accent);
}

.exp-highlight-list li.placeholder{
    color:var(--accent);
    font-style:italic;
    opacity:.9;
}

.exp-highlight-list li.placeholder::before{
    content:"✎";
}

.blog-teaser{
    border-top:1px solid var(--line);
    padding:40px 0;
}

.blog-teaser-text{
    color:var(--muted);
    font-size:.9rem;
    max-width:500px;
    margin-bottom:10px;
}

.blog-teaser-link{
    color:var(--accent);
    text-decoration:none;
    font-size:.9rem;
    font-weight:600;
}

.blog-teaser-link:hover{
    color:var(--text);
}

.author{
    border-top:1px solid var(--line);
    padding:70px 0;
    text-align:center;
}

.author img{
    width:90px;
    height:90px;
    border-radius:50%;
    object-fit:cover;
    margin-bottom:18px;

    border:2px solid rgba(230,140,58,.3);
}

.author h3{
    margin-bottom:8px;
    font-size:1.1rem;
}

.author p{
    color:var(--muted);
    max-width:420px;
    margin:0 auto;
}

.author-links{
    margin-top:18px;

    display:flex;
    justify-content:center;
    gap:20px;
    flex-wrap:wrap;
}

.author-links a{
    color:var(--muted);
    text-decoration:none;
}

.author-links a:hover{
    color:var(--accent);
}

/* ── Carrossel de artigos ─────────────────────────────────────────────────── */
.blog-carousel{
    border-top:1px solid var(--line);
    padding:60px 0;
}

.carousel-wrapper{
    display:flex;
    align-items:center;
    gap:12px;
}

.carousel-track-clip{
    flex:1;
    overflow:hidden;
}

.carousel-track{
    display:flex;
    gap:20px;
    transition:transform .35s ease;
    will-change:transform;
}

.carousel-card{
    flex:0 0 calc((100% - 40px) / 3);
    background:var(--card);
    border:1px solid var(--line);
    border-radius:10px;
    padding:22px 20px;
    text-decoration:none;
    color:var(--text);
    display:flex;
    flex-direction:column;
    gap:8px;
    transition:border-color .2s, transform .2s;
}

.carousel-card:hover{
    border-color:var(--accent);
    transform:translateY(-3px);
}

.carousel-card-date{
    font-family:var(--font-mono);
    font-size:.75rem;
    color:var(--muted);
    letter-spacing:.5px;
}

.carousel-card-title{
    font-size:1rem;
    font-weight:700;
    line-height:1.4;
    color:var(--text);
}

.carousel-card:hover .carousel-card-title{
    color:var(--accent);
}

.carousel-card-excerpt{
    font-size:.85rem;
    color:var(--muted);
    line-height:1.55;
    flex:1;
    margin:0;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.carousel-card-cta{
    font-family:var(--font-mono);
    font-size:.78rem;
    color:var(--accent);
    font-weight:600;
    margin-top:4px;
}

.carousel-btn{
    flex-shrink:0;
    width:36px;
    height:36px;
    background:var(--card);
    border:1px solid var(--line);
    border-radius:50%;
    color:var(--muted);
    font-size:1.4rem;
    line-height:1;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:border-color .2s, color .2s;
    padding:0;
}

.carousel-btn:hover{
    border-color:var(--accent);
    color:var(--accent);
}

.carousel-btn:disabled{
    opacity:.3;
    cursor:default;
}

.carousel-dots{
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:18px;
}

.carousel-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--line);
    border:none;
    cursor:pointer;
    padding:0;
    transition:background .2s;
}

.carousel-dot.active{
    background:var(--accent);
}

@media(max-width:860px){
    .carousel-card{ flex:0 0 calc((100% - 20px) / 2); }
}

@media(max-width:560px){
    .carousel-card{ flex:0 0 100%; }
    .carousel-btn{ display:none; }
}

.cookie-notice{
    position:fixed;
    bottom:24px;
    right:24px;
    max-width:380px;
    background:var(--card);
    border:1px solid var(--line);
    border-radius:12px;
    padding:16px 20px;
    display:flex;
    align-items:center;
    gap:14px;
    z-index:9999;
    transition:opacity .3s, transform .3s;
}

.cookie-notice.hidden{
    opacity:0;
    transform:translateY(20px);
    pointer-events:none;
}

.cookie-notice p{
    color:var(--muted);
    font-size:.82rem;
    line-height:1.5;
    margin:0;
}

.cookie-notice button{
    flex-shrink:0;
    background:var(--accent);
    border:none;
    color:var(--bg);
    font-weight:700;
    font-size:.8rem;
    padding:8px 16px;
    border-radius:8px;
    cursor:pointer;
    transition:background .2s;
}

.cookie-notice button:hover{
    background:#f2a35c;
}

/* ── Disponibilidade ─────────────────────────────────────────────────────── */
.availability{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:12px;
    padding:4px 12px;
    border:1px solid rgba(77,187,109,.45);
    border-radius:20px;
    color:#7fd39a;
    font-family:var(--font-mono);
    font-size:.78rem;
}

.availability-dot{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#4dbb6d;
    box-shadow:0 0 0 0 rgba(77,187,109,.6);
    animation:availability-pulse 2s infinite;
}

@keyframes availability-pulse{
    70%{ box-shadow:0 0 0 7px rgba(77,187,109,0); }
    100%{ box-shadow:0 0 0 0 rgba(77,187,109,0); }
}

/* ── O que eu faço ───────────────────────────────────────────────────────── */
.services{
    padding:48px 0 60px;
    border-top:1px solid var(--line);
}

.service-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:18px;
}

.service-card{
    display:flex;
    flex-direction:column;
    background:var(--card);
    border:1px solid var(--line);
    border-top:3px solid var(--accent);
    padding:22px;
}

.service-card h3{
    font-size:1.05rem;
    margin-bottom:8px;
}

.service-card p{
    color:var(--muted);
    font-size:.9rem;
    flex-grow:1;
}

.service-proof{
    margin-top:14px;
    color:var(--accent);
    font-size:.84rem;
    font-weight:600;
    text-decoration:none;
}

.service-proof:hover{
    color:var(--text);
}

.services-cta{
    margin-top:24px;
}

/* ── Habilidades com prova ───────────────────────────────────────────────── */
.skill-proofs{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:12px 28px;
    margin-bottom:24px;
}

.skill-proof{
    display:flex;
    flex-direction:column;
    padding:10px 0 10px 14px;
    border-left:2px solid var(--accent);
}

.skill-proof strong{
    font-family:var(--font-mono);
    font-size:.88rem;
}

.skill-proof span{
    color:var(--muted);
    font-size:.86rem;
}

/* ── Projetos ────────────────────────────────────────────────────────────── */
.project-result{
    margin-top:14px;
    padding:12px 16px;
    background:rgba(230,140,58,.08);
    border-left:3px solid var(--accent);
    color:var(--text) !important;
    font-size:.9rem;
}

.project-cta{
    margin:20px 0 60px;
    padding:32px;
    background:var(--card);
    border:1px solid var(--line);
    text-align:center;
}

.project-cta h2{
    font-size:1.3rem;
    margin-bottom:6px;
}

.project-cta p{
    color:var(--muted);
    margin-bottom:18px;
}

/* ── Contato ─────────────────────────────────────────────────────────────── */
.contact{
    padding:60px 0 70px;
    border-top:1px solid var(--line);
    scroll-margin-top:20px;
}

.contact-grid{
    display:grid;
    grid-template-columns:1fr 1.2fr;
    gap:40px;
    align-items:start;
}

.contact-photo{
    width:72px;
    height:72px;
    border-radius:50%;
    object-fit:cover;
    border:2px solid var(--accent);
    margin-bottom:14px;
}

.contact-info h2{
    font-size:1.5rem;
    margin-bottom:8px;
}

.contact-info p{
    color:var(--muted);
    font-size:.92rem;
    margin-bottom:18px;
}

.contact-email-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:16px;
}

.contact-email{
    color:var(--accent);
    font-family:var(--font-mono);
    font-weight:600;
    font-size:.95rem;
    text-decoration:none;
    word-break:break-all;
}

.contact-email:hover{
    color:var(--text);
}

.copy-btn{
    background:none;
    border:1px solid var(--line);
    color:var(--muted);
    font-family:var(--font-mono);
    font-size:.75rem;
    padding:3px 10px;
    cursor:pointer;
}

.copy-btn:hover{
    border-color:var(--accent);
    color:var(--accent);
}

.contact-links{
    display:flex;
    gap:20px;
}

.contact-links a{
    color:var(--muted);
    text-decoration:none;
    font-size:.9rem;
}

.contact-links a:hover{
    color:var(--text);
}

.contact-form{
    display:flex;
    flex-direction:column;
    gap:14px;
    background:var(--card);
    border:1px solid var(--line);
    padding:24px;
}

.contact-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.contact-form label{
    display:flex;
    flex-direction:column;
    gap:4px;
    color:var(--muted);
    font-size:.82rem;
}

.contact-form input,
.contact-form select,
.contact-form textarea{
    width:100%;
    padding:10px 12px;
    background:var(--bg);
    border:1px solid var(--line);
    color:var(--text);
    font:inherit;
    font-size:.92rem;
}

.contact-form textarea{
    resize:vertical;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
    outline:none;
    border-color:var(--accent);
}

.contact-form .btn{
    align-self:flex-start;
    cursor:pointer;
}

/* Campo isca para robôs: fora da tela, invisível para pessoas */
.contact-hp{
    position:absolute;
    left:-9999px;
    width:1px;
    height:1px;
    overflow:hidden;
}

.contact-status{
    padding:10px 14px;
    font-size:.88rem;
}

.contact-status.ok{
    background:rgba(77,187,109,.12);
    border:1px solid rgba(77,187,109,.4);
    color:#7fd39a;
}

.contact-status.error{
    background:rgba(229,96,109,.12);
    border:1px solid rgba(229,96,109,.4);
    color:#f0909a;
}

@media(max-width:760px){
    .contact-grid{ grid-template-columns:1fr; }
    .contact-row{ grid-template-columns:1fr; }
}

/* ── Menu no celular ─────────────────────────────────────────────────────── */
@media(max-width:640px){
    header .container{
        flex-wrap:wrap;
        gap:10px;
    }

    nav{
        flex-wrap:wrap;
        gap:12px 16px;
        font-size:.9rem;
    }
}

/* ── Idiomas ─────────────────────────────────────────────────────────────── */
a.lang-btn{
    text-decoration:none;
    display:inline-block;
}

.lang-suggest{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px 14px;
    padding:8px 16px;
    background:var(--card);
    border-bottom:1px solid var(--line);
    color:var(--muted);
    font-size:.86rem;
}

.lang-suggest[hidden]{
    display:none;
}

.lang-suggest a{
    color:var(--accent);
    font-weight:600;
    text-decoration:none;
}

.lang-suggest button{
    background:none;
    border:none;
    color:var(--muted);
    font-size:1.1rem;
    cursor:pointer;
    line-height:1;
}

/* ── Sobre mim ───────────────────────────────────────────────────────────── */
.about-me{
    padding:56px 0;
    border-top:1px solid var(--line);
    scroll-margin-top:20px;
}

.about-grid{
    display:grid;
    grid-template-columns:1.4fr 1fr;
    gap:40px;
    align-items:start;
}

.about-text p{
    color:var(--muted);
    font-size:.95rem;
    margin-bottom:14px;
}

.about-text .about-lead{
    color:var(--text);
    font-size:1.12rem;
    line-height:1.6;
}

.about-highlights{
    list-style:none;
    display:grid;
    gap:12px;
}

.about-highlights li{
    display:flex;
    flex-direction:column;
    padding:14px 16px;
    background:var(--card);
    border-left:3px solid var(--accent);
}

.about-highlights strong{
    font-size:.95rem;
}

.about-highlights span{
    color:var(--muted);
    font-size:.86rem;
}

/* ── Página de freelance ─────────────────────────────────────────────────── */
.fl-hero{
    padding:64px 0 48px;
    max-width:820px;
}

.fl-hero h1{
    font-size:2.1rem;
    line-height:1.25;
    margin-bottom:14px;
}

.fl-lead{
    color:var(--muted);
    font-size:1.02rem;
    max-width:700px;
}

.fl-badges{
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    gap:8px 18px;
    margin-top:26px;
    color:var(--muted);
    font-family:var(--font-mono);
    font-size:.8rem;
}

.fl-badges li::before{
    content:'✓ ';
    color:#7fd39a;
}

.fl-section{
    padding:52px 0;
    border-top:1px solid var(--line);
    scroll-margin-top:20px;
}

h2.section-title{
    font-weight:400;
}

.fl-services{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:18px;
}

.fl-checklist{
    list-style:none;
    margin:14px 0 0;
    flex-grow:1;
}

.fl-checklist li{
    position:relative;
    padding-left:20px;
    margin-bottom:6px;
    color:var(--text);
    font-size:.87rem;
}

.fl-checklist li::before{
    content:'→';
    position:absolute;
    left:0;
    color:var(--accent);
}

.fl-proof{
    margin-top:14px;
    padding-top:12px;
    border-top:1px solid var(--line);
    color:var(--muted);
    font-size:.8rem;
}

.fl-process{
    list-style:none;
    counter-reset:step;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    gap:18px;
}

.fl-process li{
    counter-increment:step;
    display:flex;
    flex-direction:column;
    gap:4px;
}

.fl-process li::before{
    content:counter(step, decimal-leading-zero);
    font-family:var(--font-mono);
    font-size:1.4rem;
    font-weight:700;
    color:var(--accent);
}

.fl-process span{
    color:var(--muted);
    font-size:.88rem;
}

.fl-work{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:18px;
}

.fl-work-card{
    display:flex;
    flex-direction:column;
    padding:20px;
    background:var(--card);
    border:1px solid var(--line);
    color:var(--text);
    text-decoration:none;
    transition:border-color .15s;
}

.fl-work-card:hover{
    border-color:var(--accent);
}

.fl-work-card p{
    color:var(--muted);
    font-size:.88rem;
    margin:8px 0 12px;
    flex-grow:1;
}

.fl-work-link{
    color:var(--accent);
    font-size:.84rem;
    font-weight:600;
}

.fl-faq details{
    border-bottom:1px solid var(--line);
    padding:14px 0;
}

.fl-faq summary{
    cursor:pointer;
    font-weight:600;
    list-style:none;
}

.fl-faq summary::-webkit-details-marker{
    display:none;
}

.fl-faq summary::after{
    content:'+';
    float:right;
    color:var(--accent);
    font-family:var(--font-mono);
}

.fl-faq details[open] summary::after{
    content:'−';
}

.fl-faq p{
    color:var(--muted);
    font-size:.92rem;
    margin-top:8px;
    max-width:760px;
}

@media(max-width:760px){
    .about-grid{ grid-template-columns:1fr; }
    .fl-hero h1{ font-size:1.6rem; }
}

/* ── Projeto encerrado ───────────────────────────────────────────────────── */
.project-archived,
.project-status.project-status-archived{
    display:inline-block;
    padding:1px 8px;
    margin-left:8px;
    border:1px solid var(--line);
    border-radius:20px;
    color:var(--muted);
    background:none;
    font-family:var(--font-mono);
    font-size:.7rem;
    vertical-align:3px;
}

.project-detail-archived{
    scroll-margin-top:20px;
}

.project-archived-note{
    color:var(--muted) !important;
    font-size:.86rem;
    font-style:italic;
}