/*! Bruno Ricardo | Design & IA – CSS unificado 2025
   Ordem: style.css → style_consolidado.min.css → style_ultra.css
   Arquivo gerado automaticamente para versão PRO/Ultra.
*/

/* === BEGIN: style.css === */
:root{--bg:#0d0d0d;--fg:#e8e8e8;--accent:#f8d90f;--accent2:#ff005c;--radius:10px;--ts:.35s ease;--max:1200px;--font-head:'Poppins',sans-serif;--font-body:'Inter',sans-serif}.accent{color:var(--accent)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{font-family:var(--font-body);color:var(--fg);background:var(--bg);line-height:1.6}img{max-width:100%;display:block;border-radius:var(--radius)}a{color:var(--accent);text-decoration:none;transition:var(--ts)}a:hover{color:var(--fg)}header{position:fixed;top:0;left:0;width:100%;padding:1rem 2rem;background:rgba(13,13,13,.9);display:flex;justify-content:space-between;align-items:center;z-index:20}.logo{font-family:var(--font-head);font-size:1.5rem;letter-spacing:2px}nav ul{display:flex;gap:2rem;list-style:none}nav a{font-weight:600}.burger{display:none;flex-direction:column;gap:4px;cursor:pointer}@media (min-width:769px){.burger{display:none !important;}}.burger span{width:24px;height:3px;background:var(--fg)}.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;text-align:center;overflow:hidden;background:url('1.png') center/cover}.hero-content{position:relative;z-index:2;max-width:800px;padding:0 1rem;transform:translateY(10vh)}.hero h1{font-family:var(--font-head);font-size:3rem;margin-bottom:1rem}.hero p{font-size:1.25rem;margin-bottom:2rem}.btn{display:inline-block;padding:.9rem 2rem;border:2px solid var(--accent);background:transparent;color:var(--accent);font-weight:700;letter-spacing:1px;position:relative;overflow:hidden;transition:var(--ts)}.btn:hover{background:var(--accent);color:var(--bg)}section{padding:6rem 1.5rem}.container{max-width:var(--max);margin:0 auto}section h2{font-family:var(--font-head);font-size:2.5rem;margin-bottom:2rem;color:var(--accent);text-align:center}.reveal{opacity:0;transform:scale(0.95) translateY(40px);transition:0.8s ease}.reveal.active{opacity:1;transform:scale(1) translateY(0)}.about-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;align-items:center}.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem}.service-card{padding:2rem;background:#1a1a1a;border-radius:var(--radius);text-align:center;transition:var(--ts)}.service-card:hover{transform:translateY(-6px);background:#222}.service-card h3{margin-bottom:1rem;font-family:var(--font-head)}.portfolio-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}.portfolio-item{position:relative;overflow:hidden;border-radius:var(--radius)}form{display:grid;gap:1rem;max-width:600px;margin:0 auto}input,textarea{padding:.9rem;border:none;border-radius:var(--radius);background:#1a1a1a;color:var(--fg)}textarea{resize:vertical;min-height:150px}footer{text-align:center;padding:2rem 0;background:#000;font-size:.85rem}@media(max-width:768px){nav ul{position:fixed;top:60px;right:-100%;flex-direction:column;background:rgba(13,13,13,.95);width:200px;height:calc(100vh - 60px);padding:2rem 1rem;transition:var(--ts)}nav ul.open{right:0}.burger{display:flex}.hero h1{font-size:2.2rem}}.about-grid p{text-align:justify;word-spacing:-0.05em;letter-spacing:0.01em}.portfolio-item.big{grid-column:span 4;grid-row:span 2}.social-icons{display:flex;gap:1rem;align-items:center}.social-icons a{color:var(--fg);font-size:1.5rem;transition:var(--ts)}.social-icons a:hover{color:var(--accent)}.service-card h3 i{margin-right:.5rem}.carousel-section{padding:6rem 1.5rem}.carousel-container{position:relative;max-width:var(--max);margin:0 auto;overflow:hidden;max-width:600px;width:100%}.carousel-track{display:flex;transition:transform var(--ts)}.carousel-track img{width:100%;height:auto;object-fit:contain;display:block}.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.5);border:none;color:var(--fg);font-size:2rem;padding:.5rem 1rem;cursor:pointer;z-index:5;border-radius:var(--radius)}.carousel-btn.prev{left:10px}.carousel-btn.next{right:10px}#portfolio img{transition:transform .3s ease}#portfolio img:hover{transform:scale(1.15)}.social-icons{display:flex;gap:1rem;flex-wrap:wrap;justify-content:flex-end}img{max-width:100%;height:auto;display:block;border-radius:var(--radius)}@media (max-width:768px){.portfolio-grid,.services-grid{grid-template-columns:1fr;gap:1rem}.hero h1{font-size:2.2rem}.hero p{font-size:1.1rem}.btn{padding:0.7rem 1.2rem}header{flex-direction:column;align-items:flex-start}.social-icons{justify-content:flex-start}}body{padding-top:80px;overflow-x:hidden}.image-modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100vw;height:100vh;background-color:rgba(0,0,0,0.85);justify-content:center;align-items:center}.image-modal img{max-width:90vw;max-height:90vh;border-radius:var(--radius)}.image-modal .close-modal{position:absolute;top:1rem;right:1rem;font-size:2rem;color:white;cursor:pointer}.about-grid p{text-align:justify;word-spacing:-0.05em;letter-spacing:0.01em;line-height:1.8;max-width:800px;margin:0 auto}.modal-content{overflow-y:auto;max-height:90vh;position:relative;padding-bottom:2rem}.modal-content .close-modal{position:sticky;top:0;background-color:#1a1a1a}.carousel-dots{text-align:center;margin-top:1rem}.carousel-dots span{display:inline-block;width:10px;height:10px;margin:0 5px;background-color:#888;border-radius:50%;cursor:pointer}.carousel-dots span.active{background-color:var(--accent)}#podcast audio{border-radius:16px;box-shadow:0 2px 8px rgba(0,0,0,0.2);display:block;margin:0 auto}body.light-theme #podcast p{color:#333 !important}body.light-theme #podcast h2{color:#111 !important}input,textarea{font-size:16px}@media (max-width:768px){#user-location-time{z-index:1;position:relative}}body.light-theme .mobile-menu{background-color:#ffffff}body.light-theme .mobile-menu a{color:#000 !important}body.light-theme .mobile-menu li{color:#000 !important}.mobile-menu{z-index:1000 !important;position:relative}#user-location-time{z-index:0 !important;position:relative}.mobile-menu,.nav,.menu-overlay{z-index:1000 !important;position:relative}body.light-theme .mobile-menu,body.light-theme .mobile-menu a,body.light-theme .mobile-menu li{color:#000 !important}body.light-theme .menu-toggle span{background-color:#000 !important}#user-location-time{z-index:0 !important;position:relative}.mobile-menu,.menu-overlay,.nav{z-index:9999 !important;position:relative !important}body.light-theme .mobile-menu,body.light-theme .mobile-menu li,body.light-theme .mobile-menu li a,body.light-theme .mobile-menu a{color:#ffffff !important}body.light-theme .menu-toggle span{background-color:#000 !important}#user-location-time{z-index:0 !important;position:relative !important}body.light-theme .mobile-menu{background-color:#ffffff !important}body.light-theme .mobile-menu a,body.light-theme .mobile-menu li{color:#000 !important}@media (max-width:768px){nav ul.open{z-index:9999 !important;position:fixed !important;background-color:#ffffff !important}body.light-theme nav ul.open li a{color:#000 !important}.burger span{background-color:#e8e8e8 !important}body.light-theme .burger span{background-color:#000 !important}#user-location-time{z-index:0 !important;position:relative !important}}@media (max-width:768px){body.light-theme nav ul.open{background-color:rgba(255,255,255,0.85) !important;backdrop-filter:blur(5px)}body.light-theme nav ul.open li a{color:#000 !important}}@media (max-width:768px){body.light-theme nav ul.open{background-color:rgba(255,255,255,0.85) !important;backdrop-filter:blur(5px) !important}body.light-theme nav ul.open li a{color:#000 !important}body.light-theme .burger span{background-color:#000 !important}}@media (max-width:768px){body:not(.light-theme) nav ul.open{background-color:rgba(13,13,13,0.9) !important}body:not(.light-theme) nav ul.open li a{color:var(--accent) !important}body:not(.light-theme) .burger span{background-color:var(--fg) !important}}@media (max-width:768px){nav ul.open{z-index:9999 !important;position:fixed !important}#user-location-time{z-index:0 !important;position:relative !important}}html{scroll-behavior:smooth}a:hover,button:hover{cursor:pointer;transition:all 0.3s ease;filter:brightness(1.2)}#gallery .carousel-container{max-width:1000px;width:100%}#contact form{max-width:600px;margin:0 auto}#contact textarea{width:100%;height:150px}.social-icons{display:flex;gap:1rem;flex-wrap:wrap;justify-content:flex-end}img{max-width:100%;height:auto;display:block;border-radius:var(--radius)}@media (max-width:768px){.portfolio-grid,.services-grid{grid-template-columns:1fr;gap:1rem}.hero h1{font-size:2.2rem}.hero p{font-size:1.1rem}.btn{padding:0.7rem 1.2rem}header{flex-direction:column;align-items:flex-start}.social-icons{justify-content:flex-start}}body{padding-top:80px;overflow-x:hidden}.image-modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100vw;height:100vh;background-color:rgba(0,0,0,0.85);justify-content:center;align-items:center}.image-modal img{max-width:90vw;max-height:90vh;border-radius:var(--radius)}.image-modal .close-modal{position:absolute;top:1rem;right:1rem;font-size:2rem;color:white;cursor:pointer}#scrollTopBtn{display:none;position:fixed;bottom:40px;right:30px;z-index:99;font-size:18px;background-color:#f8d90f;color:black;border:none;outline:none;cursor:pointer;padding:12px 16px;border-radius:50%;box-shadow:0 0 10px rgba(0,0,0,0.3);transition:0.3s}#scrollTopBtn:hover{background-color:#ffce00}.modal-overlay{display:none;position:fixed;z-index:2000;left:0;top:0;width:100vw;height:100vh;background-color:rgba(0,0,0,0.85);justify-content:center;align-items:center}.modal-content{background-color:#1a1a1a;color:#e8e8e8;padding:2rem;border-radius:10px;max-width:600px;width:90%;box-shadow:0 0 15px rgba(0,0,0,0.5);font-size:0.95rem;overflow-y:auto;max-height:90vh}.modal-content h2,.modal-content h3{color:#f8d90f;margin-top:0}.modal-content ul{list-style:disc;padding-left:1.5rem}.close-modal{position:absolute;top:1rem;right:1.5rem;font-size:2rem;color:#fff;cursor:pointer}body.light-theme{background:#f5f5f5;color:#111}body.light-theme a{color:#111}body.light-theme .btn{border-color:#111;color:#111}body.light-theme .btn:hover{background:#111;color:#fff}body.light-theme header{background:rgba(255,255,255,0.9)}body.light-theme .service-card,body.light-theme .modal-content,body.light-theme input,body.light-theme textarea{background:#eaeaea;color:#111}body.light-theme .portfolio-item img:hover{filter:brightness(90%)}body.light-theme .hero h1,body.light-theme .hero p{color:#000;text-shadow:0 1px 3px rgba(255,255,255,0.4)}body.light-theme section h2{color:#111}body.light-theme .accent{color:#c90}body.light-theme .hero .accent{color:#fff}body.light-theme .hero{color:white}.hero h1,.hero p{color:#fff !important}body.light-theme .hero h1,body.light-theme .hero p{color:#fff !important}body.light-theme .hero .accent{color:#f8d90f !important}.hero .btn{color:#fff !important;border-color:#f8d90f !important}.hero .btn:hover{background:#f8d90f !important;color:#000 !important}#themeToggle span{font-size:1.2rem;display:inline-block;transition:transform 0.3s ease}body:not(.light-theme) #themeIcon{content:'🌚';color:#222}body.light-theme #themeIcon{content:'🌞';color:#000}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}#themeToggle{transition:all 0.3s ease}body.light-theme #user-location-time{color:#000 !important}#user-location-time{opacity:0;animation:fadeIn 1s ease forwards}@keyframes fadeIn{to{opacity:1}}#robozinho-container{position:fixed;bottom:20px;left:20px;z-index:999;display:flex;align-items:flex-end;gap:10px;animation:flutuar 3s ease-in-out infinite}#fechar-robo{position:absolute;top:0px;left:-3px;width:16px;height:16px;border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;background:rgba(0,0,0,0.6);color:#fff;box-shadow:0 2px 6px rgba(0,0,0,0.25);transition:all 0.3s ease;z-index:1000;}#fechar-robo svg{width:10px;height:10px;display:block;}#fechar-robo:hover,#fechar-robo:focus-visible{transform:scale(1.05);filter:brightness(1.1);outline:none;}body.light-theme #fechar-robo{background:white !important;color:black !important;box-shadow:0 2px 6px rgba(0,0,0,0.1);border:1px solid rgba(0,0,0,0.08);top:0px;}body.light-theme #fechar-robo:hover,body.light-theme #fechar-robo:focus-visible{box-shadow:0 3px 12px rgba(0,0,0,0.20);}#fechar-robo:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}@media (max-width:768px){#fechar-robo{display:none !important;}}#robozinho{width:90px;height:auto;transition:transform 0.4s ease}#robozinho:hover{transform:scale(1.05) rotate(-2deg);filter:drop-shadow(0 0 6px rgba(255,255,255,0.4))}#robo-fala{background:#fff;color:#000;padding:10px 15px;border-radius:10px;font-size:0.85rem;max-width:220px;box-shadow:0 3px 10px rgba(0,0,0,0.2);animation:fadeInOut 5s ease-in-out}@keyframes flutuar{0%,100%{transform:translateY(0px)}50%{transform:translateY(-5px)}}body{transition:background-color 0.5s ease,color 0.5s ease}#robozinho{will-change:transform}@media (max-width:768px){.about-grid p{text-align:left !important}.hero{display:flex;flex-direction:column;justify-content:center;padding:3rem 1rem;min-height:100vh}.hero-content{transform:none;padding-top:2rem}}@media (max-width:768px){.about-grid{grid-template-columns:1fr !important;text-align:left}.about-grid img{max-width:100%;height:auto;display:block;margin:0 auto 1rem}.about-grid p{padding:0 1rem;font-size:1rem;word-spacing:normal !important;letter-spacing:normal !important}#user-location-time{font-size:0.75rem;text-align:left;padding:0 1rem;display:block !important}#videos video{width:100% !important;height:auto;background:#000}}@media (max-width:768px){section{padding-top:3rem !important;padding-bottom:3rem !important;margin-bottom:0 !important}#videos{padding-bottom:2rem !important}#videos video{margin-bottom:0 !important;height:auto !important;display:block;object-fit:cover}.about-grid p,#podcast p{text-align:justify !important;padding:0 1rem}#robozinho-container,#robo-fala{display:none !important}#user-location-time{font-size:0.75rem;padding:0 1rem;display:block}}body.light-theme .burger span{background-color:#000 !important}@media (max-width:768px){body.light-theme nav ul.open{background-color:rgba(255,255,255,0.85) !important;backdrop-filter:blur(5px) !important}body.light-theme nav ul.open li a{color:#000 !important}body:not(.light-theme) nav ul.open{background-color:rgba(13,13,13,0.9) !important}body:not(.light-theme) nav ul.open li a{color:var(--accent) !important}body.light-theme .burger span{background-color:#000 !important}body:not(.light-theme) .burger span{background-color:var(--fg) !important}}@media (max-width:768px){nav ul{height:auto !important;max-height:none !important}}body.light-theme{--accent:#d4b80f}@media (max-width:768px){nav ul.open{height:auto !important;max-height:none !important}body.light-theme nav ul.open{background-color:rgba(255,255,255,0.85) !important}body.light-theme nav ul.open li a{color:#333 !important}body:not(.light-theme) nav ul.open{background-color:rgba(13,13,13,0.9) !important}body:not(.light-theme) nav ul.open li a{color:var(--accent) !important}.burger span{background-color:var(--fg) !important}body.light-theme .burger span{background-color:#000 !important}}body.light-theme .modal-content h2,body.light-theme .modal-content h3{color:#000 !important}body.light-theme .modal-content{background-color:#fff !important;color:#111 !important}body.light-theme .modal-content ul li{color:#000 !important}body.light-theme .close-modal{color:#000 !important;background-color:transparent !important}#portfolio .portfolio-item img:hover{filter:none !important}#portfolio .portfolio-item:hover,#portfolio .portfolio-item:hover img{filter:none !important}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.burger:focus-visible{box-shadow:0 0 0 3px rgba(248,217,15,.35)}a:focus-visible,button:focus-visible{border-radius:6px}.burger{background:transparent;border:0;padding:8px;display:flex;flex-direction:column;gap:4px;-webkit-appearance:none;appearance:none}.burger span{width:24px;height:3px;display:block;background:var(--fg);border-radius:2px}.burger:focus{outline:none}.burger:focus-visible{box-shadow:0 0 0 3px rgba(248,217,15,.35)}section{scroll-margin-top:80px}@supports (min-height:100dvh){.hero{min-height:100dvh !important}}.hero{min-height:100vh}.burger{color:inherit}.burger span{background:currentColor !important}body.light-theme .burger{color:#111}body:not(.light-theme) .burger{color:#fff}@media (max-width:768px){header{transition:transform .28s ease;will-change:transform;}header.hide-on-mobile{transform:translateY(-100%);}}.dark-mode-toggle,#back-to-top{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:fixed;bottom:20px;z-index:9999;}.dark-mode-toggle{left:20px;}#back-to-top{right:20px;}.dark-mode-toggle img,.dark-mode-toggle svg,.dark-mode-toggle i,#back-to-top img,#back-to-top svg,#back-to-top i{width:60%;height:60%;object-fit:contain;display:block;margin:auto;}.dark-mode-toggle,#back-to-top{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:fixed;bottom:20px;z-index:9999;padding:0;}.dark-mode-toggle{left:20px;}#back-to-top{right:20px;}#ai-play{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:10010;border:0;cursor:pointer;background:#FFD300;color:#000;font-size:18px;line-height:1;box-shadow:0 4px 14px rgba(0,0,0,.15);}#ai-play:active{transform:translateX(-50%) scale(.98);}#ai-play[aria-pressed="true"]{filter:brightness(0.95);}#ai-play svg{width:60%;height:60%;display:block;pointer-events:none;}body.light-theme #robozinho-container #fechar-robo{background:#ffffff !important;color:#000000 !important;border:1px solid rgba(0,0,0,0.08) !important;box-shadow:0 2px 6px rgba(0,0,0,0.10) !important;top:0px !important;}body:not(.light-theme) #robozinho-container #fechar-robo{background:rgba(0,0,0,0.6) !important;color:#ffffff !important;border:none !important;}#fechar-robo svg{width:10px;height:10px;display:block;}

/* === BEGIN: style_consolidado.min.css === */
:root{ --fs-body: clamp(0.95rem, 0.28vw + 0.9rem, 1.05rem); --lh-body: 1.7; --fs-h2: clamp(1.6rem, 1.2vw + 1.2rem, 2.2rem); --fs-h3: clamp(1.125rem, 0.6vw + 1rem, 1.375rem); } section h2{ font-size: var(--fs-h2); line-height: 1.15; letter-spacing: -0.01em; } section h2, section h3 { text-align: center; width: 100%; } section h3{ font-size: var(--fs-h3); line-height: 1.25; } section p, .service-card p, #videos p, .carousel-section p, .portfolio-grid p{ font-size: var(--fs-body); line-height: var(--lh-body); } @media (min-width: 1024px) {} #scroll-progress{ opacity: 0; transition: opacity .25s ease; } #portfolio .intro-text{ white-space: normal !important; overflow: visible !important; text-overflow: clip !important; text-wrap: balance; } @media (max-width: 768px){ #portfolio .intro-text{ font-size: clamp(0.95rem, 0.7vw + 0.9rem, 1rem); line-height: 1.6; margin-left: auto; margin-right: auto; max-width: 36ch; } } :root{ --fs-h1: clamp(2.25rem, 3.5vw + 1rem, 4.25rem); } .hero h1, section h2, section h3{ font-family: "Sora", Inter, Poppins, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important; letter-spacing: -0.015em; } .hero h1{ font-size: var(--fs-h1); line-height: 1.05; } section h2{ line-height: 1.15; } section h3{ line-height: 1.2; } @media (min-width: 1024px) {} html { scroll-behavior: smooth; } .btn{ border-radius: 9999px !important; transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease; will-change: transform; } .btn:hover, .btn:focus{ transform: translateY(-1px); box-shadow: 0 8px 24px rgba(0,0,0,.18); outline: none; } section h2{ position: relative; display: inline-block; padding-bottom: .25rem; } section h2, section h3 { text-align: center; width: 100%; } @keyframes grad-move{ 0%{ background-position: 0% 50%; } 100%{ background-position: 200% 50%; } } h2 i, h3 i, .social-icons i{ background: linear-gradient(90deg, #f8d90f, #ff8a00, #f8d90f); -webkit-background-clip: text; background-clip: text; color: transparent; animation: grad-move 8s linear infinite; } .service-card, .portfolio-item img, .carousel-track img, #videos video{ transition: transform .25s ease, box-shadow .25s ease, filter .25s ease; } .service-card:hover{ transform: translateY(-3px); box-shadow: 0 10px 28px rgba(0,0,0,.15); } .portfolio-item img:hover, .carousel-track img:hover{ transform: scale(1.03); box-shadow: 0 10px 28px rgba(0,0,0,.22); } #videos video:hover{ transform: scale(1.01); box-shadow: 0 10px 28px rgba(0,0,0,.2); filter: saturate(1.05); } #ai-play.playing{ animation: pulse 1.4s ease-in-out infinite; } @keyframes pulse{ 0%{ box-shadow: 0 0 0 0 rgba(248,217,15,.5); } 70%{ box-shadow: 0 0 0 12px rgba(248,217,15,0); } 100%{ box-shadow: 0 0 0 0 rgba(248,217,15,0); } } a, button, [role="button"], .portfolio-item img, .carousel-track img{ cursor: pointer; } @media (min-width: 1024px) {} #ai-play { position: fixed; bottom: 20px; right: 20px; z-index: 9999; width: 44px; height: 44px; border: none; border-radius: 9999px; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(0,0,0,.2); background: #f8d90f; color: #000; cursor: pointer; } @media (max-width: 480px) { #ai-play { bottom: 16px; right: 16px; width: 40px; height: 40px; } } #themeToggle { z-index: 9999; } [role="button"]:focus { outline: 3px solid rgba(248,217,15,.7); outline-offset: 2px; } @media (min-width: 1024px) {} .reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease, transform .6s ease} .reveal.active{opacity:1;transform:none} @media (min-width: 1024px) {} section h2{ position: relative; display: block; width: 100%; text-align: center; padding-bottom: .35rem; } section h2::after{ content: ""; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 3px; background: linear-gradient(90deg, #f8d90f, #ff8a00, #f8d90f); background-size: 200% 100%; transform: scaleX(0); transform-origin: left; transition: transform .5s ease .05s; border-radius: 3px; animation: grad-move 6s linear infinite; } .reveal.active h2::after, section.reveal.active h2::after, section .reveal.active h2::after{ transform: scaleX(1); } @media (min-width: 1024px) {} @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { animation: none !important; transition: none !important; } } @media (min-width: 1024px) {} body:not(.aos-ready) [data-aos] { opacity: 1 !important; transform: none !important; } body.aos-disabled [data-aos] { opacity: 1 !important; transform: none !important; } @media (min-width: 1024px) {} :root{ --text-strong: #ffffff; --text-soft: rgba(255,255,255,.92); --text-muted: rgba(255,255,255,.78); --text-dim: rgba(255,255,255,.68); } body:not(.light-theme) #podcast p, body:not(.light-theme) #videos p, body:not(.light-theme) .service-card p{ color: var(--text-soft); } body:not(.light-theme) .carousel-section p, body:not(.light-theme) .portfolio-grid p{ color: var(--text-muted); } body.light-theme #podcast p, body.light-theme #videos p, body.light-theme .service-card p, body.light-theme .carousel-section p{ color: #202020; } section h2, section h3{ color: var(--text-strong); } #fechar-robo, #themeToggle, #ai-play, .carousel-btn{ min-width: 44px; min-height: 44px; } .carousel-container{ overflow: hidden; } .carousel-track{ display: flex; width: 100%; } .carousel-track img{ flex: 0 0 100%; width: 100%; height: auto; } :focus-visible { outline: 3px solid rgba(248,217,15,.8); outline-offset: 2px; } .sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; } #contact input, #contact textarea, #contact button{ min-height: 44px; } #contact input:focus, #contact textarea:focus{ box-shadow: 0 0 0 3px rgba(248,217,15,.35); } @media (min-width: 1024px) {} body.light-theme #services h3 { color: #000 !important; } @media (min-width: 1024px) {} body.light-theme section h2, body.light-theme section h3{ color: #111 !important; } body.light-theme #about p, body.light-theme #services p, body.light-theme #videos p, body.light-theme .carousel-section p, body.light-theme .portfolio-grid p, body.light-theme #contact label, body.light-theme #contact input::placeholder, body.light-theme #contact textarea::placeholder{ color: #222 !important; } .carousel-btn{ background: rgba(0,0,0,.75); color: #fff; border: 1px solid rgba(255,255,255,.5); border-radius: 9999px; padding: .35rem .65rem; box-shadow: 0 2px 8px rgba(0,0,0,.25); } .carousel-btn:focus-visible{ outline: 3px solid rgba(248,217,15,.85); outline-offset: 2px; } body.light-theme .carousel-btn{ background: rgba(0,0,0,.75); color: #fff; border-color: rgba(0,0,0,.25); } body.light-theme header #user-location-time{ color: #111 !important; } body.light-theme header nav a{ color: #111; } body.light-theme header nav a:focus-visible, body.light-theme header nav a:hover{ text-decoration: underline; } body.light-theme #services h3{ color: #000 !important; } body.light-theme .btn{ background: #111; color: #fff; border: 1px solid #111; } body.light-theme .btn:hover, body.light-theme .btn:focus{ background: #000; color: #fff; } body.light-theme #contact input, body.light-theme #contact textarea{ border: 1px solid rgba(0,0,0,.25); color: #111; background: #fff; } @media (min-width: 1024px) {} @media (prefers-reduced-motion: no-preference) { .mi-fade-up { opacity: 0; transform: translateY(8px); transition: opacity .5s ease, transform .5s ease; will-change: opacity, transform; } .mi-in { opacity: 1; transform: none; } .btn { transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease; } .btn:active { transform: translateY(0); } .service-card.mi-fade-up { transition-duration: .6s; transition-timing-function: cubic-bezier(.2,.7,.2,1); } } @media (min-width: 1024px) {} #gallery, #videos, #portfolio { content-visibility: auto; contain-intrinsic-size: 1px 1000px; } @media (min-width: 1024px) {} #menu-backdrop{ display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:9980; backdrop-filter:saturate(120%) blur(1px); } #nav-list.open ~ #menu-backdrop{ display:block; } @media (min-width: 769px){ #menu-backdrop{ display:none !important; } } @media (min-width: 1024px) {} .carousel-container:focus{ outline: 3px solid rgba(248,217,15,.8); outline-offset: 3px; } @media (min-width: 1024px) {} .image-modal { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; background: rgba(0,0,0,.8); z-index: 10000; } .image-modal img { max-width: 92vw; max-height: 88vh; border-radius: 10px; } .image-modal .close-modal { position: absolute; top: 16px; right: 16px; font-size: 28px; background: rgba(0,0,0,.6); color: #fff; border-radius: 999px; width: 40px; height: 40px; display:flex; align-items:center; justify-content:center; cursor:pointer; } .modal-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,.6); color: #fff; border: 1px solid rgba(255,255,255,.35); border-radius: 9999px; width: 48px; height: 48px; display:flex; align-items:center; justify-content:center; cursor: pointer; font-size: 24px; user-select: none; } .modal-nav.prev { left: 18px; } .modal-nav.next { right: 18px; } .modal-nav:focus-visible, .close-modal:focus-visible { outline: 3px solid rgba(248,217,15,.85); outline-offset: 2px; } @media (max-width: 480px){ .modal-nav { width: 42px; height: 42px; font-size: 20px; } } @media (min-width: 1024px) {} #modalFooter{ position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); display: grid; grid-template-columns: auto; gap: 8px; text-align: center; max-width: 92vw; color: #fff; font-size: .95rem; background: rgba(0,0,0,.5); padding: 10px 14px; border-radius: 10px; box-shadow: 0 6px 20px rgba(0,0,0,.35); } #modalProgress{ font-weight: 600; letter-spacing: .3px; } #modalCaption{ opacity: .95; } @media (min-width: 1024px) {} .modal-caption { font-size: 16px; margin-top: 10px; text-align: center; color: #f1f1f1; line-height: 1.4; padding: 5px 10px; word-wrap: break-word; max-width: 90%; margin-left: auto; margin-right: auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } @media (max-width: 768px) {.modal-caption { font-size: 14px; padding: 8px; -webkit-line-clamp: 2; } } @media (min-width: 1024px) {} .modal-type-badge{ position: absolute; top: 16px; left: 50%; transform: translateX(-50%); text-align:center; z-index: 10001; background: rgba(0,0,0,.65); color: #fff; padding: 6px 10px; border-radius: 9999px; font-size: .9rem; font-weight: 600; letter-spacing: .2px; backdrop-filter: saturate(120%) blur(1px); max-width: 70vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border: 1px solid rgba(255,255,255,.35); } @media (max-width: 480px){ .modal-type-badge{ top: 12px; left: 50%; transform: translateX(-50%); text-align:center; font-size: .85rem; padding: 5px 9px; } } body.light-theme .modal-type-badge{ background: rgba(0,0,0,.75); color: #fff; border-color: rgba(0,0,0,.25); } @media (min-width: 1024px) {} #scrollTopBtn{display:none;} @media (max-width: 480px){ .carousel button, .modal .nav-btn, .nav-prev, .nav-next, .close, .fechar, .modal-close, #closeModal, button, .btn { min-width: 48px; min-height: 48px; } } @media (min-width: 1024px) {} header .logo{ display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-weight: 600; } header .logo i{ transition: color .2s ease; } header .logo:hover i{ color: #f8d90f; } @media (min-width: 1024px) {} @media (max-width: 768px){.hero h1{ margin-bottom: 2rem; } .hero p{ margin-bottom: 2.5rem; } } @media (max-width: 480px){} @media (min-width: 1024px) {} #user-location-time{ font-size: clamp(0.8rem, 1.2vw + 0.7rem, 0.95rem); text-wrap: balance; } @media (max-width: 480px){ #user-location-time{ font-size: 0.85rem; padding: 0 8px; } } @media (min-width: 1024px) {} @media (max-width: 768px) {#about p { text-align: left !important; text-wrap: balance; } } @media (min-width: 1024px) {} @media (max-width: 768px) {#podcast p { text-align: left !important; } } @media (min-width: 1024px) {} #videos p.aos-animate { opacity: 1 !important; transform: none !important; } @media (min-width: 1024px) {} @media (max-width: 768px){ #podcast p, #videos p { margin-bottom: 1.25rem !important; } .btn { padding-left: 1rem; padding-right: 1rem; } } @media (min-width: 1024px) {} :root { --header-offset: 88px; } @media (max-width: 768px) {:root { --header-offset: 72px; } } section[id] { scroll-margin-top: var(--header-offset); } @media (min-width: 1024px) {} #scroll-progress{position:fixed;top:0;left:0;right:0;height:4px;background:transparent;z-index:10001} #scroll-progress .bar{height:100%;width:0;background:linear-gradient(90deg,#f8d90f,#ff8a00,#f8d90f);background-size:200% 100%;animation:grad-move 6s linear infinite} @media (min-width: 1024px) {} body.modal-zoom-out header, body.modal-zoom-out section, body.modal-zoom-out footer, body.modal-zoom-out .hero{ transform: scale(.985); filter: blur(1px) brightness(.92); transition: transform .2s ease, filter .2s ease; } @media (min-width: 1024px) {} :root{ font-optical-sizing:auto; } .hero.theme-fade *{ transition: background-color .2s ease, color .2s ease, border-color .2s ease, fill .2s ease, stroke .2s ease; } @media (min-width: 1024px) {} .skip-link{ position: absolute; top: -40px; left: 10px; background: #f8d90f; color: #000; padding: 8px 12px; border-radius: 8px; font-weight: 600; transition: top .2s ease; z-index: 10002; } .skip-link:focus{ top: 10px; outline: 3px solid rgba(0,0,0,.6); } header nav a.active{ color:#f8d90f !important; font-weight:700; text-decoration:none; } @media (min-width: 1024px) {} .mi-fade-up, .reveal { will-change: opacity, transform; } .mi-fade-up{ opacity: 0; transform: translateY(10px); } .mi-fade-up.mi-in{ opacity: 1; transform: none; transition: opacity .5s cubic-bezier(.2,.7,.2,1), transform .5s cubic-bezier(.2,.7,.2,1); } @media (min-width: 1024px) {} img.blur-up{ filter: blur(12px); transform: scale(1.02); transition: filter .5s ease, transform .5s ease; } img.blur-up.loaded{ filter: blur(0); transform: none; } @media (min-width: 1024px) {} header nav a{ opacity:.85; transition: color .2s ease, opacity .2s ease; text-decoration:none !important; } header nav a:hover, header nav a:focus-visible{ opacity:1; text-decoration:none !important; } header nav a.active{ color:#f8d90f !important; opacity:1; font-weight:600; text-decoration:none !important; } @media (min-width: 1024px) {} .intro-text{ text-align: center; font-size: clamp(1rem, 0.6vw + 0.9rem, 1.1rem); font-weight: 300; color: rgba(255,255,255,.9); max-width: 900px; margin: 10px auto 28px auto; line-height: 1.65; } body.light-theme .intro-text{ color: #222; } @media (min-width: 1024px) {} section { padding: 80px 0; } @media (max-width: 768px) {section { padding: 60px 0; } } @media (min-width: 1024px) {} h2 + .intro-text { margin-top: 14px; } @media (min-width: 1024px) {} .intro-text { margin-bottom: 10px !important; } @media (max-width: 768px) {.intro-text { margin-bottom: 8px !important; } } @media (min-width: 1024px) {} @media (max-width: 768px) {body, section { padding-left: 16px !important; padding-right: 16px !important; } } @media (min-width: 1024px) {} @media (min-width:1024px){ .hero-content{ margin-top:150px; } } header, #hero, footer{ content-visibility:visible; } #portfolio, #portfolio * { visibility: visible !important; opacity: 1 !important; } .portfolio-text{ line-height: 1.5; } @media (max-width: 768px){ .portfolio-text{ font-size: 0.95rem; } } @media (min-width: 769px){ .portfolio-text{ font-size: 1.05rem; } } h2{ font-weight: 700; } @media (max-width: 768px){ header nav a{ display: inline-flex; align-items: center; min-height: 44px; padding: 8px 10px; } } #scrollTopBtn{ position: fixed; bottom: 24px; right: 24px; z-index: 10002; border: none; border-radius: 9999px; padding: 10px 14px; box-shadow: 0 6px 20px rgba(0,0,0,.25); background: #f8d90f; color: #000; font-weight: 700; cursor: pointer; opacity: 0; transform: translateY(6px); transition: opacity .25s ease, transform .25s ease; pointer-events: none; } #scrollTopBtn.visible{ opacity: 1; transform: none; pointer-events: auto; } #scrollTopBtn:focus-visible{ outline: 3px solid rgba(0,0,0,.6); outline-offset: 2px; } @media (max-width: 480px){ #scrollTopBtn{ bottom: 16px; right: 16px; } } @supports not (text-wrap: balance){ .intro-text, #about p{ text-wrap: normal; } } body.light-theme header nav a{ text-decoration: none !important; } body.light-theme header nav a:hover, body.light-theme header nav a:focus-visible{ text-decoration: none !important; } body.light-theme header nav a.active{ color: #111 !important; font-weight: 700; } body.light-theme header nav a.active::after{ content: none !important; } body.light-theme header nav a { -webkit-tap-highlight-color: rgba(248,217,15,0.45); } body:not(.light-theme) header nav a { -webkit-tap-highlight-color: rgba(255,255,255,0.35); } #scrollTopBtn { display: flex; align-items: center; justify-content: center; font-size: 1rem; line-height: 1; } #themeToggle, #ai-play, #scrollTopBtn { display: flex; align-items: center; justify-content: center; font-size: 1rem; line-height: 1; } @media (max-width: 768px){ .hero .hero-content{ margin-top: 140px !important; } } @media (max-width: 768px){ header { display: flex; flex-direction: column; align-items: stretch; } header > div.logo { order: 1; } header nav { order: 2; } header .burger, header .social-icons { order: 3; } .menu-social-row { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 0 10px; } .menu-social-row .burger { margin: 0; } .menu-social-row .social-icons a { font-size: 1.2rem; } header #user-location-time { order: 4; text-align: right; padding: 6px 10px 0 0; font-size: 0.8rem; } } @media (max-width: 768px){ header{ display: grid !important; grid-template-columns: 1fr; grid-template-areas: "logo" "actions" "info" "nav"; row-gap: 6px; align-items: center; justify-items: center; padding: 10px 12px; } header .logo{ grid-area: logo; justify-self: center; text-align: center !important; font-weight: 800; letter-spacing: .2px; } header .menu-social-row{ grid-area: actions; display: inline-flex !important; align-items: center; justify-content: center; gap: 14px; width: 100%; } header .menu-social-row .social-icons{ display: inline-flex !important; align-items: center; gap: 12px; } header .menu-social-row .social-icons i{ font-size: 1.24rem; line-height:1; } header #burger{ width: 40px; height: 40px; display: inline-flex; align-items:center; justify-content:center; border-radius: 999px; border: 1px solid transparent; background: transparent; } header #burger span{ display:block; width:20px; height:2px; margin:2px 0; border-radius:2px; transition: background-color .2s ease; } header #burger:focus-visible{ outline: 3px solid rgba(248,217,15,.85); outline-offset: 2px; } header #user-location-time{ grid-area: info; text-align: center !important; font-size: 0.85rem; line-height: 1.25; padding: 2px 8px; border-radius: 8px; white-space: nowrap; } header nav{ grid-area: nav; justify-self: stretch; } body.light-theme header .logo, body.light-theme header #user-location-time{ color:#111 !important; } body:not(.light-theme) header .logo, body:not(.light-theme) header #user-location-time{ color:#fff !important; } body.light-theme header .menu-social-row .social-icons i{ color:#111 !important; } body:not(.light-theme) header .menu-social-row .social-icons i{ color:#f8d90f !important; } body.light-theme header #burger span{ background:#111 !important; } body:not(.light-theme) header #burger span{ background:#f8d90f !important; } header .menu-social-row .social-icons i{ background: none !important; -webkit-background-clip: initial !important; background-clip: initial !important; color: inherit !important; } @media (max-width: 380px){ header #user-location-time{ white-space: normal; text-wrap: balance; } } } @media (max-width: 768px){ header{ row-gap: 8px !important; } header #burger{ width:44px !important; height:44px !important; } header .menu-social-row{ gap: 16px !important; } header .menu-social-row .social-icons i{ font-size: 1.28rem !important; } } @media (max-width: 360px){ header #user-location-time{ white-space: normal !important; text-wrap: balance; } } #scroll-progress{ position: fixed; top: 0; left: 0; right: 0; height: 4px; background: transparent; z-index: 9999; opacity: 0; transition: opacity .25s ease; } #scroll-progress .bar{ height: 100%; width: 0; background: linear-gradient(90deg, #f5c542, #ffd26a); } #scrollTopBtn{ position: fixed; right: 1rem; bottom: 1.25rem; padding: .6rem .8rem; border: none; border-radius: 10px; background: rgba(0,0,0,.5); color: #fff; font-size: 1.1rem; cursor: pointer; backdrop-filter: blur(6px); opacity: 0; transform: translateY(10px); transition: opacity .2s ease, transform .2s ease; z-index: 9999; } #scrollTopBtn.visible{ opacity: 1; transform: translateY(0); } .user-time{ font-size: .95rem; opacity: .9; margin: .25rem 0; } .light-theme .user-time{ color: #111; } .aos-disabled *{ animation: none !important; transition: none !important; } header nav a.active{ text-decoration: underline; text-underline-offset: .3em; text-decoration-thickness: 2px; } #videos video{ display:block; width:100%; height:auto; } .light-theme #vamos-conversar { background-color: #f5c542 !important; color: #111 !important; } .dark-theme #vamos-conversar { background: transparent !important; border: 2px solid #f5c542 !important; color: #f5c542 !important; } html:not(.light-theme) #vamos-conversar { background: transparent !important; border: 2px solid #f5c542 !important; color: #f5c542 !important; } #robo{ display:inline-block; margin:14px 0 26px; line-height:0; } #robo .pose{ display:none; max-width:min(240px, 55vw); height:auto; opacity:0; transform:translateY(4px); transition:opacity .25s ease, transform .25s ease; } #robo .pose.is-visible{ display:block; opacity:1; transform:none; } @media (max-width:480px){ #robo .pose{ max-width:200px; } } section h2.aos-animate::after { transform: scaleX(1); } .typed-cursor { display: inline-block; font-weight: 400; line-height: 1; margin-left: 2px; } #typed-text { text-wrap: balance; } #robo .pose { font-size: 0; line-height: 0; } #robo .pose{ aspect-ratio: 1 / 1; } #typed-text{ display:inline-block; max-width: 60ch; white-space: normal !important; } .hero p{ overflow-wrap: anywhere; } [data-aos] { opacity: 1 !important; transform: none !important; } @media (min-width: 1024px) {} nav a.is-active { text-decoration: underline; text-underline-offset: 4px; } @media (min-width: 1024px) {}

/* === BEGIN: style_ultra.css === */
/* --- inline block 1 --- */
#particles-canvas {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: -1;
    opacity: 0.3; transition: opacity 0.5s ease;
  }
  @media (max-width: 1024px), (prefers-reduced-motion: reduce) { 
    #particles-canvas { display: none !important; } 
  }
  body.scrolled #particles-canvas { opacity: 0.15; } /* Diminui no scroll */


