:root{--main-color:#00D4FF;--secondary-color:#0A0A23;--text-primary:#FFFFFF;--text-secondary:#CCCCCC}*{box-sizing:border-box}body{font-family:Roboto,sans-serif;margin:0;padding:0;background-color:#0a0a23;color:#fff;overflow-x:hidden}.hidden{display:none!important}

header{background:linear-gradient(90deg,#0a0a23 60%,#002d40 100%);padding:10px 20px;width:100%;z-index:1000;box-shadow:0 2px 5px rgba(0,0,0,.1)}.nav-header{display:flex;justify-content:space-between;align-items:center;width:100%}header nav{display:flex;align-items:center;justify-content:space-between;padding-right:60px}header nav img{height:80px;width:auto;margin-left:-30%;padding-left:40px}header nav ul{list-style:none;display:flex;gap:20px;margin:0;padding:0}header nav ul li a{text-decoration:none;color:#fff;font-size:1rem;padding:8px 16px;transition:background-color .3s,color .3s}header nav ul li a:hover{background-color:#0078ff;color:#0a0a23;border-radius:5px}header nav ul li a[href*="contact"]{border:1px solid #00d4ff;border-radius:5px;color:#00d4ff}header nav ul li a[href*="contact"]:hover{background-color:#00d4ff;color:#0a0a23}.menu-icon{display:none;cursor:pointer;flex-direction:column;justify-content:space-between;height:45px;transition:.3s;z-index:1001;padding:10px}.menu-icon span{width:30px;height:3px;background-color:#00d4ff;transition:.3s}

#hero{display:flex;align-items:center;justify-content:space-between;padding:60px 40px;background:linear-gradient(90deg,#0a0a23 60%,#002d40 100%);color:#fff;min-height:70vh;margin-top:-40px;width:100%;max-width:100vw;gap:2rem}#hero .content{max-width:52%;display:flex;flex-direction:column;gap:.75rem}#hero p{margin:0;font-size:1.2rem;line-height:1.6;color:#fff}.hero-title{font-size:2rem;line-height:1.35;color:#fff;margin:0;max-width:620px;overflow-wrap:break-word;word-break:keep-all;display:block}.hero-kicker{color:#00d4ff;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;margin:0;opacity:.9;display:block}.hero-ctas{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.5rem}.btn-primary{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;background:#00d4ff;color:#0a0a23;border:2px solid #00d4ff;border-radius:25px;font-weight:700;text-decoration:none;transition:.2s}.btn-primary:hover{background:transparent;color:#00d4ff;transform:translateY(-2px)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#welcome{display:block;margin-left:0;width:100%;height:auto;margin-bottom:0}#welcome text{transform:translate(0,100px);font-size:7rem;fill:none;stroke:#00D4FF;stroke-width:2px;stroke-dasharray:1000;stroke-dashoffset:1000;animation:10s linear forwards stroke-animation,4s 4s forwards fill-animation}#hero .image-container img{max-width:100%;height:auto;padding-right:0}#hero .image-container{overflow:hidden}@media (max-width:480px){#welcome text{font-size:3.5rem;transform:translateY(40%)!important}}

.project-counter,.project-duration,.project-tag{font-size:.9rem;color:#00d4ff}#projects{align-items:center;text-align:center}.projects{display:flex;flex-direction:row;justify-content:center}.project{margin:2rem}.filters{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;margin:2rem 0}.filter-btn{padding:.5rem 1.5rem;border:2px solid #00d4ff;border-radius:25px;background:0 0;color:#00d4ff;cursor:pointer;transition:.3s}.filter-btn.active{background:#00d4ff;color:#0a0a23}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem;padding:1rem;max-width:1200px;margin:0 auto;align-items:stretch}.project-fallback{display:block;background:#002d40;border:1px solid rgba(0,212,255,.2);border-radius:10px;padding:1.2rem;color:#00d4ff;text-decoration:none;text-align:center;font-weight:600;transition:.2s}.project-fallback:hover{background:rgba(0,212,255,.1);transform:translateY(-2px);color:#fff}.project-card{background:#002d40;border-radius:10px;padding:1.5rem;transition:transform .3s,box-shadow .3s;border:1px solid rgba(0,212,255,.2);color:#fff;display:flex;flex-direction:column;height:100%}.project-card:hover{transform:translateY(-5px);box-shadow:0 5px 15px rgba(0,212,255,.2)}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.difficulty,.tech-stack{display:flex;align-items:center}.project-tag{background:rgba(0,212,255,.1);padding:.3rem .8rem;border-radius:15px}.difficulty{gap:.5rem}.difficulty-dot{width:10px;height:10px;border-radius:50%}.difficulty-dot.beginner{background:#0f8}.difficulty-dot.intermediate{background:gold}.difficulty-dot.advanced{background:#ff4500}.tech-stack{gap:1rem}.tech-icon{width:30px;height:30px;filter:brightness(0) invert(1)}.project-duration{font-weight:500}.projects-header{text-align:center;margin-bottom:2rem;padding:0 1rem}.project-counter{margin-top:-1rem;opacity:.8;font-weight:300}.project-card h3{color:#00d4ff;margin:1rem 0;font-size:1.4rem;line-height:1.3}.project-card p{color:#ccc;line-height:1.6;margin:1rem 0;font-size:.95rem}.project-card *,.project-link,a.project-link:hover,a.project-link:hover *{text-decoration:none!important}.card-content{display:flex;flex-direction:column;gap:.6rem}.card-case-study{margin-top:1rem;display:flex;flex-direction:column;gap:.8rem}.card-case-study p{margin:0;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.project-card h3{margin-bottom:.4rem;line-height:1.25;min-height:3.2rem;display:flex;align-items:center;justify-content:center;text-align:center}.card-content p{margin:0;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;min-height:7.8rem}.card-footer{margin-top:auto;padding-top:.8rem}.card-content,.card-footer,.card-header,.difficulty,.project-tag,.tech-stack{pointer-events:none}.project-link{display:flex;flex-direction:column;flex:1;color:inherit;cursor:pointer}.btn-view-arch{display:inline-flex;align-items:center;justify-content:center;gap:8px;background-color:transparent;border:1px solid #00d4ff;color:#00d4ff;padding:10px 20px;border-radius:6px;cursor:pointer;font-weight:600;font-size:.9rem;transition:.2s;margin-top:20px;width:100%}.btn-view-arch:hover{background-color:#00d4ff;color:#0b1220;transform:translateY(-2px)}

/* Case study hint dentro do card (home) */
.case-study-hint{display:block;margin-top:1.2rem;padding-top:.8rem;border-top:1px solid rgba(0,212,255,.15);color:#00d4ff;font-size:.85rem;font-weight:600;text-align:right}

/* Página de projeto (/projects/<slug>.html) */
.project-page{max-width:900px;margin:0 auto;padding:2rem 1rem;text-align:left}
.project-page h1{color:#00d4ff;font-size:2rem;line-height:1.25;margin:.5rem 0 1rem}
.project-meta{display:flex;gap:1rem;flex-wrap:wrap;align-items:center;margin:0 0 1.5rem;color:#ccc;font-size:.9rem}
.project-meta .project-tag{background:rgba(0,212,255,.1);padding:.3rem .8rem;border-radius:15px;color:#00d4ff}
.project-page .lead{color:#ccc;line-height:1.7;font-size:1rem;margin:0 0 1rem}
.project-tech-row{display:flex;gap:1rem;align-items:center;margin:1.5rem 0}
.project-diagram{margin:2rem 0}
.project-diagram img{width:100%;height:auto;border-radius:12px;border:1px solid #1e293b}
.project-diagram figcaption{color:#999;font-size:.85rem;margin-top:.6rem;text-align:center}
.diagram-toggle{display:block;margin:.6rem auto 0;padding:.4rem 1rem;border:1px solid #00D4FF;border-radius:20px;background:transparent;color:#00D4FF;font-size:.8rem;font-weight:600;cursor:pointer;transition:.2s}
.diagram-toggle:hover{background:#00D4FF;color:#0A0A23}

.case-study h2{color:#00d4ff;font-size:1.3rem;margin:2.5rem 0 1rem}
.case-block{background:#002d40;border:1px solid rgba(0,212,255,.2);border-radius:10px;padding:1.25rem 1.5rem;margin-bottom:1rem}
.case-block h3{color:#00d4ff;margin:0 0 .5rem;font-size:1rem;text-transform:uppercase;letter-spacing:.05em}
.case-block p{color:#ccc;line-height:1.6;margin:0}

.related-projects{margin:3rem 0 1rem;padding:1.5rem;background:#002d40;border:1px solid rgba(0,212,255,.15);border-radius:10px}.related-projects h2{color:#00d4ff;font-size:1.1rem;margin:0 0 1rem}.related-grid{display:flex;gap:1rem;flex-wrap:wrap}.related-card{display:block;flex:1;min-width:200px;background:#0a0a23;border:1px solid rgba(0,212,255,.2);border-radius:8px;padding:1rem;color:#00d4ff;text-decoration:none;font-weight:600;transition:.2s}.related-card:hover{background:rgba(0,212,255,.1);transform:translateY(-2px);color:#fff}.breadcrumb{color:#999;font-size:.85rem;margin:0 0 1.25rem;display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}.breadcrumb a{color:#00d4ff;text-decoration:none;transition:.2s}.breadcrumb a:hover{color:#fff;text-decoration:underline}.breadcrumb span[aria-current]{color:#ccc}.newsletter-inline{margin:1.25rem 0;text-align:center}.newsletter-inline a{color:#00d4ff;text-decoration:none;border-bottom:1px solid rgba(0,212,255,.3);padding-bottom:1px;transition:.2s}.newsletter-inline a:hover{color:#fff;border-bottom-color:#00d4ff}.social-proof{background:rgba(0,212,255,.06);border-left:3px solid #00d4ff;padding:.9rem 1rem;border-radius:6px;margin:1.5rem 0;color:#ccc;font-size:.9rem}.social-proof strong{color:#00d4ff}.social-proof--verified{background:rgba(15,255,136,.08);border-left-color:#0f8}.social-proof--verified strong{color:#0f8}.mid-cta{text-align:center;margin:2rem 0;padding:1.5rem;background:#002d40;border:1px solid rgba(0,212,255,.2);border-radius:10px}.mid-cta p{color:#ccc;margin:0 0 1rem}.share-bar{display:flex;justify-content:center;margin:1.5rem 0}.share-bar a{color:#00d4ff;border:1px solid rgba(0,212,255,.4);border-radius:25px;padding:.5rem 1.2rem;text-decoration:none;font-weight:600;transition:.2s}.share-bar a:hover{background:rgba(0,212,255,.1);color:#fff;transform:translateY(-1px)}.project-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2.5rem;align-items:center}.project-actions .btn-primary{flex:1;min-width:200px;justify-content:center}.project-actions .btn-outline{flex:0}
.btn-outline{display:inline-flex;align-items:center;gap:8px;background-color:transparent;border:1px solid #00d4ff;color:#00d4ff;padding:10px 20px;border-radius:6px;cursor:pointer;font-weight:600;font-size:.9rem;transition:.2s;text-decoration:none!important}
.btn-outline:hover{background-color:#00d4ff;color:#0b1220;transform:translateY(-2px)}
.proof-note{background:rgba(0,212,255,.06);border-left:3px solid #00d4ff;padding:.9rem 1.1rem;border-radius:6px;color:#ccc;font-size:.9rem;line-height:1.6;margin:0 0 1.5rem}

/* Índice de escritos (/writing/) */
.writing-index{max-width:800px;margin:0 auto;padding:2rem 1rem;text-align:left}
.writing-index h1{color:#00d4ff;font-size:2.2rem;margin-bottom:1rem}
.writing-intro{color:#ccc;line-height:1.6}
.post-list{list-style:none;padding:0;margin:2rem 0 1rem}
.post-card{display:block;background:#002d40;border:1px solid rgba(0,212,255,.2);border-radius:10px;padding:1.25rem 1.5rem;color:inherit;text-decoration:none!important;transition:transform .3s,box-shadow .3s;margin-bottom:1rem}
.post-card:hover{transform:translateY(-3px);box-shadow:0 5px 15px rgba(0,212,255,.2)}
.post-card h2{color:#00d4ff;font-size:1.25rem;margin:0 0 .4rem}
.post-meta{color:#999;font-size:.85rem;margin:0 0 .5rem}
.post-excerpt{color:#ccc;line-height:1.6;margin:0;font-size:.95rem}
.writing-empty{color:#999;font-style:italic}

/* Página de ensaio (/writing/<slug>.html) */
.article{max-width:800px;margin:0 auto;padding:2rem 1rem;text-align:left}
.post-header h1{color:#00d4ff;font-size:2rem;line-height:1.25;margin:.25rem 0 .75rem}
.post-header time{color:#999;font-size:.9rem}
.post-header{border-bottom:1px solid rgba(0,212,255,.15);padding-bottom:1.25rem;margin-bottom:2rem}
.article-body{color:#ccc;line-height:1.75;font-size:1rem}
.article-body h2{color:#00d4ff;margin:2rem 0 .8rem}
.article-body h3{color:#fff;margin:1.5rem 0 .6rem}
.article-body a{color:#00d4ff}
.article-body code{background:#0a0a23;border:1px solid #1e293b;border-radius:4px;padding:.1em .35em;font-size:.9em}
.article-body pre{background:#0a0a23;border:1px solid #1e293b;border-radius:8px;padding:1rem;overflow-x:auto}
.article-body img{max-width:100%;height:auto;border-radius:8px}
.linkedin-discuss{display:inline-block;margin-top:1.5rem;color:#00d4ff;font-weight:600;text-decoration:none!important}

/* Newsletter CTA (Fase D) */
.newsletter-cta{max-width:800px;margin:2rem auto;padding:1.5rem;text-align:center;background:#002d40;border:1px solid rgba(0,212,255,.2);border-radius:10px}
.newsletter-cta h2{color:#00d4ff;margin:0 0 .5rem;font-size:1.3rem}
.newsletter-cta p{color:#ccc;margin:0 auto 1rem;max-width:520px;line-height:1.6}

footer{background:#0a0a23;color:#fff;font-size:.9rem}
.footer-inner{max-width:960px;margin:0 auto;padding:2.25rem 1.5rem 2rem}
.footer-cta{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;flex-wrap:wrap;background:#002d40;border:1px solid rgba(0,212,255,.2);border-radius:12px;padding:1.15rem 1.5rem;margin-bottom:1.75rem}
.footer-cta-text{text-align:left}
.footer-newsletter-title{color:#00d4ff;font-weight:700;font-size:1rem;margin:0 0 .2rem;letter-spacing:.04em;text-transform:uppercase}
.footer-newsletter-desc{color:#999;font-size:.85rem;margin:0;line-height:1.5;max-width:520px}
.btn-newsletter{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1px solid #00d4ff;color:#00d4ff;padding:9px 22px;border-radius:25px;font-weight:600;font-size:.9rem;white-space:nowrap;text-decoration:none!important;transition:.2s}
.btn-newsletter:hover{background:#00d4ff;color:#0b1220;transform:translateY(-2px)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footer-copy{margin:0;color:#ccc}
.footer-bottom #social-links{margin-top:0}
.social-icon{width:30px;height:30px;margin:0 10px}
@media (max-width:640px){.footer-cta{flex-direction:column;align-items:flex-start}.footer-bottom{justify-content:center}}

@keyframes stroke-animation{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}@keyframes fill-animation{from{fill:transparent}to{fill:#00D4FF}}@keyframes slideDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}

@media (min-width:769px){#menu-toggle{display:none}}@media (max-width:1024px){#hero{padding:40px 20px}#hero .content{max-width:60%}#hero p{font-size:1rem}#welcome text{font-size:5rem}}@media (max-width:768px){#welcome,.menu-icon,header nav ul.active{display:flex}#hero,#welcome,#welcome text{text-align:center}.projects-grid{grid-template-columns:1fr;max-width:500px;margin:0 auto}.filter-btn{padding:.5rem 1rem;font-size:.85rem}header nav{flex-direction:column;padding:10px 20px}header nav ul{display:none;position:relative;flex-direction:column;text-align:left;padding:10px 40px;width:100%;margin-top:20px;background:rgba(0,212,255,.1);border-radius:8px;animation:.3s slideDown}header nav img{height:80px;margin-left:-30%}.menu-icon{position:relative;right:0;top:0}.menu-icon.active span:first-child{transform:rotate(45deg) translate(5px,5px)}.menu-icon.active span:nth-child(2){opacity:0}.menu-icon.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}main{transition:margin-top .3s}.navbar-active main{margin-top:200px}#hero{height:100%;flex-direction:column;padding:40px 20px;max-width:300vw}#hero .content{max-width:100%;margin-bottom:20px}#hero .image-container{max-width:100%;padding:0}#hero .image-container img{max-width:90%;height:100%}#welcome{padding-bottom:10px;align-items:center;justify-content:center;flex-direction:column;margin-bottom:0!important;margin-top:0!important;margin-left:0!important}.welcome-container{width:100%;display:flex;align-items:center;justify-content:center;margin-bottom:10px}#welcome text{font-size:10rem;flex-direction:column;margin:5px}}@media (max-width:580px){.projects{flex-direction:column}}@media (max-width:480px){#hero{min-height:20vh;max-height:120vh;padding:20px}header nav img{height:80px;margin-left:-30%}#hero .image-container img{max-width:90%;height:auto}#hero p{font-size:.9rem}#welcome{margin-left:40px}#welcome text{font-size:10rem}}
.project-card--collapsed{display:none}

.architecture-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:rgba(11,18,32,.95);display:flex;justify-content:center;align-items:center;z-index:9999;opacity:0;pointer-events:none;transition:opacity .3s ease-in-out}.architecture-modal.active{opacity:1;pointer-events:auto}.architecture-modal-content{position:relative;max-width:90vw;max-height:90vh;transform:scale(.95);transition:transform .3s ease-in-out}.architecture-modal.active .architecture-modal-content{transform:scale(1)}.architecture-modal img{width:100%;height:auto;max-height:85vh;object-fit:contain;border-radius:12px;box-shadow:0 25px 50px -12px rgba(0,0,0,.5);border:1px solid #1e293b}.close-modal-btn{position:absolute;top:-40px;right:0;background:0 0;border:none;color:#00d4ff;font-size:2rem;cursor:pointer;transition:color .2s}.close-modal-btn:hover{color:#fff}
