:root{
  --bg:#0b0c10;
  --surface:#10131a;
  --card:#121826;
  --text:#e7e9ee;
  --muted:#a7afc0;
  --line:rgba(255,255,255,.10);
  --shadow: 0 18px 60px rgba(0,0,0,.35);
  --radius:18px;
  --radius-lg:26px;
  --pad:22px;
  --max:1180px;
}

html,body{height:100%;}
body{
  background: radial-gradient(1200px 700px at 15% -10%, rgba(120,140,255,.10), transparent 55%),
              radial-gradient(900px 600px at 95% 0%, rgba(255,200,120,.08), transparent 55%),
              var(--bg);
  color:var(--text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.55;
}

a{color:inherit;}
img{max-width:100%; height:auto; display:block;}
.wrap{max-width:100%;}

/* Layout container */
.section-defaults{
  max-width: var(--max);
  margin: 0 auto;
  padding: 34px 16px;
}

.section-defaults .title{
  display:inline-block;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:10px;
}

.section-defaults .subtitle{
  font-size: clamp(22px, 2.5vw, 34px);
  margin: 0 0 18px 0;
  font-weight: 800;
}

.content p{color:rgba(231,233,238,.92);}

/* Nav */
.main-header nav{
  background: rgba(16,19,26,.55);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(10px);
}
.main-header .brand-logo img{height:44px; margin-top:10px;}
#nav-mobile li a, #mob li a{font-weight:600; letter-spacing:.02em;}
#nav-mobile li a{line-height:64px;}
#nav-mobile li a:focus,
#nav-mobile li a:active{
  background: rgba(255,255,255,.10) !important;
  color:#fff !important;
}
#nav-mobile li.is-active a{color:#fff;}
#nav-mobile li.is-active a::after{
  content:"";
  display:block;
  height:2px;
  margin-top:8px;
  background: linear-gradient(90deg, rgba(255,255,255,.0), rgba(255,255,255,.6), rgba(255,255,255,0));
}

/* Cards */
.card{
  border-radius: var(--radius);
  background: rgba(18,24,38,.72);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.card .card-content{padding: 18px;}
.card .card-title{font-weight:800;}
.card-image img{aspect-ratio: 16/10; object-fit: cover;}

/* Blog grid */
.blog .content .read-item{padding: 10px !important;}
.blog .content .read-item .card{height:100%;}
.read-item .card-content{display:flex; flex-direction:column; gap:12px;}
.read-item .card-text p{color:var(--muted);}
.read-item .card-text a{font-weight:700; text-decoration:none;}
.read-item .addthis_toolbox{opacity:.9}

/* Portfolio */
.portfolio .content{display:grid; grid-template-columns: repeat(12, 1fr); gap: 18px;}
.portfolio-items{grid-column: span 4;}
@media (max-width: 992px){ .portfolio-items{grid-column: span 12;} }
.portfolio-title{display:block; font-weight:900; font-size:18px; margin: 8px 0 12px;}
.portfolio-items a{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: rgba(16,19,26,.55);
  margin-bottom:12px;
  transition: transform .25s ease, background .25s ease, border-color .25s ease;
  text-decoration:none;
}
.portfolio-items a:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.20);
  background: rgba(18,24,38,.85);
}
.portfolio-items a img{
  width: 86px; height: 64px;
  border-radius: 12px;
  object-fit: cover;
}
.portfolio-items a span{font-weight:800}

/* Projeto */
.post .carousel{border-radius: var(--radius-lg); overflow:hidden; border:1px solid var(--line); box-shadow: var(--shadow);}
.collapsible{border:none; box-shadow:none;}
.collapsible li{border-radius: 16px; overflow:hidden; border:1px solid var(--line); margin-bottom:10px; background: rgba(18,24,38,.55);}
.collapsible-header{background:transparent; color:var(--text); font-weight:800;}
.collapsible-body{background: rgba(16,19,26,.55); color:rgba(231,233,238,.92);}

/* Buttons */
.btn, .waves-effect.waves-light.btn{
  border-radius: 999px !important;
  background: rgba(255,255,255,.12) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: none !important;
  color: #fff !important;
  font-weight:800 !important;
  text-transform:none !important;
}
.btn:hover{background: rgba(255,255,255,.18) !important;}

/* Reveal animations (progressive enhancement: sem JS, nada fica escondido) */
.reveal{opacity:1; transform:none; transition: opacity .7s ease, transform .7s ease;}
html.js-reveal .reveal{opacity:0; transform: translateY(12px);}
html.js-reveal .reveal.is-in{opacity:1; transform:none;}

/* Links section (híbrido: painel claro para não “estourar” os logos brancos) */
.links .content{
  background: rgba(255,255,255,.92);
  border-radius: var(--radius-lg);
  padding: 18px;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 12px 40px rgba(0,0,0,.18);
}
.links .content p{color: rgba(10,12,16,.78) !important;}
.links .content .link-item img{
  background: #fff;
  border-radius: 16px;
  padding: 10px;
  border: 1px solid rgba(0,0,0,.06);
}