/* --- inline block 2 --- */
/* Remove QUALQUER seta ou botão de navegação DENTRO do Portfólio */
  #portfolio *[class*="arrow"],
  #portfolio *[class*="slick"],
  #portfolio *[data-role*="injected"],
  #portfolio button[aria-label*="Next" i],
  #portfolio button[aria-label*="Anterior" i],
  #portfolio button[aria-label*="Próxima" i],
  #portfolio button[aria-label*="Prev" i],
  #portfolio .carousel-btn,
  #portfolio .slick-prev,
  #portfolio .slick-next,
  #portfolio .slick-arrow,
  #portfolio button {
      opacity: 0 !important;
      display: none !important;
      visibility: hidden !important;
      pointer-events: none !important;
  }


/* --- inline block 3 --- */
/* === CURSOR HOLOGRÁFICO UNIFICADO — Bruno Ricardo 2025 === */
  .custom-cursor {
    position: fixed;
    top: 0; 
    left: 0;
    width: 20px; 
    height: 20px;
    border: 2px solid #f8d90f; /* Amarelo da identidade */
    border-radius: 50%;
    pointer-events: none;
    transform: translate(-50%, -50%);
    z-index: 99999;
    mix-blend-mode: difference; /* Visível em dark/light */
    transition: 
      width 0.35s cubic-bezier(0.22, 1, 0.36, 1),
      height 0.35s cubic-bezier(0.22, 1, 0.36, 1),
      background-color 0.35s ease,
      opacity 0.4s ease;
    will-change: transform;
  }

  .custom-cursor-dot {
    position: fixed;
    top: 0; 
    left: 0;
    width: 4px; 
    height: 4px;
    background: #f8d90f;
    border-radius: 50%;
    pointer-events: none;
    transform: translate(-50%, -50%);
    z-index: 99999;
    transition: 
      opacity 0.4s ease,
      transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
  }

  /* Estado hover em elementos interativos */
  body.hovering .custom-cursor {
    width: 50px; 
    height: 50px;
    background-color: rgba(248, 217, 15, 0.1);
    border-color: transparent;
  }

  /* Cursor levemente mais transparente após scroll */
  body.scrolled .custom-cursor { 
    opacity: 0.6; 
  }

  /* Mostra o cursor holográfico apenas em desktops com pointer preciso */
  @media (min-width: 992px) and (pointer: fine) {
    body, a, button, input, textarea, .logo, .portfolio-item {
      cursor: none !important;
    }
  }

  /* Esconde totalmente em tablets / telas de toque */
  @media (max-width: 1024px), (pointer: coarse) {
    .custom-cursor,
    .custom-cursor-dot {
      display: none !important;
    }
  }

  /* Segurança extra: nunca bloqueia cliques */
  .custom-cursor,
  .custom-cursor-dot {
    pointer-events: none !important;
  }


/* --- inline block 4 --- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
    }
    .custom-cursor, .custom-cursor-dot { display: none !important; }
    #robo { animation: none !important; }
  }


/* --- inline block 5 --- */
/* Força os títulos do currículo a usarem a mesma fonte do nome "Bruno Ricardo" */
.cv-section-title{
  font-family:'Poppins',sans-serif !important;
  font-weight:600 !important;
}


/* --- inline block 6 --- */
/* === Glassmorphism Maduro — Bruno Ricardo === */
.br-glass {
  background: rgba(0,0,0,0.60);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow:
    inset 0 0 0.5px rgba(255,255,255,0.12),
    0 4px 18px rgba(0,0,0,0.35);
  border-radius: 16px;
  transition: all .35s ease;
}

html.light-theme .br-glass {
  background: rgba(255,255,255,0.55);
  border: 1px solid rgba(0,0,0,0.10);
}


/* --- inline block 7 --- */
/* Tipografia institucional + criativa */
body, p, li {
  font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif !important;
  line-height: 1.6;
  font-weight: 400;
}

h1, h2, h3 {
  font-family: "Share Tech Mono", "Sora", "Poppins", system-ui, sans-serif !important;
  letter-spacing: -0.01em;
}


/* --- inline block 8 --- */
#br-preload {
  position: fixed;
  inset: 0;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999999;
  transition: opacity .5s ease;
}

#br-preload.fade-out {
  opacity: 0;
  pointer-events: none;
}

#br-preload .pulse {
  width: 56px;
  height: 56px;
  border: 4px solid rgba(248,217,15,0.15);
  border-top-color: #f8d90f;
  border-right-color: #79ffeb;
  background: conic-gradient(from 0deg, #f8d90f, #79ffeb, #f8d90f);
  animation: brSpin 1.2s linear infinite;
  box-shadow: 0 0 30px rgba(248,217,15,0.6);
  opacity: 0.9;
}


@keyframes brSpin {
  to { transform: rotate(360deg); }
}


/* --- inline block 9 --- */
/* Desativa o preloader + FOUC travado em mobile/WebView (Instagram, etc.) */
  @media (max-width: 860px) {
    #br-preload {
      display: none !important;
    }
    html {
      opacity: 1 !important;
    }
  }


/* --- inline block 10 --- */
/* Evita flash antes do tema aplicar, mas sem sumir o layout */
  html{
    opacity: 0;
    transition: opacity .001s linear;
  }

  /* Oculta alternador até o JS marcar que o tema foi aplicado */
  .theme-toggle{
    visibility: hidden;
  }

  /* Oculta todas as poses do robô por padrão (FOUC das poses) */
  #robo .pose{display:none}

  /* Botões de fechar estilo "X" consistente (galeria/portfólio/robo) */
  .close-modal,
  .gallery-close,
  .robo-close {
    position: relative;
    font-size: 0 !important;
    color: transparent !important;
    width: 40px; height: 40px;
    border-radius: 999px;
    display: inline-flex; align-items:center; justify-content:center;
    background: transparent;
    border: 0;
    outline: none;
    cursor: pointer;
  }
  .close-modal::before, .close-modal::after,
  .gallery-close::before, .gallery-close::after,
  .robo-close::before, .robo-close::after {
    content: "";
    position: absolute;
    width: 24px; height: 2px;
    top: 50%; left: 50%;
    transform-origin: center;
    background: currentColor;
  }
  .close-modal::before, .gallery-close::before, .robo-close::before { transform: translate(-50%,-50%) rotate(45deg); }
  .close-modal::after,  .gallery-close::after,  .robo-close::after  { transform: translate(-50%,-50%) rotate(-45deg); }

  /* Cores por tema para o "X" */
  html.light-theme .close-modal,
  html.light-theme .gallery-close,
  html.light-theme .robo-close { color: #111; }
  html.dark-theme .close-modal,
  html.dark-theme .gallery-close,
  html.dark-theme .robo-close  { color: #fff; }

  /* Hover translúcido */
  html.dark-theme .close-modal:hover,
  html.dark-theme .gallery-close:hover,
  html.dark-theme .robo-close:hover { background: rgba(255,255,255,.25); }
  html.light-theme .close-modal:hover,
  html.light-theme .gallery-close:hover,
  html.light-theme .robo-close:hover { background: rgba(0,0,0,.08); }

  /* Ícones do alternador de tema via CSS mask: sol com 16 raios e lua crescente */
  .theme-toggle .icon {
    width: 22px; height: 22px; display:inline-block;
    background: currentColor; -webkit-mask-size: contain; mask-size: contain;
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    -webkit-mask-position: center; mask-position: center;
  }
  /* Sol (mask SVG) — forma limpa com raios definidos */
  .theme-toggle .icon-sun {
    -webkit-mask-image: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>   <g fill='%23000' stroke='%23000' stroke-width='0'>     <circle cx='12' cy='12' r='5'/>     <g>       <rect x='11' y='1' width='2' height='4'/>       <rect x='11' y='19' width='2' height='4'/>       <rect x='19' y='11' width='4' height='2'/>       <rect x='1' y='11' width='4' height='2'/>       <rect x='17.071' y='3.515' width='2' height='4' transform='rotate(45 18.071 5.515)'/>       <rect x='4.929' y='16.485' width='2' height='4' transform='rotate(45 5.929 18.485)'/>       <rect x='3.515' y='4.929' width='2' height='4' transform='rotate(-45 4.515 6.929)'/>       <rect x='16.485' y='17.071' width='2' height='4' transform='rotate(-45 17.485 19.071)'/>     </g>   </g> </svg>");
    mask-image: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>   <g fill='%23000' stroke='%23000' stroke-width='0'>     <circle cx='12' cy='12' r='5'/>     <g>       <rect x='11' y='1' width='2' height='4'/>       <rect x='11' y='19' width='2' height='4'/>       <rect x='19' y='11' width='4' height='2'/>       <rect x='1' y='11' width='4' height='2'/>       <rect x='17.071' y='3.515' width='2' height='4' transform='rotate(45 18.071 5.515)'/>       <rect x='4.929' y='16.485' width='2' height='4' transform='rotate(45 5.929 18.485)'/>       <rect x='3.515' y='4.929' width='2' height='4' transform='rotate(-45 4.515 6.929)'/>       <rect x='16.485' y='17.071' width='2' height='4' transform='rotate(-45 17.485 19.071)'/>     </g>   </g> </svg>");
  }
  /* Lua crescente */
  .theme-toggle .icon-moon {
    -webkit-mask-image: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>   <path d='M21 12.5A9 9 0 0 1 9.5 3a9 9 0 1 0 11.5 9.5Z' fill='%23000'/> </svg>");
    mask-image: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>   <path d='M21 12.5A9 9 0 0 1 9.5 3a9 9 0 1 0 11.5 9.5Z' fill='%23000'/> </svg>");
  }


/* --- inline block 11 --- */
#themeToggle{
    opacity:0!important;
    visibility:hidden;
  }
  #robo .pose { display: none !important; }

  /* Esconde o robozinho até o JS definir a imagem correta conforme o tema */
  #robozinho {
    opacity: 0;
    transition: opacity .25s ease-out;
  }


/* --- inline block 12 --- */
html { visibility: visible; }
 html[data-prerender="true"] body { visibility: hidden; }


/* --- inline block 13 --- */
/* Esconde QUALQUER ícone existente dentro do botão (FA, SVG etc.) */
 #themeToggle i, #themeToggle svg, #themeToggle [class*="fa-"], #themeIcon i, #themeIcon svg { display:none !important; }

 /* Ícone via CSS mask: SOL preto sólido (não vazado) */
 #themeToggle::before{
 content:"";
 display:inline-block;
 width:1.2em;height:1.2em;
 vertical-align:middle;
 background:currentColor;
 -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='5.5'/><rect x='11.2' y='1.6' width='1.6' height='3.2' rx='0.8'/><rect x='11.2' y='19.2' width='1.6' height='3.2' rx='0.8'/><rect x='19.2' y='11.2' width='3.2' height='1.6' rx='0.8'/><rect x='1.6' y='11.2' width='3.2' height='1.6' rx='0.8'/><g transform='rotate(45 12 12)'><rect x='11.4' y='2.6' width='1.2' height='2.4' rx='0.6'/><rect x='11.4' y='19.0' width='1.2' height='2.4' rx='0.6'/><rect x='19.0' y='11.4' width='2.4' height='1.2' rx='0.6'/><rect x='2.6' y='11.4' width='2.4' height='1.2' rx='0.6'/></g></svg>") no-repeat center / contain;
 mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='5.5'/><rect x='11.2' y='1.6' width='1.6' height='3.2' rx='0.8'/><rect x='11.2' y='19.2' width='1.6' height='3.2' rx='0.8'/><rect x='19.2' y='11.2' width='3.2' height='1.6' rx='0.8'/><rect x='1.6' y='11.2' width='3.2' height='1.6' rx='0.8'/><g transform='rotate(45 12 12)'><rect x='11.4' y='2.6' width='1.2' height='2.4' rx='0.6'/><rect x='11.4' y='19.0' width='1.2' height='2.4' rx='0.6'/><rect x='19.0' y='11.4' width='2.4' height='1.2' rx='0.6'/><rect x='2.6' y='11.4' width='2.4' height='1.2' rx='0.6'/></g></svg>") no-repeat center / contain;
 }

 /* Força cor preta no estado de SOL (quando NÃO está em light-theme) */
 html:not(.light-theme) #themeToggle{ color:#000 !important; }

 /* LUA (claro) — mantém ícone de lua */
 html.light-theme #themeToggle::before{
 -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M21 12.79A9 9 0 1 1 11.21 3a7 7 0 1 0 9.79 9.79z'/></svg>");
 mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M21 12.79A9 9 0 1 1 11.21 3a7 7 0 1 0 9.79 9.79z'/></svg>");
 }

 #themeToggle{display:inline-flex;align-items:center;justify-content:center}


/* --- inline block 14 --- */
body, p, a, span {
    font-family: 'Inter', 'Poppins', sans-serif !important;
  }
  h1, h2, h3,
  .hero h1 {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 700 !important;
  }


/* --- inline block 15 --- */
#imageModal .modal-nav{appearance:none;-webkit-appearance:none;width:56px;height:56px;border-radius:50%;background:rgba(0,0,0,.9);color:#fff;border:1.5px solid rgba(255,255,255,.35);display:inline-flex;align-items:center;justify-content:center;line-height:1;cursor:pointer;box-shadow:none !important;outline:none;}#imageModal .modal-nav:hover{background:rgba(0,0,0,1);border-color:rgba(255,255,255,.65);}#imageModal .modal-nav:focus-visible{outline:3px solid #f8d90f;outline-offset:2px;box-shadow:none !important;}#imageModal .modal-nav::before,#imageModal .modal-nav::after{content:none !important;box-shadow:none !important;}


/* --- inline block 16 --- */
header nav #nav-list li a:hover,header nav #nav-list li a:focus,header nav #nav-list li a:active,#nav-list li a:hover,#nav-list li a:focus,#nav-list li a:active,#nav-list a[href="#about"]:hover,#nav-list a[href="#about"]:focus,#nav-list a[href="#about"]:active{color:#fff !important;}#nav-list a.active{color:#f8d90f !important;text-shadow:0 0 6px rgba(248,217,15,0.35);transition:color .25s ease,text-shadow .25s ease;}


/* --- inline block 17 --- */
html.light-theme header nav #nav-list li a{color:#111 !important;text-shadow:none !important;}html.light-theme header nav #nav-list li a:hover,html.light-theme header nav #nav-list li a:focus,html.light-theme header nav #nav-list li a:active,html.light-theme #nav-list li a:hover,html.light-theme #nav-list li a:focus,html.light-theme #nav-list li a:active{color:#111 !important;text-shadow:none !important;}html.light-theme #nav-list a.active{color:#111 !important;text-shadow:none !important;}html.light-theme header nav #nav-list li a:focus-visible{outline:3px solid #f8d90f;outline-offset:3px;border-bottom:none;}


/* --- inline block 18 --- */
#gallery .carousel-container{position:relative;width:100%;overflow:hidden;}#gallery .carousel-track{display:flex;gap:0;transition:transform 0.5s ease;will-change:transform;}#gallery .carousel-track img{flex:0 0 100%;width:100%;height:auto;object-fit:contain;user-select:none;-webkit-user-drag:none;}#gallery .carousel-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:44px;border-radius:50%;border:none;background:rgba(0,0,0,.85);color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;}#gallery .carousel-btn.prev{left:8px;}#gallery .carousel-btn.next{right:8px;}#gallery .carousel-btn:focus-visible{outline:3px solid #f8d90f;outline-offset:2px;}


/* --- inline block 19 --- */
#imageModal[aria-hidden="true"]{display:none !important;}#imageModal[aria-hidden="false"]{display:flex !important;}


/* --- inline block 20 --- */
.logo:focus{outline:none !important;box-shadow:none !important;}.logo:hover{color:#f8d90f !important;transition:color 0.25s ease;}


/* --- inline block 21 --- */
#portfolio-grid .portfolio-item{display:block !important;visibility:visible !important;}#portfolio-grid img{max-width:100%;height:auto;display:block;}#portfolio{overflow:visible !important;}


/* --- inline block 22 --- */
#themeIcon .fa-fallback{display:none !important;}#themeIcon i{display:inline-block;}


/* --- inline block 23 --- */
#themeIcon .icon-sun,#themeIcon .icon-moon{display:none;line-height:1}html.light-theme #themeIcon .icon-moon{display:inline}html.light-theme #themeIcon .icon-sun{display:none}html:not(.light-theme) #themeIcon .icon-sun{display:inline}html:not(.light-theme) #themeIcon .icon-moon{display:none}.fa-ready #themeIcon .fa-fallback{display:none}


/* --- inline block 24 --- */
#themeIcon .icon-sun,#themeIcon .icon-moon{transition:opacity 0.2s ease-out,transform 0.2s ease-out;opacity:0;transform:scale(0.85);}html.light-theme #themeIcon .icon-moon,html:not(.light-theme) #themeIcon .icon-sun{opacity:1;transform:scale(1);}


/* --- inline block 25 --- */
#imageModal .modal-nav,#imageModal .modal-nav:focus,#imageModal .modal-nav:focus-visible,#imageModal .modal-nav:active,#imageModal .modal-nav:hover{outline:none !important;box-shadow:none !important;border:1.5px solid rgba(255,255,255,.35) !important;transform:none !important;}#gallery .carousel-btn,#gallery .carousel-btn:focus,#gallery .carousel-btn:focus-visible,#gallery .carousel-btn:active,#gallery .carousel-btn:hover{outline:none !important;box-shadow:none !important;border:none !important;transform:none !important;}


/* --- inline block 26 --- */
#imageModal #modalImage{transition:opacity 0.45s ease-in-out;opacity:1;}#imageModal #modalImage.is-fading{opacity:0.12;}#gallery .carousel-track{transition:transform 0.6s ease-in-out !important;}#imageModal #modalImage{transition:opacity 0.6s ease-out,transform 0.6s ease-out;opacity:1;transform:scale(1);}#imageModal #modalImage.is-fading{opacity:0;transform:scale(0.98);}#gallery .carousel-track{transition:transform 0.6s ease-in-out !important;}


/* --- inline block 27 --- */
#gallery .carousel-track img{transition:none !important;opacity:1 !important;transform:none !important;}


/* --- inline block 28 --- */
body.modal-open .carousel-btn,body.modal-open .slick-prev,body.modal-open .slick-next,body.modal-open #scrollTopBtn,body.modal-open #themeToggle,body.modal-open #ai-play{opacity:0 !important;pointer-events:none !important;visibility:hidden !important;}#imageModal .modal-nav{display:inline-flex !important;}


/* --- inline block 29 --- */
#imageModal{z-index:10000 !important;}#imageModal .modal-nav{z-index:10002 !important;}#imageModal .close-modal{z-index:10003 !important;}body.modal-open .carousel-btn,body.modal-open .slick-prev,body.modal-open .slick-next,body.modal-open [class*="slick-"]{opacity:0 !important;visibility:hidden !important;pointer-events:none !important;}#imageModal[aria-hidden="false"] .modal-nav{display:inline-flex !important;}


/* --- inline block 30 --- */
.slick-prev,.slick-next,[class*="slick-"].slick-arrow{opacity:0 !important;visibility:hidden !important;pointer-events:none !important;}


/* --- inline block 31 --- */
/* Esconde qualquer “seta perdida” marcada pelo script */
  [data-killed-arrow="1"] {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Mantém visíveis apenas as setas da Galeria e do modal do Portfólio */
  #imageModal .modal-nav,
  #gallery .carousel-container .carousel-btn {
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }


/* --- inline block 32 --- */
#backToTopSquare{display:none;}


/* --- inline block 33 --- */
body.light-theme #scrollTopBtn{box-shadow:0 2px 4px rgba(0,0,0,0.15) !important;}body:not(.light-theme) #scrollTopBtn{box-shadow:none !important;}


/* --- inline block 34 --- */
#scrollTopBtn{background-color:#ffcc00 !important;color:#000 !important;border-radius:9999px !important;width:48px !important;height:48px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;padding:0 !important;line-height:1 !important;}#scrollTopBtn i,#scrollTopBtn svg{color:#000 !important;width:18px;height:18px;}#scrollTopBtn:hover{background-color:#e6b800 !important;}


/* --- inline block 35 --- */
.btn-circular{width:50px;height:50px;border-radius:50%;background-color:#FFD700;color:#000;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,0.15);transition:all 0.3s ease;cursor:pointer;border:none;}.btn-circular:hover{box-shadow:0 4px 10px rgba(0,0,0,0.25);}#backToTop{position:fixed;bottom:20px;right:20px;display:none;z-index:999;}.dark-mode .btn-circular{background-color:#FFD700;color:#000;}


/* --- inline block 36 --- */
:root{--space-2xs:4px;--space-xs:8px;--space-sm:12px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;}.container{max-width:1280px;margin-inline:auto;padding-inline:clamp(16px,4vw,40px);}section h2{margin-bottom:var(--space-sm) !important;line-height:1.2;}section .intro-text{max-width:68ch;margin-inline:auto;margin-bottom:var(--space-xl) !important;}section h2+p{max-width:68ch;margin-inline:auto;margin-top:0 !important;margin-bottom:var(--space-xl) !important;}#about,#services,#gallery,#videos,#portfolio,#contact{scroll-margin-top:var(--space-3xl);}#services .services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-xl);}@media (max-width:768px){#services .services-grid{gap:var(--space-lg);}}#videos .container>div[style*="display:grid"]{gap:var(--space-xl) !important;}@media (max-width:768px){#videos .container>div[style*="display:grid"]{gap:var(--space-lg) !important;}}#portfolio .intro-text{margin-bottom:var(--space-xl) !important;}#portfolio-grid{gap:var(--space-lg);}h2{font-size:clamp(1.5rem,1.2rem+1.2vw,2rem);}h3{font-size:clamp(1.125rem,1rem+0.6vw,1.375rem);}p{line-height:1.6;}#nav-list a.active{text-shadow:0 0 6px rgba(248,217,15,0.35);}#gallery .carousel-btn{top:50%;transform:translateY(-50%);}#imageModal{z-index:10000;}section{padding-block:clamp(32px,6vw,88px);}.hero{padding-block:clamp(48px,8vw,120px);}#about .container p{max-width:68ch;}


/* --- inline block 37 --- */
#gallery .carousel-container{max-width:960px;margin-inline:auto;}@media (max-width:1024px){#gallery .carousel-container{max-width:720px;}}@media (max-width:768px){#gallery .carousel-container{max-width:100%;}}


/* --- inline block 38 --- */
:root{--br-radius:14px;--br-radius-lg:18px;--br-shadow-sm:0 1px 2px rgba(0,0,0,.12);--br-shadow-md:0 6px 18px rgba(0,0,0,.18);--br-shadow-soft:0 10px 30px rgba(0,0,0,.18);--br-card-gap:clamp(16px,3vw,28px);--br-card-pad:clamp(14px,2.2vw,22px);--br-anim-fast:.18s;--br-anim:.28s;--br-anim-slow:.45s;}#services .services-grid{gap:var(--br-card-gap) !important;}#services .service-card{border-radius:var(--br-radius-lg);padding:var(--br-card-pad);background:rgba(255,255,255,.02);backdrop-filter:saturate(120%) blur(1px);box-shadow:var(--br-shadow-sm);transition:transform var(--br-anim) ease,box-shadow var(--br-anim) ease,background var(--br-anim) ease;}html.light-theme #services .service-card{background:#fff;}#services .service-card:hover,#services .service-card:focus-within{transform:translateY(-2px);box-shadow:var(--br-shadow-md);outline:none;}#services .service-card h3{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;}.btn,#vamos-conversar{border-radius:999px;padding:0.9rem 1.25rem;min-height:44px;line-height:1.1;transition:transform var(--br-anim-fast) ease,box-shadow var(--br-anim-fast) ease;box-shadow:var(--br-shadow-sm);}.btn:hover,#vamos-conversar:hover{transform:translateY(-1px);box-shadow:var(--br-shadow-md);}.btn:active,#vamos-conversar:active{transform:translateY(0);}#portfolio-grid img{border-radius:var(--br-radius);box-shadow:var(--br-shadow-sm);}#portfolio-grid .portfolio-item{transition:transform var(--br-anim) ease,box-shadow var(--br-anim) ease;}#portfolio-grid .portfolio-item:hover{transform:translateY(-3px);box-shadow:var(--br-shadow-soft);}#gallery .carousel-btn{width:48px;height:48px;border-radius:999px;box-shadow:var(--br-shadow-sm);transition:transform var(--br-anim-fast) ease,box-shadow var(--br-anim-fast) ease;}#gallery .carousel-btn:hover{transform:translateY(-1px);box-shadow:var(--br-shadow-md);}#imageModal #modalImage{border-radius:var(--br-radius-lg);}@media (max-width:768px){header nav #nav-list li a{padding:.75rem .25rem;}}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:0s !important;scroll-behavior:auto !important;}}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth;}}#about .container p,section p{hyphens:auto;text-wrap:pretty;}
#about .container p,#podcast p{hyphens:none!important;}


/* --- inline block 39 --- */
header{background-color:rgba(0,0,0,0.45) !important;-webkit-backdrop-filter:blur(10px) saturate(180%);backdrop-filter:blur(10px) saturate(180%);border-bottom:1px solid rgba(255,255,255,0.08);transition:background-color .4s ease,border-color .4s ease;}html.light-theme header{background-color:rgba(255,255,255,0.75) !important;border-bottom:1px solid rgba(0,0,0,0.1);}#services .service-card{background:rgba(255,255,255,0.03) !important;-webkit-backdrop-filter:blur(4px) saturate(150%);backdrop-filter:blur(4px) saturate(150%);border:1px solid rgba(255,255,255,0.08);box-shadow:0 4px 12px rgba(0,0,0,0.25) !important;transition:all .35s ease;}#services .service-card:hover{border-color:rgba(248,217,15,0.5);background:linear-gradient(180deg,rgba(255,255,255,0.08),rgba(121,255,235,0.08)) !important;box-shadow:0 6px 18px rgba(248,217,15,0.15),0 0 8px rgba(121,255,235,0.25) !important;transform:translateY(-4px) !important;}html.light-theme #services .service-card{background:rgba(255,255,255,0.92) !important;border:1px solid rgba(0,0,0,0.12);}footer{background-color:rgba(0,0,0,0.55) !important;-webkit-backdrop-filter:blur(4px) saturate(150%);backdrop-filter:blur(4px) saturate(150%);border-top:1px solid rgba(255,255,255,0.08);}html.light-theme footer{background-color:rgba(255,255,255,0.85) !important;border-top:1px solid rgba(0,0,0,0.1);}


/* --- inline block 40 --- */
html{transition:background-color .4s ease,color .4s ease;}#gallery .carousel-track img,#portfolio-grid img{transition:opacity .3s ease,transform .3s ease;}#gallery .carousel-track img:hover,#portfolio-grid img:hover{opacity:.92;transform:translateY(-2px);}section h2>i{margin-right:8px;}


/* --- inline block 41 --- */
header nav #nav-list li a{position:relative;transition:color .22s ease;}header nav #nav-list li a::after{content:"";position:absolute;left:50%;bottom:-6px;width:0;height:2px;background:currentColor;border-radius:999px;transition:width .22s ease,left .22s ease,opacity .22s ease;opacity:.9;}header nav #nav-list li a:hover::after,header nav #nav-list li a:focus-visible::after,header nav #nav-list li a.active::after{left:0;width:100%;}header nav #nav-list li a:focus-visible{outline:2px solid #f8d90f;outline-offset:3px;border-radius:6px;}#nav-list a.active{font-weight:600;}html.light-theme #nav-list a.active{color:#111 !important;}html:not(.light-theme) #nav-list a.active{color:#f8d90f !important;}@media (prefers-reduced-motion:reduce){header nav #nav-list li a::after{transition:none !important;}}header{contain:layout paint;}


/* --- inline block 42 --- */
#services{text-align:center;}#services .service-card h3,#services .service-card p{text-align:center;word-break:keep-all;white-space:normal;hyphens:none;margin-inline:auto;}#services .service-card h3{justify-content:center;}


/* --- inline block 43 --- */
#videos .video-wrapper{position:relative;}#videos video{display:block;width:100%;border-radius:12px;}#videos .loader-neon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;background:rgba(0,0,0,0.10);border-radius:12px;transition:opacity .25s ease,visibility .25s ease;opacity:0;visibility:hidden;}#videos .loader-neon.is-active{opacity:1;visibility:visible;}#videos .loader-neon::before{content:"";width:48px;height:48px;border-radius:50%;border:3px solid rgba(248,217,15,0.25);border-top-color:#f8d90f;border-right-color:#79ffeb;animation:br-spin 1s linear infinite,br-glow 1.8s ease-in-out infinite alternate;box-shadow:0 0 10px rgba(248,217,15,0.25);}html.light-theme #videos .loader-neon::before{border:3px solid rgba(0,0,0,0.12);border-top-color:#f8d90f;border-right-color:#79ffeb;}@keyframes br-spin{to{transform:rotate(360deg);}}@keyframes br-glow{0%{box-shadow:0 0 8px rgba(248,217,15,0.35),0 0 0 rgba(121,255,235,0.0);}100%{box-shadow:0 0 18px rgba(121,255,235,0.45),0 0 0 rgba(248,217,15,0.0);}}@media (prefers-reduced-motion:reduce){#videos .loader-neon::before{animation:none;}}


/* --- inline block 44 --- */
html.light-theme #dataHora{color:#111 !important;}html:not(.light-theme) #dataHora{color:#fff !important;}


/* --- inline block 45 --- */
h1,h2{letter-spacing:normal !important;transition:none !important;}h1:hover,h2:hover{letter-spacing:normal !important;}


/* --- inline block 46 --- */
@media (max-width:768px){#about .container p{font-size:0.95rem !important;line-height:1.45 !important;}}


/* --- inline block 47 --- */
#hamburgerBtn{display:none;}@media (max-width:860px){#nav-list{display:none !important;}#hamburgerBtn{display:inline-flex;align-items:center;justify-content:center;width:auto;height:auto;background:transparent;color:inherit;border:none;border-radius:0;padding:8px;cursor:pointer;}#hamburgerBtn:focus-visible{outline:3px solid #f8d90f;outline-offset:2px;}#mobileDrawer{position:fixed;top:0;right:0;bottom:0;width:min(80vw,320px);transform:translateX(100%);transition:transform .35s ease;background:rgba(0,0,0,.96);color:#fff;z-index:10020;padding:20px;display:flex;flex-direction:column;gap:10px;}html.light-theme #mobileDrawer{background:#fff;color:#111;}#mobileDrawer.is-open{transform:translateX(0);}#mobileDrawer a{display:block;padding:14px 10px;font-size:1.05rem;text-decoration:none;border-radius:10px;color:inherit;}#mobileDrawer a:focus-visible{outline:3px solid #f8d90f;outline-offset:2px;}#mobileDrawer a:hover{background:rgba(255,255,255,.06);}html.light-theme #mobileDrawer a:hover{background:rgba(0,0,0,.06);}#drawerBackdrop{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:10010;}#drawerBackdrop.is-open{opacity:1;pointer-events:auto;}}


/* --- inline block 48 --- */
@media (max-width:860px){#mobileDrawer{padding-top:calc(20px+env(safe-area-inset-top));padding-bottom:calc(20px+env(safe-area-inset-bottom));padding-right:calc(20px+env(safe-area-inset-right));}#drawerBackdrop{background:rgba(0,0,0,.5);}#mobileDrawer a{min-height:48px;}}body.modal-open{overscroll-behavior:none;touch-action:none;}@media (prefers-reduced-motion:reduce){#mobileDrawer,#drawerBackdrop{transition:none !important;}}


/* --- inline block 49 --- */
@media (max-width:860px){#mobileDrawer{opacity:0;transform:translateX(100%);transition:transform .28s ease-out,opacity .28s ease-out;}#mobileDrawer.is-open{opacity:1;transform:translateX(0);}#mobileDrawer a.active{position:relative;color:#f8d90f !important;font-weight:600;}#mobileDrawer a.active::before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:3px;background:linear-gradient(180deg,#f8d90f,#ff8a00);}html.light-theme #mobileDrawer a.active{color:#111 !important;}html.light-theme #mobileDrawer a.active::before{background:linear-gradient(180deg,#111,#555);}}@media (prefers-reduced-motion:reduce){#mobileDrawer{transition:none !important;}}


/* --- inline block 50 --- */
@media (max-width:860px){#mobileDrawer{background:rgba(0,0,0,0.75);backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%);border-left:1px solid rgba(255,255,255,0.08);box-shadow:-2px 0 16px rgba(0,0,0,0.4);}html.light-theme #mobileDrawer{background:rgba(255,255,255,0.65);backdrop-filter:blur(12px) saturate(180%);-webkit-backdrop-filter:blur(12px) saturate(180%);border-left:1px solid rgba(0,0,0,0.08);box-shadow:-2px 0 12px rgba(0,0,0,0.15);}#mobileDrawer a{transition:background .2s ease,color .2s ease;}#mobileDrawer a:hover{background:rgba(255,255,255,0.08);}html.light-theme #mobileDrawer a:hover{background:rgba(0,0,0,0.06);}}


/* --- inline block 51 --- */
body.drawer-open{overflow:hidden !important;}


/* --- inline block 52 --- */
#mobileDrawer,#drawerBackdrop{display:none !important;}@media (max-width:860px){#mobileDrawer{display:flex !important;position:fixed;top:0;right:0;bottom:0;width:min(80vw,320px);background:rgba(10,10,10,.95);flex-direction:column;align-items:flex-start;padding:2rem;transform:translateX(100%);transition:transform .3s ease-in-out;z-index:999;}#mobileDrawer.is-open{transform:translateX(0);}#drawerBackdrop{display:block !important;position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:998;}#drawerBackdrop.is-open{opacity:1;pointer-events:auto;}}


/* --- inline block 53 --- */
.curriculo-nome{font-family:'Poppins',sans-serif !important;font-weight:600;font-size:2rem;transition:color 0.3s ease;}body.light-mode .curriculo-nome,html[data-theme="light"] .curriculo-nome,:root:not(.dark) .curriculo-nome{color:#000000 !important;}body.dark-mode .curriculo-nome,html[data-theme="dark"] .curriculo-nome,:root.dark .curriculo-nome{color:#f8d90f !important;}@media (prefers-color-scheme:dark){.curriculo-nome{color:#f8d90f !important;}}@media (prefers-color-scheme:light){.curriculo-nome{color:#000000 !important;}}


/* --- inline block 54 --- */
:root .curriculo-nome{font-family:'Poppins',sans-serif !important;font-weight:600;letter-spacing:.2px;transition:color .25s ease;}:root:not(.dark) .curriculo-nome,html:not(.dark) body .curriculo-nome,html[data-theme="light"] .curriculo-nome,body.light-mode .curriculo-nome{color:#000 !important;}:root.dark .curriculo-nome,html.dark body .curriculo-nome,html[data-theme="dark"] .curriculo-nome,body.dark-mode .curriculo-nome{color:#f8d90f !important;}@media (prefers-color-scheme:dark){.curriculo-nome{color:#f8d90f !important;}}@media (prefers-color-scheme:light){.curriculo-nome{color:#000 !important;}}


/* --- inline block 55 --- */
#nome-cv.curriculo-nome{font-family:'Poppins',sans-serif !important;font-weight:600 !important;letter-spacing:.2px}html.dark body #curriculo #nome-cv.curriculo-nome,html.dark #curriculo #nome-cv.curriculo-nome,html.dark body #nome-cv.curriculo-nome,html.dark #nome-cv.curriculo-nome,body.dark-mode #nome-cv.curriculo-nome,html[data-theme="dark"] #nome-cv.curriculo-nome{color:#f8d90f !important;-webkit-text-fill-color:#f8d90f !important;-webkit-text-stroke:0 !important;text-shadow:none !important;mix-blend-mode:normal !important;filter:none !important;opacity:1 !important;background:none !important;background-clip:initial !important;-webkit-background-clip:initial !important;isolation:isolate !important;position:relative;z-index:2;}html:not(.dark) #nome-cv.curriculo-nome,:root:not(.dark) #nome-cv.curriculo-nome,body.light-mode #nome-cv.curriculo-nome,html[data-theme="light"] #nome-cv.curriculo-nome{color:#000 !important;}


/* --- inline block 56 --- */
:where(h1,h2){font-family:"Poppins","Sora","Inter",system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif !important;font-weight:600 !important;letter-spacing:-0.01em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.slick-prev,.slick-next,[class*="slick-"].slick-arrow,#gallery .carousel-btn,#imageModal .modal-nav,#imageModal .modal-nav>button{outline:none !important;box-shadow:none !important;border:none !important;transform:none !important;filter:none !important;background:transparent}.slick-prev:focus-visible,.slick-next:focus-visible,[class*="slick-"].slick-arrow:focus-visible,#gallery .carousel-btn:focus-visible,#imageModal .modal-nav:focus-visible,#imageModal .modal-nav>button:focus-visible{outline:2px solid currentColor !important;outline-offset:2px !important}.light-theme .site-nav a{color:#111 !important}.light-theme .site-nav a:hover,.light-theme .site-nav a:focus{color:#000 !important}.light-theme .site-nav a.active{color:#000 !important;border-bottom:2px solid #000 !important}:root:not(.light-theme) .site-nav a{color:#f8d90f !important}:root:not(.light-theme) .site-nav a:hover,:root:not(.light-theme) .site-nav a:focus{color:#f8d90f !important}:root:not(.light-theme) .site-nav a.active{color:#f8d90f !important;border-bottom:2px solid #f8d90f !important}.section-line,.title-line,.linha,.linha-de,.separator-line{height:2px;display:block;width:100%;border:0;background:currentColor}.light-theme .section-line,.light-theme .title-line,.light-theme .linha,.light-theme .linha-de,.light-theme .separator-line{color:#000 !important;background:#000 !important}:root:not(.light-theme) .section-line,:root:not(.light-theme) .title-line,:root:not(.light-theme) .linha,:root:not(.light-theme) .linha-de,:root:not(.light-theme) .separator-line{color:#f8d90f !important;background:#f8d90f !important}@media (prefers-reduced-motion:reduce){.section-line,.title-line,.linha,.linha-de,.separator-line{animation:none !important;transition:none !important}.slick-track,.slick-slide,#gallery .carousel,#imageModal .modal-content{transition-duration:.01ms !important;animation-duration:.01ms !important}}:where(p,li,blockquote){text-wrap:pretty}:where(h1,h2,h3){text-wrap:balance}.nowrap{white-space:nowrap !important}.visually-hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0,0,0,0) !important;white-space:nowrap !important;border:0 !important}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0,0,0,0) !important;white-space:nowrap !important;border:0 !important}


/* --- inline block 57 --- */
/* Remove a borda de foco amarela do modal da galeria */
#galleryImageModal img:focus,
#galleryImageModal img:active,
#galleryImageModal:focus {
 outline: none !important;
 border: none !important;
 box-shadow: none !important;
}


/* --- inline block 58 --- */
/* Exibir corretamente as setas no modal da Galeria */
#galleryImageModal .gallery-nav {
 display: block !important;
 opacity: 0.85;
 transition: opacity 0.2s ease-in-out;
}

#galleryImageModal .gallery-nav:hover {
 opacity: 1;
}

/* Garantir que fiquem acima da imagem */
#galleryImageModal #galleryPrev,
#galleryImageModal #galleryNext {
 z-index: 10001 !important;
}


/* --- inline block 59 --- */
/* === Animação suave das setas no modal da Galeria === */
#galleryImageModal .gallery-nav {
 display: block !important;
 opacity: 0;
 transform: translateY(-50%) translateX(20px);
 transition: opacity 0.4s ease, transform 0.4s ease;
}

/* Aparecem com fade e deslize ao abrir o modal */
#galleryImageModal[aria-hidden="false"] #galleryPrev,
#galleryImageModal[aria-hidden="false"] #galleryNext {
 opacity: 0.85;
 transform: translateY(-50%) translateX(0);
}

/* Realce suave no hover */
#galleryImageModal .gallery-nav:hover {
 opacity: 1;
 filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.6));
 transition: opacity 0.2s ease, filter 0.2s ease;
}

/* Garantir posição e prioridade visual */
#galleryImageModal #galleryPrev,
#galleryImageModal #galleryNext {
 z-index: 10001 !important;
}


/* --- inline block 60 --- */
/* Botão de fechar circular no modal da Galeria */
#galleryImageModal .gallery-close {
 position: absolute;
 top: 16px;
 right: 16px;
 width: 44px;
 height: 44px;
 border-radius: 50%;
 border: 1px solid rgba(255, 255, 255, 0.25);
 background: rgba(0, 0, 0, 0.55);
 color: #fff;
 font-size: 22px;
 line-height: 1;
 display: flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 transition: all 0.25s ease-in-out;
 z-index: 10006 !important;
}

/* Hover sem brilho (somente leve clareamento no fundo) */
#galleryImageModal .gallery-close:hover {
 background: rgba(255, 255, 255, 0.25);
 transform: none;
 filter: none;
}


/* --- inline block 61 --- */
/* === Harmonização visual: botão de fechar do Portfólio com brilho igual ao da Galeria === */
#imageModal .close-modal {
 position: absolute !important;
 top: 16px !important;
 right: 16px !important;
 width: 44px !important;
 height: 44px !important;
 border-radius: 50% !important;
 border: 1px solid rgba(255, 255, 255, 0.25) !important;
 background: rgba(0, 0, 0, 0.55) !important;
 color: #fff !important;
 font-size: 22px !important;
 line-height: 1 !important;
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 cursor: pointer !important;
 transition: all 0.25s ease-in-out !important;
 z-index: 10006 !important;
}

#imageModal .close-modal:hover {
 background: rgba(255, 255, 255, 0.25) !important;
 transform: scale(1.05) !important;
 filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.5)) !important;
}


/* --- inline block 62 --- */
/* === Uniformização total dos botões de fechar (Galeria e Portfólio) === */
#galleryImageModal .gallery-close,
#imageModal .close-modal {
 position: absolute !important;
 top: 16px !important;
 right: 16px !important;
 width: 44px !important;
 height: 44px !important;
 border-radius: 50% !important;
 border: 1px solid rgba(255, 255, 255, 0.25) !important;
 background: rgba(0, 0, 0, 0.55) !important;
 color: #fff !important;
 font-size: 22px !important;
 line-height: 1 !important;
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 cursor: pointer !important;
 transition: background 0.25s ease, transform 0.25s ease, filter 0.25s ease !important;
 z-index: 10010 !important;
 opacity: 0;
 animation: fadeInCloseBtn 0.4s ease forwards 0.1s;
}

/* Hover com brilho unificado */
#galleryImageModal .gallery-close:hover,
#imageModal .close-modal:hover {
 background: rgba(255, 255, 255, 0.25) !important;
 transform: scale(1.05) !important;
 filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.5)) !important;
}

/* Animação suave ao aparecer */
@keyframes fadeInCloseBtn {
 0% { opacity: 0; transform: scale(0.9); }
 100% { opacity: 1; transform: scale(1); }
}


/* --- inline block 63 --- */
/* === Padronização absoluta dos botões de fechar (Galeria e Portfólio) === */
:root {
 --br-close-size: 44px;
 --br-close-font: 22px;
 --br-close-bg: rgba(0,0,0,0.55);
 --br-close-border: 1px solid rgba(255,255,255,0.25);
 --br-close-color: #fff;
 --br-close-z: 10010;
}

/* Base idêntica para ambos */
#galleryImageModal .gallery-close,
#imageModal .close-modal {
 position: absolute !important;
 top: 16px !important;
 right: 16px !important;
 width: var(--br-close-size) !important;
 height: var(--br-close-size) !important;
 border-radius: 50% !important;
 border: var(--br-close-border) !important;
 background: var(--br-close-bg) !important;
 color: var(--br-close-color) !important;
 font-size: var(--br-close-font) !important;
 line-height: 1 !important;
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 cursor: pointer !important;
 z-index: var(--br-close-z) !important;
 /* remove interferências */
 box-shadow: none !important;
 text-shadow: none !important;
 outline: none !important;
 filter: none !important;
 -webkit-appearance: none !important;
 appearance: none !important;
 backdrop-filter: none !important;
 -webkit-backdrop-filter: none !important;
 /* animação e transições iguais */
 opacity: 0;
 transform: scale(0.9);
 transition: background 0.25s ease, transform 0.25s ease, filter 0.25s ease, opacity 0.25s ease !important;
}

/* Mostrar quando modal estiver aberto */
#galleryImageModal[aria-hidden="false"] .gallery-close,
#imageModal[aria-hidden="false"] .close-modal {
 opacity: 1 !important;
 transform: scale(1) !important;
}

/* Hover com brilho idêntico */
#galleryImageModal .gallery-close:hover,
#imageModal .close-modal:hover {
 background: rgba(255,255,255,0.25) !important;
 transform: scale(1.05) !important;
 filter: drop-shadow(0 0 6px rgba(255,255,255,0.5)) !important;
}

/* Estado de foco visível */
#galleryImageModal .gallery-close:focus-visible,
#imageModal .close-modal:focus-visible {
 outline: 3px solid #f8d90f !important;
 outline-offset: 2px !important;
}

/* Garante que NADA esconda */
#galleryImageModal .gallery-close,
#imageModal .close-modal {
 visibility: visible !important;
 pointer-events: auto !important;
 display: flex !important;
}


/* --- inline block 64 --- */
/* --- Patch: Estilo "Fechar" (X) dos Modais igual ao do Robozinho --- */

/* 1. Oculta o "×" (caractere de texto) original dos botões */
#galleryImageModal .gallery-close,
#imageModal .close-modal {
 font-size: 0 !important;
 color: transparent !important;
 text-shadow: none !important;
}

/* 2. Redefine as linhas do "X" (feitas com ::before/::after)
 para ficarem finas e curtas, como no SVG do robô.
 SVG do robô: <svg width="10" height="10" viewbox="0 0 14 14"><line stroke-width="2" ...>
*/
#galleryImageModal .gallery-close::before,
#galleryImageModal .gallery-close::after,
#imageModal .close-modal::before,
#imageModal .close-modal::after {
 /* Corresponde ao stroke-width="2" */
 height: 2px !important;

 /* Corresponde ao tamanho da linha (10-14px) no viewbox 14x14 */
 width: 14px !important;

 /* Corresponde ao stroke-linecap="round" */
 border-radius: 2px !important;

 /* Remove qualquer brilho/sombra aplicado por outros estilos */
 box-shadow: none !important;

 /* Garante a cor da linha (o SVG do robô usa 'currentColor', que é branco) */
 background: #fff !important;
}

/* 3. Remove o brilho/filtro do *botão* no hover
 para deixá-lo mais limpo, como o do robô */
#galleryImageModal .gallery-close:hover,
#imageModal .close-modal:hover {
 filter: none !important;
 /* Mantém um hover sutil que já estava no seu CSS minimalista */
 background: rgba(255, 255, 255, 0.22) !important;
 box-shadow: none !important;
}


/* --- inline block 65 --- */
/*
 Correção: Botão de fechar do modal no modo claro.
 Força o ícone "X" (feito com ::before/::after) a ser escuro
 quando o tema claro está ativo, corrigindo a invisibilidade.
 */
 html.light-theme #imageModal .close-modal::before,
 html.light-theme #imageModal .close-modal::after,
 html.light-theme #galleryImageModal .gallery-close::before,
 html.light-theme #galleryImageModal .gallery-close::after {
 background: #111 !important; /* Cor escura para o ícone "X" */
 box-shadow: none !important; /* Remove qualquer brilho branco */
 }

 /*
 Garante que o fundo do botão no modo claro seja claro
 e remove brilhos conflitantes de outros estilos.
 */
 html.light-theme #imageModal .close-modal,
 html.light-theme #galleryImageModal .gallery-close {
 background: rgba(255, 255, 255, 0.9) !important;
 border: 1px solid rgba(0, 0, 0, 0.2) !important;
 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
 }


/* --- inline block 66 --- */
/* === Botão “Enviar” com cor apenas no hover === */

/* Estado padrão — transparente com borda amarela */
#contact button,
#contact input[type="submit"],
#contact .btn-enviar {
 background: transparent !important;
 border: 2px solid #f8d90f !important;
 color: #f8d90f !important;
 transition: all 0.3s ease;
}

/* Hover — preenche com amarelo suave */
#contact button:hover,
#contact input[type="submit"]:hover,
#contact .btn-enviar:hover {
 background: linear-gradient(90deg, #f8d90f 0%, #f89b0f 100%) !important;
 color: #111 !important;
 box-shadow: 0 4px 14px rgba(248, 217, 15, 0.25) !important;
 transform: translateY(-1px);
}

/* Modo claro — mantém contraste adequado */
html.light-theme #contact button,
html.light-theme #contact input[type="submit"],
html.light-theme #contact .btn-enviar {
 border-color: #111 !important;
 color: #111 !important;
}

html.light-theme #contact button:hover,
html.light-theme #contact input[type="submit"]:hover,
html.light-theme #contact .btn-enviar:hover {
 background: linear-gradient(90deg, #f8d90f 0%, #ffb300 100%) !important;
 color: #111 !important;
}


/* --- inline block 67 --- */
/* --- Botão Enviar: contraste otimizado --- */

/* Modo claro: fundo preto, texto branco */
html.light-theme #contact button[type="submit"],
html.light-theme #contact input[type="submit"],
html.light-theme form button[type="submit"] {
 background: #000 !important;
 color: #fff !important;
 border: 1px solid #000 !important;
 transition: all 0.25s ease-in-out;
}

/* Efeito hover suave */
html.light-theme #contact button[type="submit"]:hover,
html.light-theme #contact input[type="submit"]:hover,
html.light-theme form button[type="submit"]:hover {
 background: #222 !important;
 transform: translateY(-1px);
}

/* Modo escuro permanece amarelo */
html:not(.light-theme) #contact button[type="submit"],
html:not(.light-theme) #contact input[type="submit"],
html:not(.light-theme) form button[type="submit"] {
 background: linear-gradient(90deg, #f8d90f, #ff8a00) !important;
 color: #000 !important;
 border: none !important;
}


/* --- inline block 68 --- */
/* --- Modo escuro: botão Enviar vazado com hover dourado --- */
html:not(.light-theme) #contact button[type="submit"],
html:not(.light-theme) #contact input[type="submit"],
html:not(.light-theme) form button[type="submit"] {
 background: transparent !important;
 color: #f8d90f !important;
 border: 2px solid #f8d90f !important;
 transition: all 0.35s ease-in-out;
 box-shadow: none !important;
}

/* Ao passar o mouse: fundo dourado gradiente */
html:not(.light-theme) #contact button[type="submit"]:hover,
html:not(.light-theme) #contact input[type="submit"]:hover,
html:not(.light-theme) form button[type="submit"]:hover {
 background: linear-gradient(90deg, #f8d90f, #ff8a00) !important;
 color: #000 !important;
 border-color: transparent !important;
 transform: translateY(-1px);
}

/* Ao focar com o teclado: mantém contraste */
html:not(.light-theme) #contact button[type="submit"]:focus-visible {
 outline: 2px solid #f8d90f !important;
 outline-offset: 3px !important;
}


/* --- inline block 69 --- */
/* === BR CLEANUPS - 2025-11-07 === */

/* 1) Unhide slick arrows globally (in case there are global killers) */
.slick-prev, .slick-next,
[class*="slick-"].slick-arrow {
 display: inline-block !important;
 opacity: 1 !important;
 visibility: visible !important;
 pointer-events: auto !important;
}

/* 1.1) Re-hide only inside #portfolio (escopo correto) */
#portfolio .slick-prev,
#portfolio .slick-next,
#portfolio [class*="slick-"].slick-arrow {

 opacity: 0 !important;
 visibility: hidden !important;
 pointer-events: none !important;
}

/* 2) Botão ENVIAR no modo claro: fundo preto, texto branco */
html.light-theme button[type="submit"].btn-enviar,
html.light-theme .btn-enviar {
 background: #000 !important;
 color: #fff !important;
 border-color: #000 !important;
}
html.light-theme .btn-enviar:hover,
html.light-theme button[type="submit"].btn-enviar:hover {
 filter: brightness(1.1);
}

/* 3) Close buttons: garantir contraste em modo claro e hover translúcido no escuro */
html.light-theme .close-btn::before,
html.light-theme .close-btn::after,
html.light-theme .gallery-close::before,
html.light-theme .gallery-close::after,
html.light-theme .close-modal::before,
html.light-theme .close-modal::after {
 background: #111 !important;
}

html:not(.light-theme) .close-btn:hover,
html:not(.light-theme) .gallery-close:hover,
html:not(.light-theme) .close-modal:hover {
 background: rgba(255,255,255,.25) !important;
}

/* 4) Foco acessível padrão onde foi removido */
button:focus-visible,
a:focus-visible,
[role="button"]:focus-visible {
 outline: 2px solid currentColor;
 outline-offset: 3px;
}

/* 5) Linhas decorativas: respeitar prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
 .section-line, .title-line, .linha, .linha-decorativa {
 animation: none !important;
 transition: none !important;
 }
}

/* 6) Evitar texto ilegível forçado em preto quando fora do tema claro */
html:not(.light-theme) .lock-black-text { color: inherit !important; }


/* --- inline block 70 --- */
/* VISIBILIDADE POR TEMA — impede flash do robô errado */
/* Regra principal: só a pose .is-visible do tema ativo pode aparecer */
html.light-theme #robo .pose[data-theme="light"].is-visible { display: block !important; }
html.light-theme #robo .pose[data-theme="dark"] { display: none !important; }

html:not(.light-theme) #robo .pose[data-theme="dark"].is-visible { display: block !important; }
html:not(.light-theme) #robo .pose[data-theme="light"] { display: none !important; }

/* Fallback instantâneo pelo esquema do SO (antes do JS e antes da classe no body) */
@media (prefers-color-scheme: light){
 #robo .pose[data-theme="dark"] { display: none !important; }
}
@media (prefers-color-scheme: dark){
 #robo .pose[data-theme="light"] { display: none !important; }
}

/* Remover círculo amarelo das setas do portfólio */
.portfolio-carousel .slick-prev:focus,
.portfolio-carousel .slick-next:focus,
.portfolio-carousel .slick-prev:hover,
.portfolio-carousel .slick-next:hover {
 outline: none !important;
 box-shadow: none !important;
 border: none !important;
}

/* Remover círculo amarelo e salto das setas do portfólio e galeria */
.portfolio-carousel .slick-prev,
.portfolio-carousel .slick-next,
.gallery-carousel .slick-prev,
.gallery-carousel .slick-next {
 outline: none !important;
 box-shadow: none !important;
 border: none !important;
}

.portfolio-carousel .slick-prev:focus,
.portfolio-carousel .slick-next:focus,
.portfolio-carousel .slick-prev:hover,
.portfolio-carousel .slick-next:hover,
.gallery-carousel .slick-prev:focus,
.gallery-carousel .slick-next:focus,
.gallery-carousel .slick-prev:hover,
.gallery-carousel .slick-next:hover {
 outline: none !important;
 box-shadow: none !important;
 border: none !important;
 transform: none !important; /* evita deslocamento ao passar o mouse */
}

/* Remover círculo amarelo e salto das setas (mouse e teclado) */
.portfolio-carousel .slick-prev,
.portfolio-carousel .slick-next,
.gallery-carousel .slick-prev,
.gallery-carousel .slick-next {
 outline: none !important;
 box-shadow: none !important;
 border: none !important;
}

.portfolio-carousel .slick-prev:focus,
.portfolio-carousel .slick-next:focus,
.gallery-carousel .slick-prev:focus,
.gallery-carousel .slick-next:focus,
.portfolio-carousel .slick-prev:active,
.portfolio-carousel .slick-next:active,
.gallery-carousel .slick-prev:active,
.gallery-carousel .slick-next:active {
 outline: none !important;
 box-shadow: none !important;
 border: none !important;
}

.portfolio-carousel .slick-prev:hover,
.portfolio-carousel .slick-next:hover,
.gallery-carousel .slick-prev:hover,
.gallery-carousel .slick-next:hover {
 outline: none !important;
 box-shadow: none !important;
 border: none !important;
 transform: none !important;
}


/* --- inline block 71 --- */
#robo-fala{opacity:1;transition:opacity .35s ease;}
#robo-fala.is-hidden{opacity:0;visibility:hidden;}


/* --- inline block 72 --- */
/* === T O Q U E F I N A L F U T U R I S T A === */

/* 1) Ícones dos serviços com brilho neon */
#services .service-card h3 i {
 color: #f8d90f;
 text-shadow: 0 0 6px rgba(248, 217, 15, 0.5),
 0 0 12px rgba(248, 217, 15, 0.25);
 transition: text-shadow 0.35s ease, transform 0.3s ease, color .3s ease;
}
#services .service-card:hover h3 i {
 /* realce com gradiente energético via duas sombras (amarelo -> ciano) */
 color: #f8d90f;
 text-shadow: 0 0 10px rgba(248, 217, 15, 0.85),
 0 0 20px rgba(121, 255, 235, 0.5),
 0 0 28px rgba(121, 255, 235, 0.35);
 transform: scale(1.15) rotate(2deg);
}
html.light-theme #services .service-card h3 i {
 text-shadow: 0 0 4px rgba(248, 217, 15, 0.4),
 0 0 8px rgba(248, 217, 15, 0.2);
}

/* 2) Robô holográfico no modo escuro */
#robo img.pose[data-theme="dark"] {
 filter: drop-shadow(0 0 8px #f8d90f)
 drop-shadow(0 0 16px rgba(248, 217, 15, 0.5));
 transition: filter 0.5s ease;
}
@keyframes holoPulse {
 0% { filter: drop-shadow(0 0 6px rgba(248, 217, 15, 0.6)) drop-shadow(0 0 12px rgba(248, 217, 15, 0.4)); }
 50% { filter: drop-shadow(0 0 10px rgba(248, 217, 15, 0.95)) drop-shadow(0 0 20px rgba(121, 255, 235, 0.6)); }
 100% { filter: drop-shadow(0 0 6px rgba(248, 217, 15, 0.6)) drop-shadow(0 0 12px rgba(248, 217, 15, 0.4)); }
}
html:not(.light-theme) #robo img.pose.is-visible {
 animation: holoPulse 5s infinite ease-in-out;
}

/* 3) No modo claro, efeito leve para não estourar */
html.light-theme #robo img.pose[data-theme="light"] {
 filter: drop-shadow(0 0 4px rgba(248, 217, 15, 0.25));
}


/* --- inline block 73 --- */
:root{
 --cp-yellow:#f8d90f;
 --cp-cyan:#79ffeb;
 --cp-magenta:#ff2bbf;
 --cp-grid:rgba(255,255,255,.06);
}
html:not(.light-theme) body{
 background-image:
 radial-gradient(1200px 600px at 20% -10%, rgba(255,255,255,.04), transparent 60%),
 radial-gradient(1000px 500px at 120% 110%, rgba(121,255,235,.06), transparent 60%),
 linear-gradient(0deg, transparent 95%, var(--cp-grid) 96%),
 linear-gradient(90deg, transparent 95%, var(--cp-grid) 96%),
 url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence baseFrequency='0.8' numOctaves='1' stitchTiles='stitch' /></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='0.035'/></svg>");
 background-size: 100% 100%,100% 100%,18px 18px,18px 18px,160px 160px;
 background-attachment: fixed;
}
html:not(.light-theme) header{
 background-color: rgba(0,0,0,.55) !important;
 border-bottom-color: rgba(255,255,255,.08) !important;
 box-shadow: 0 6px 30px rgba(0,0,0,.45);
}
h1, h2{
 font-family: "Share Tech Mono","Sora","Inter",system-ui,sans-serif !important;
 font-weight: 700 !important;
}
a:focus-visible, button:focus-visible, .btn:focus-visible, #nav-list a:focus-visible{
 outline: 3px solid var(--cp-magenta) !important;
 outline-offset: 3px !important;
}
#nav-list a.active{
 color: var(--cp-magenta) !important;
 text-shadow: 0 0 8px rgba(255,43,191,.35);
}
.btn, #vamos-conversar{
 box-shadow: 0 0 0 0 rgba(255,43,191,.0);
 transition: box-shadow .25s ease, transform .18s ease;
}
.btn:hover, #vamos-conversar:hover{
 box-shadow: 0 0 22px rgba(255,43,191,.25), 0 0 10px rgba(121,255,235,.15);
 transform: translateY(-1px);
}
#services .service-card:hover h3 i{
 color: var(--cp-yellow);
 text-shadow:
 0 0 10px rgba(248,217,15,.9),
 0 0 22px rgba(121,255,235,.55),
 0 0 34px rgba(255,43,191,.45);
}
html:not(.light-theme) #robo img.pose.is-visible{
 filter:
 drop-shadow(0 0 8px var(--cp-yellow))
 drop-shadow(0 0 16px rgba(248,217,15,.45))
 drop-shadow(1px 0 0 rgba(255,43,191,.4))
 drop-shadow(-1px 0 0 rgba(121,255,235,.4));
 animation: holoPulse 5s ease-in-out infinite, cpHue 6s ease-in-out infinite;
}
@keyframes cpHue {
 0%,100%{ filter: hue-rotate(0deg) saturate(1) contrast(1) }
 50% { filter: hue-rotate(8deg) saturate(1.15) contrast(1.05) }
}
.logo, h1, h2{
 position: relative;
 will-change: transform, text-shadow;
}
.logo:hover, h1:hover, h2:hover{
 text-shadow:
 1px 0 0 rgba(255,43,191,.6),
 -1px 0 0 rgba(121,255,235,.6),
 0 0 14px rgba(248,217,15,.35);
 animation: cpGlitch .65s steps(2,end) 1;
}
@keyframes cpGlitch{
 0%{ transform: translate(0,0) }
 20%{ transform: translate(-1px, 0) }
 40%{ transform: translate(1px, 0) }
 60%{ transform: translate(-1px, 0) }
 80%{ transform: translate(1px, 0) }
 100%{ transform: translate(0,0) }
}
#imageModal #modalImage.is-fading{
 opacity: .06;
 transform: scale(.985) skewX(.25deg);
 filter: saturate(1.1) contrast(1.05);
}
:root{ --br-line-grad: linear-gradient(90deg, var(--cp-yellow) 0%, var(--cp-magenta) 50%, var(--cp-cyan) 100%) !important; }


/* --- inline block 74 --- */
/* ====== Bruno | Upgrades focados em UI/UX, contraste e performance ====== */

/* 1) Botão ENVIAR no modo claro: fundo preto, texto branco; hover dourado */
html.light-theme #contact button[type="submit"],
html.light-theme form button[type="submit"],
html.light-theme .btn-submit {
 background: #000 !important;
 color: #fff !important;
 border: 1.5px solid rgba(0,0,0,0.25) !important;
 text-shadow: none !important;
}
html.light-theme #contact button[type="submit"]:hover,
html.light-theme form button[type="submit"]:hover,
html.light-theme .btn-submit:hover {
 background: #f8d90f !important; /* dourado */
 color: #111 !important;
 border-color: rgba(0,0,0,0.35) !important;
}

/* 2) Ícone de fechar (X) dos modais com contraste correto e sem brilho exagerado */
#imageModal .close-modal,
#portfolioModal .close-modal,
.gallery-modal .close-modal {
 position: absolute;
 top: 20px;
 right: 20px;
 width: 44px;
 height: 44px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border-radius: 999px;
 font-size: 26px;
 line-height: 1;
 cursor: pointer;
 user-select: none;
 z-index: 10003;
 border: 1.5px solid transparent;
 box-shadow: none !important;
 outline: none !important;
}
html.light-theme #imageModal .close-modal,
html.light-theme #portfolioModal .close-modal,
html.light-theme .gallery-modal .close-modal {
 background: rgba(255,255,255,0.95) !important;
 color: #111 !important;
 border-color: rgba(0,0,0,0.25) !important;
 text-shadow: none !important;
}
html:not(.light-theme) #imageModal .close-modal,
html:not(.light-theme) #portfolioModal .close-modal,
html:not(.light-theme) .gallery-modal .close-modal {
 background: rgba(0,0,0,0.85) !important;
 color: #fff !important;
 border-color: rgba(255,255,255,0.35) !important;
 text-shadow: none !important;
}
#imageModal .close-modal:hover,
#portfolioModal .close-modal:hover,
.gallery-modal .close-modal:hover {
 filter: brightness(1.05);
}
#imageModal .close-modal:focus-visible,
#portfolioModal .close-modal:focus-visible,
.gallery-modal .close-modal:focus-visible {
 outline: 3px solid #f8d90f !important;
 outline-offset: 2px;
}

/* 3) Setas no modal sempre visíveis, com acessibilidade */
#imageModal .modal-nav {
 appearance: none;
 -webkit-appearance: none;
 width: 56px;
 height: 56px;
 border-radius: 50%;
 background: rgba(0,0,0,.9);
 color: #fff;
 border: 1.5px solid rgba(255,255,255,.35);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 line-height: 1;
 cursor: pointer;
 box-shadow: none !important;
 outline: none;
}
#imageModal .modal-nav:hover {
 background: rgba(0,0,0,1);
 border-color: rgba(255,255,255,.65);
}
#imageModal .modal-nav:focus-visible {
 outline: 3px solid #f8d90f;
 outline-offset: 2px;
}

/* 4) Carrossel da Galeria: largura máxima ergonômica + setas dentro do container */
#gallery .carousel-container {
 position: relative;
 width: 100%;
 max-width: 960px;
 margin-inline: auto;
 overflow: hidden;
}
@media (max-width: 1024px) {
 #gallery .carousel-container { max-width: 720px; }
}
@media (max-width: 768px) {
  section h2 i,
  section h2 svg {
    font-size: 1.15em !important;
}
}


/* --- inline block 75 --- */
/* === Botões de fechar: contraste coerente entre temas (Galeria e Portfólio) === */
#imageModal .close-modal,
#galleryImageModal .gallery-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  font-size: 22px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10006;
  border: 1.5px solid transparent;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Claro: X preto em fundo claro; Escuro: X branco em fundo escuro */
html.light-theme #imageModal .close-modal,
html.light-theme #galleryImageModal .gallery-close {
  background: rgba(255,255,255,0.95) !important;
  color: #111 !important;
  border-color: rgba(0,0,0,0.25) !important;
}

html:not(.light-theme) #imageModal .close-modal,
html:not(.light-theme) #galleryImageModal .gallery-close {
  background: rgba(0,0,0,0.85) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,0.35) !important;
}

/* Focus visível consistente */
#imageModal .close-modal:focus-visible,
#galleryImageModal .gallery-close:focus-visible {
  outline: 3px solid #f8d90f !important;
  outline-offset: 2px;
}


/* --- inline block 76 --- */
/* === CORREÇÃO DE TABLET COM DATA (Layout em 2 Linhas) === */
  /* Afeta tablets e notebooks pequenos (entre 861px e 1300px) */
  @media (min-width: 861px) and (max-width: 1300px) {

    header[role="banner"] {
      flex-wrap: wrap !important;
      justify-content: space-between !important;
      align-content: center !important;
      padding: 0.5rem 1.5rem !important;
      gap: 0 !important;
      height: auto !important;
    }

    header[role="banner"] > .logo {
      flex: 0 0 auto;
      margin-right: auto !important;
      font-size: 1.2rem !important;
    }

    header[role="banner"] > nav {
      order: 2;
      flex: 1 1 auto;
      display: flex;
      justify-content: center;
    }

    header[role="banner"] > nav #nav-list {
      gap: 8px !important;
    }

    header[role="banner"] > nav #nav-list a {
      font-size: 0.85rem !important;
      padding: 4px 8px !important;
    }

    header[role="banner"] > .menu-social-row {
      order: 3;
      flex: 0 0 auto;
      margin-left: 0.5rem !important;
    }

    header[role="banner"] .social-icons a {
      width: 28px !important;
      height: 28px !important;
      font-size: 0.9rem !important;
    }

    header[role="banner"] > #dataHora {
      display: block !important;
      width: 100% !important;
      order: 4;
      text-align: center !important;
      margin-top: 6px !important;
      padding-top: 6px !important;
      padding-right: 0 !important;
      border-top: 1px solid rgba(255,255,255,0.1);
      font-size: 0.75rem !important;
      opacity: 0.8;
    }
  }


/* --- inline block 77 --- */
/* Ajuste do layout da seção #videos apenas no tablet */
  @media (min-width: 861px) and (max-width: 1300px) {

    #videos .container > div {
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important; /* 3 vídeos por linha */
      gap: 1.5rem !important;
      padding: 0 1rem !important;
    }

    #videos .video-wrapper {
      max-width: 320px !important;
      margin: 0 auto !important; /* centraliza cada card */
    }

    #videos video {
      border-radius: 14px !important;
      height: 420px !important;
      max-height: 70vh !important;
      object-fit: cover !important;
    }

    /* Reposiciona o botão de play */
    #videos .video-overlay-play {
      width: 68px !important;
      height: 68px !important;
      top: 50% !important;
      left: 50% !important;
      transform: translate(-50%, -50%) !important;
    }
  }


/* --- inline block 78 --- */
/* Tablet: mantém o player nativo visível e o vídeo sem cortes exagerados */
  @media (min-width: 861px) and (max-width: 1300px) {

    /* Wrapper apenas centraliza e respeita o fluxo da página */
    #videos .video-wrapper {
      max-width: 100%;
      margin: 0 auto;
      border-radius: 16px;
      overflow: hidden;
    }

    /* Vídeo ocupa a largura, sem estourar nem cortar demais */
    #videos video {
      width: 100%;
      height: auto;
      object-fit: contain; /* mostra o vídeo inteiro */
      border-radius: 16px;
    }
  }


/* --- inline block 79 --- */
@media (min-width: 768px) and (max-width: 1366px) {
  #videos .video-wrapper video {
    max-height: 80vh !important;
    height: auto !important;
    object-fit: contain !important;
  }
  #videos .video-wrapper {
    max-height: 80vh !important;
  }
}


/* --- inline block 80 --- */
/* Desktop médio: 1025px a 1199px */
@media (min-width: 1025px) and (max-width: 1199px) {
  #videos {
    margin-bottom: 2rem !important; /* 32px */
  }
}

/* Desktop grande: 1200px+ */
@media (min-width: 1200px) {
  #videos {
    margin-bottom: 2.5rem !important; /* 40px */
  }
}


/* --- inline block 81 --- */
/* === CORREÇÃO: Esconder botões flutuantes quando o Currículo ou Modais abrem === */

  /* 1. Se a classe 'modal-open' estiver no corpo (jeito padrão) */
  body.modal-open #themeToggle,
  body.modal-open #ai-play,
  body.modal-open #scrollTopBtn,
  body.modal-open .theme-toggle,
  body.modal-open .btn-circular,
  body.modal-open #backToTop,
  body.modal-open #backToTopSquare,
  body.modal-open #backToTopBtn,
  body.modal-open #scrollTop,
  body.modal-open #topButton {
      display: none !important;
      opacity: 0 !important;
      visibility: hidden !important;
      pointer-events: none !important;
  }

  /* 2. Regra de segurança (CSS puro): 
     Se o modal do CV (#infoModal) estiver visível (display: flex), 
     força os botões que vêm depois dele no código a sumirem. */
  #infoModal[style*="display: flex"] ~ #themeToggle,
  #infoModal[style*="display: flex"] ~ #ai-play,
  #infoModal[style*="display: flex"] ~ #scrollTopBtn {
      display: none !important;
      opacity: 0 !important;
      visibility: hidden !important;
      pointer-events: none !important;
  }


/* --- inline block 82 --- */
/* Garante que o botão de modo claro/escuro apareça no mobile,
     mesmo se o script de tema não rodar (ex: Instagram WebView) */
  @media (max-width: 860px) {
    #themeToggle,
    .theme-toggle {
      opacity: 1 !important;
      visibility: visible !important;
    }
  }


/* --- inline block 83 --- */
@media (max-width: 768px) {
    .hero h1 {
      font-size: 1.9rem !important;
      line-height: 1.15 !important;
      max-width: 330px !important;
      margin: 0 auto !important;
      text-align: center !important;
      white-space: normal !important;
    }
  }


/* --- inline block 84 --- */
html:not(.light-theme) .accent {
    color: #f8d90f;
  }
  html.light-theme .accent {
    color: #a87800;
  }


/* --- inline block 85 --- */
#cases.cases-section {
    padding: 4rem 0;
  }
  #cases .intro-text {
    max-width: 640px;
    margin: 0 auto 2rem;
    text-align: center;
    opacity: 0.9;
  }
  #cases .case-card {
    margin: 0 auto 1.5rem;
    padding: 1.5rem 1.75rem;
    border-radius: 16px;
    backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.08);
  }
  html.light-theme #cases .case-card {
    border-color: rgba(0, 0, 0, 0.08);
  }
  #cases blockquote {
    margin: 0 0 0.75rem;
    font-style: italic;
  }
  #cases footer {
    font-size: 0.95rem;
    opacity: 0.85;
  }


/* --- inline block 86 --- */
.skip-link {
      position: absolute;
      left: -9999px;
      top: auto;
      width: 1px;
      height: 1px;
      overflow: hidden;
    }
    .skip-link:focus {
      position: fixed;
      left: 16px;
      top: 16px;
      width: auto;
      height: auto;
      padding: .6rem .9rem;
      z-index: 100000;
      background: #f8d90f;
      color: #000;
      border-radius: 10px;
      outline: none;
      box-shadow: 0 4px 12px rgba(0,0,0,.25);
      text-decoration: none;
      font-weight: 600;
    }


/* --- inline block 87 --- */
/* --- Consolidado Core --- */

  /* 1) Robô desktop: garante que só a pose correta aparece */
  #robo .pose {
    display: none !important;
  }

  /* No modo claro, apenas a pose preta aparece */
  html.light-theme #robo .pose[data-variant="preto"] {
    display: block !important;
  }

  /* No modo escuro, apenas a pose branca aparece */
  html:not(.light-theme) #robo .pose[data-variant="branco"] {
    display: block !important;
  }

  /* 2) Foco visível consistente em links/botões/campos */
  :where(a, button, [role="button"], input, select, textarea, summary):focus-visible {
    outline: 2px solid #f8d90f;
    outline-offset: 2px;
    border-radius: 6px;
  }

  /* 3) Botões de fechar unificados (classe utilitária) */
  .btn-close-unified {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.35);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.1s ease;
  }

  .btn-close-unified:hover {
    background: rgba(255, 255, 255, 0.25);
  }

  html.light-theme .btn-close-unified {
    background: rgba(255, 255, 255, 0.85);
  }

  html.light-theme .btn-close-unified:hover {
    background: rgba(0, 0, 0, 0.12);
  }

  .btn-close-unified::before,
  .btn-close-unified::after {
    content: "";
    position: absolute;
    width: 18px;
    height: 2px;
    background: #fff;
    border-radius: 2px;
  }

  .btn-close-unified::before {
    transform: rotate(45deg);
  }

  .btn-close-unified::after {
    transform: rotate(-45deg);
  }

  html.light-theme .btn-close-unified::before,
  html.light-theme .btn-close-unified::after {
    background: #111;
  }


/* --- inline block 88 --- */
#imageModal #modalCaption{font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";font-weight:600;letter-spacing:.01em;text-shadow:0 1px 2px rgba(0,0,0,.35);}#imageModal #modalCounter{font-variant-numeric:tabular-nums;opacity:.85;}@media (max-width:480px){#imageModal .close-modal{top:14px;right:14px;}#imageModal #modalImage{max-width:94vw;max-height:78vh;}}


/* --- inline block 89 --- */
html.light-theme #dataHora{color:#111 !important;}html:not(.light-theme) #dataHora{color:#fff !important;}html.light-theme footer,html.light-theme footer *,html.light-theme .copyright,html.light-theme [data-role="copyright"]{color:#111 !important;}html.light-theme footer a:hover,html.light-theme footer a:focus-visible{text-decoration:underline;}


/* --- inline block 90 --- */
html.light-theme footer{background:#ffffff !important;color:#111 !important;}html.light-theme footer *{color:#111 !important;}html.light-theme footer a:hover,html.light-theme footer a:focus-visible{text-decoration:underline;}@media (max-width:768px){html.light-theme footer{padding-bottom:92px !important;}}html.light-theme .copyright,html.light-theme [data-role="copyright"]{display:block;opacity:0.92;}html.light-theme footer::before,html.light-theme footer::after{background:transparent !important;}body.light-theme footer,body.light-theme footer *{color:#111 !important;background:#fff !important;}


/* --- inline block 91 --- */
footer{padding-top:20px !important;padding-bottom:24px !important;}html.light-theme footer{padding-bottom:24px !important;}html:not(.light-theme) footer{padding-bottom:24px !important;}@media (max-width:768px){#scrollTopBtn,#backToTop,#themeToggle,#ai-play,.btn-circular[data-floating="true"]{position:fixed;bottom:92px !important;}}@media (max-width:768px){[data-fab="true"]{bottom:92px !important;position:fixed;}}@media (max-width:480px){#scrollTopBtn,#backToTop,#themeToggle,#ai-play{width:52px !important;height:52px !important;}}


/* --- inline block 92 --- */
#videos button[aria-label="Reproduzir vídeo"]{display:none !important;}


/* --- inline block 93 --- */
#videos .video-wrapper{position:relative;display:block;}#videos .video-wrapper video{width:100% !important;height:auto !important;border-radius:10px;display:block;}#videos .video-overlay-play{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,0.25);opacity:0;transition:opacity 0.3s ease;border-radius:10px;pointer-events:none;}#videos .video-wrapper:hover .video-overlay-play,#videos .video-wrapper:not(.is-playing) .video-overlay-play{opacity:1;pointer-events:auto;}#videos .video-overlay-play svg{width:60px;height:60px;fill:#ffffff;opacity:0.85;transition:transform 0.2s ease,opacity 0.2s ease;}#videos .video-overlay-play:hover svg{transform:scale(1.08);opacity:1;}#scrollTopBtn,#backToTop{position:fixed;bottom:24px;right:24px;width:54px;height:54px;background-color:#ffcc00;color:#000;border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 10px rgba(0,0,0,0.25);z-index:999;transition:all 0.3s ease;}#scrollTopBtn:hover,#backToTop:hover{background-color:#e6b800;transform:translateY(-2px);}#scrollTopBtn svg,#backToTop svg{width:22px;height:22px;stroke:currentColor;stroke-width:3.2;fill:none;stroke-linecap:round;stroke-linejoin:round;}


/* --- inline block 94 --- */
#videos .video-wrapper.is-playing .video-overlay-play{display:none !important;opacity:0 !important;visibility:hidden !important;pointer-events:none !important;}


/* --- inline block 95 --- */
#galleryImageModal[aria-hidden="false"] .gallery-nav,
#galleryImageModal[aria-hidden="false"] #galleryPrev,
#galleryImageModal[aria-hidden="false"] #galleryNext {
 display: inline-flex !important;
 opacity: 0.9 !important;
 visibility: visible !important;
 pointer-events: auto !important;
 z-index: 10003 !important;
}


/* --- inline block 96 --- */
/* Força máxima prioridade às setas no modal da Galeria */
#galleryImageModal[aria-hidden="false"] .gallery-nav,
#galleryImageModal[aria-hidden="false"] #galleryPrev,
#galleryImageModal[aria-hidden="false"] #galleryNext {
 display: flex !important;
 visibility: visible !important;
 opacity: 1 !important;
 pointer-events: auto !important;
 z-index: 10005 !important;
 position: absolute !important;
 top: 50% !important;
 transform: translateY(-50%) !important;
 color: #fff !important;
 font-size: 48px !important;
 background: rgba(0, 0, 0, 0.35) !important;
 border-radius: 50% !important;
 width: 56px !important;
 height: 56px !important;
 align-items: center !important;
 justify-content: center !important;
 transition: all 0.25s ease-in-out !important;
}

#galleryImageModal #galleryPrev { left: 20px !important; }
#galleryImageModal #galleryNext { right: 20px !important; }

#galleryImageModal .gallery-nav:hover {
 background: rgba(255, 255, 255, 0.25) !important;
 transform: translateY(-50%) scale(1.05) !important;
}


/* --- inline block 97 --- */
#galleryImageModal .gallery-close {
 position: absolute !important;
 top: 16px !important;
 right: 16px !important;
 width: 44px !important;
 height: 44px !important;
 border-radius: 50% !important;
 border: 1px solid rgba(255, 255, 255, 0.25) !important;
 background: rgba(0, 0, 0, 0.55) !important;
 color: #fff !important;
 font-size: 22px !important;
 line-height: 1 !important;
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 cursor: pointer !important;
 transition: all 0.25s ease-in-out !important;
 z-index: 10010 !important;
}

#galleryImageModal .gallery-close:hover {
 background: rgba(255, 255, 255, 0.25) !important;
 transform: scale(1.05) !important;
}


/* --- inline block 98 --- */
/* Força contraste correto do X em QUALQUER modal no modo escuro */
  html:not(.light-theme) .close-modal {
    color: #fff !important;
    background: rgba(0,0,0,.85) !important;
    border: 1.5px solid rgba(255,255,255,.35) !important;
    text-shadow: none !important;
    transition: all 0.25s ease-in-out !important;
  }
  /* Mantém contraste no modo claro */
  html.light-theme .close-modal {
    color: #111 !important;
    background: rgba(255,255,255,.95) !important;
    border: 1.5px solid rgba(0,0,0,.25) !important;
    text-shadow: none !important;
    transition: all 0.25s ease-in-out !important;
  }
  /* Hover refinado para ambos os temas */
  .close-modal:hover {
    transform: scale(1.1);
    background: rgba(255,255,255,.15) !important;
    border-color: rgba(255,255,255,.6) !important;
    cursor: pointer;
  }


/* --- inline block 99 --- */
@media (min-width: 769px) {
  #podcast .container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  #podcast p:last-of-type {
    text-align: center !important;
    margin-top: 12px !important;
    margin-bottom: 24px !important;
    max-width: 680px !important;
  }
}


/* --- inline block 100 --- */
/* === Degradê amarelo→laranja visível na seção Podcast === */
#podcast h2 i,
#podcast h2 svg {
  background: linear-gradient(90deg, #f8d90f 0%, #ff8a00 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  display: inline-block !important;
  vertical-align: middle !important;
}

/* Desktop */
@media (min-width: 769px) {
  #podcast h2 i {
    font-size: 1.35em !important;
    margin-right: 10px !important;
  }
}

/* Mobile */
@media (max-width: 768px) {
  section h2 i,
  section h2 svg {
    font-size: 1.15em !important;
  }
}


/* --- inline block 101 --- */
/**********************************************
 * 2025.1 – ÍCONES + MICRO-INTERAÇÕES UNIFICADOS
 **********************************************/

/* ---------- 1. Botões de fechar (Galeria, Portfólio e Currículo) ---------- */

:root {
  --br-close-size: 44px;
  --br-close-bg-dark: rgba(0, 0, 0, 0.55);
  --br-close-bg-light: rgba(255, 255, 255, 0.92);
  --br-close-border-dark: rgba(255, 255, 255, 0.25);
  --br-close-border-light: rgba(0, 0, 0, 0.20);
  --br-close-icon-dark: #fff;
  --br-close-icon-light: #111;
}

/* Base idêntica para os três modais (galeria, portfólio e currículo) */
#galleryImageModal .gallery-close,
#imageModal .close-modal,
#infoModal .modal-content > span[role="button"] {
  position: absolute;
  top: 16px;
  right: 16px;
  width: var(--br-close-size);
  height: var(--br-close-size);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: 1px solid var(--br-close-border-dark);
  background: var(--br-close-bg-dark);
  z-index: 10010;
  box-shadow: none;
  transition:
    background 0.24s ease,
    transform 0.24s ease,
    box-shadow 0.24s ease;
  /* zera interferências de texto */
  font-size: 0;
  line-height: 0;
  color: transparent;
  text-shadow: none;
  outline: none;
}

/* Tema claro: fundo claro + X escuro */
html.light-theme #galleryImageModal .gallery-close,
html.light-theme #imageModal .close-modal,
html.light-theme #infoModal .modal-content > span[role="button"] {
  background: var(--br-close-bg-light);
  border-color: var(--br-close-border-light);
}

/* Ícone X por pseudo-elementos – igual nos três modais */
#galleryImageModal .gallery-close::before,
#galleryImageModal .gallery-close::after,
#imageModal .close-modal::before,
#imageModal .close-modal::after,
#infoModal .modal-content > span[role="button"]::before,
#infoModal .modal-content > span[role="button"]::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 22px;
  height: 2.5px;
  border-radius: 2px;
  transform-origin: center;
}

/* Cores do X por tema */
#galleryImageModal .gallery-close::before,
#galleryImageModal .gallery-close::after,
#imageModal .close-modal::before,
#imageModal .close-modal::after,
#infoModal .modal-content > span[role="button"]::before,
#infoModal .modal-content > span[role="button"]::after {
  background: var(--br-close-icon-dark);
}

html.light-theme #galleryImageModal .gallery-close::before,
html.light-theme #galleryImageModal .gallery-close::after,
html.light-theme #imageModal .close-modal::before,
html.light-theme #imageModal .close-modal::after,
html.light-theme #infoModal .modal-content > span[role="button"]::before,
html.light-theme #infoModal .modal-content > span[role="button"]::after {
  background: var(--br-close-icon-light);
}

/* Angulos do X */
#galleryImageModal .gallery-close::before,
#imageModal .close-modal::before,
#infoModal .modal-content > span[role="button"]::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
#galleryImageModal .gallery-close::after,
#imageModal .close-modal::after,
#infoModal .modal-content > span[role="button"]::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* Hover/foco – minimalista */
#galleryImageModal .gallery-close:hover,
#imageModal .close-modal:hover,
#infoModal .modal-content > span[role="button"]:hover {
  transform: scale(1.05);
  background: rgba(255, 255, 255, 0.22);
}

html.light-theme #galleryImageModal .gallery-close:hover,
html.light-theme #imageModal .close-modal:hover,
html.light-theme #infoModal .modal-content > span[role="button"]:hover {
  background: rgba(0, 0, 0, 0.06);
}

#galleryImageModal .gallery-close:focus-visible,
#imageModal .close-modal:focus-visible,
#infoModal .modal-content > span[role="button"]:focus-visible {
  outline: 3px solid #f8d90f;
  outline-offset: 2px;
}

/* ---------- 2. Navegação / setas da galeria ---------- */

#galleryImageModal .gallery-nav {
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%) translateX(0);
  opacity: 0;
  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
  z-index: 10001;
}

/* Mostra as setas quando o modal está aberto */
#galleryImageModal[aria-hidden="false"] #galleryPrev,
#galleryImageModal[aria-hidden="false"] #galleryNext {
  opacity: 0.9;
}

/* Hover */
#galleryImageModal .gallery-nav:hover {
  opacity: 1;
}

/* Garante que a imagem não roube o foco visual */
#galleryImageModal img {
  outline: none;
  box-shadow: none;
}

/* ---------- 3. Linhas de seção / títulos ---------- */

.section-line,
.title-line,
.linha,
.linha-de,
.separator-line {
  height: 2px;
  width: 100%;
  display: block;
  border: 0;
  background: currentColor;
}

/* Contraste adequado por tema */
html.light-theme .section-line,
html.light-theme .title-line,
html.light-theme .linha,
html.light-theme .linha-de,
html.light-theme .separator-line {
  background: #000;
}

html:not(.light-theme) .section-line,
html:not(.light-theme) .title-line,
html:not(.light-theme) .linha,
html:not(.light-theme) .linha-de,
html:not(.light-theme) .separator-line {
  background: #f8d90f;
}

/* ---------- 4. Botão de scroll-to-top ---------- */

#scrollTopBtn {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  display: none; /* controlado pelo JS */
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  background: #ffcc00;
  color: #000;
  line-height: 1;
  padding: 0;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    background 0.2s ease;
  z-index: 999;
}

#scrollTopBtn:hover {
  background: #e6b800;
  transform: translateY(-1px);
}

html.light-theme #scrollTopBtn {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
}

html:not(.light-theme) #scrollTopBtn {
  box-shadow: none;
}


/* --- inline block 102 --- */
/* === CORREÇÃO: Resgate do Botão Fechar do Currículo === */
  #infoModal .close-modal,
  #infoModal .modal-content > span[role="button"] {
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 10050 !important; 
    position: absolute !important; 
    top: 15px !important;
    right: 15px !important;
  }

  #infoModal .close-modal::before,
  #infoModal .close-modal::after,
  #infoModal .modal-content > span[role="button"]::before,
  #infoModal .modal-content > span[role="button"]::after {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  @media (max-width: 480px) {
    #infoModal .close-modal {
      width: 40px !important;
      height: 40px !important;
      top: 12px !important;
      right: 12px !important;
    }
  }


/* --- inline block 103 --- */
@media (max-width: 320px) {
  .hero .hero-subtitle,
  .hero .hero-description,
  .hero p {
    font-size: 0.85rem;
    line-height: 1.35;
  }
  .hero {
    padding-inline: 12px;
  }
}

/* Hamburger backdrop mais visível */
#drawerBackdrop {
  background: rgba(0, 0, 0, 0.6);
}

/* Galeria com margem maior em tablet landscape */
@media (min-width: 768px) and (max-width: 1024px) {
  #gallery .carousel-container {
    padding-inline: 32px;
  }
}

/* Some o cursor holográfico quando navega via teclado */
body.keyboard-nav .custom-cursor,
body.keyboard-nav .custom-cursor-dot {
  display: none !important;
}