:root{
  --tile-blue:#1e4f91;          /* Azul de azulejo */
  --tile-blue-light:#5f8dd3;    /* Azul claro */
  --tile-blue-dark:#133b70;     /* Azul escuro */
  --tile-gray:#f3f4f6;          /* Cinza claro para fundos */
  --tile-text:#1e2a3a;          /* Azul acinzentado para texto base */
  --tile-white:#ffffff;
}

*{box-sizing:border-box}

body{
  font-family:'Montserrat',sans-serif;
  color:var(--tile-text);
  background:var(--tile-white);
}

.artistic-font{font-family:'Playfair Display',serif}

/* Fundos */
.bg-deep{
  background:linear-gradient(180deg,var(--tile-white) 0%, var(--tile-gray) 100%);
}

.gradient-bg{
  background:radial-gradient(1200px 600px at 50% 40%, rgba(30,79,145,0.05), transparent 60%),
              linear-gradient(160deg,var(--tile-white),var(--tile-gray),var(--tile-white));
}

/* Hero Section */
.hero-section{
  background:linear-gradient(160deg,var(--tile-white),var(--tile-gray),var(--tile-white));
  position:relative;
}

.hero-background{
  background-image:url('img/hero-background.jpg');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:0.25;
}

/* Navbar */
.navbar{
  backdrop-filter:blur(8px);
  background:rgba(255,255,255,0.9);
}
.site-title{color:var(--tile-blue-dark);}
.navbar .nav-link, .navbar .nav-toggle{color:var(--tile-blue-dark);}
.navbar-scrolled{
  background:rgba(255,255,255,0.95) !important;
  box-shadow:0 8px 30px rgba(0,0,0,0.1);
}
.navbar-scrolled .nav-link,
.navbar-scrolled .site-title,
.navbar-scrolled .nav-toggle{color:var(--tile-blue-dark) !important;}
.mobile-menu{background:var(--tile-blue);}
.mobile-link{color:var(--tile-white);}

/* Hero */
.hero-title{
  letter-spacing:.5px;
  color:var(--tile-blue-dark);
}

/* Botões */
.btn-primary{
  display:inline-block;
  background:var(--tile-blue);
  color:var(--tile-white);
  padding:.9rem 1.4rem;
  border-radius:9999px;
  font-weight:600;
  transition:transform .2s, box-shadow .2s;
  text-decoration:none;
}
.btn-primary:hover{
  transform:translateY(-1px); 
  box-shadow:0 8px 24px rgba(30,79,145,.3);
}

.btn-ghost{
  display:inline-block;
  border:1px solid var(--tile-blue-light);
  color:var(--tile-blue-dark);
  padding:.9rem 1.2rem;
  border-radius:9999px;
  font-weight:600;
  text-decoration:none;
  transition:background .2s;
}
.btn-ghost:hover{
  background:var(--tile-blue-light);
  color:var(--tile-white);
}

/* Cartões */
.card{
  background:var(--tile-white); 
  border:1px solid var(--tile-blue-light); 
  border-radius:1rem; 
  padding:1.25rem;
  text-decoration:none;
  color:var(--tile-text);
  display:block;
}
.card-title{font-weight:700; font-size:1.2rem; color:var(--tile-blue-dark);}
.card-text{opacity:.85; color:var(--tile-text);}
.card:hover{text-decoration:none; color:var(--tile-text);}
.card-body{padding:.5rem}

/* Page Header */
.page-hero{
  padding:7rem 1rem 3rem 1rem;
  background:linear-gradient(180deg,rgba(30,79,145,.05),rgba(30,79,145,0));
  text-align:center;
}
.page-hero h1, .page-hero p{color:var(--tile-blue-dark);}

/* Inputs */
.input{
  width:100%; 
  padding:.9rem 1rem; 
  background:var(--tile-gray); 
  border:1px solid var(--tile-blue-light); 
  border-radius:.75rem; 
  color:var(--tile-text);
}
.input::placeholder{color:rgba(30,79,145,0.6);}
.input:focus{
  outline:none; 
  box-shadow:0 0 0 3px rgba(30,79,145,.25); 
  border-color:var(--tile-blue);
}

/* Footer */
.footer{
  background:var(--tile-gray); 
  color:var(--tile-blue-dark);
}

/* Gallery */
.gallery-card{
  break-inside:avoid; 
  display:block; 
  border-radius:1rem; 
  overflow:hidden; 
  border:1px solid var(--tile-blue-light); 
  background:var(--tile-white); 
  margin-bottom:1.5rem;
  color:var(--tile-text);
  text-decoration:none;
}
.gallery-card:hover{text-decoration:none; color:var(--tile-blue-dark);}
.gallery-img{width:100%; height:auto; display:block; transition:transform .4s ease}
.gallery-card:hover .gallery-img{transform:scale(1.06)}
.gallery-meta{padding:.9rem 1rem; display:flex; flex-direction:column; gap:.25rem}
.gallery-meta h3{font-weight:600; color:var(--tile-blue-dark);}
.gallery-meta p{opacity:.8; font-size:.9rem; color:var(--tile-text);}

/* Lightbox */
.lightbox{
  display:none; 
  position:fixed; 
  inset:0; 
  background:rgba(30,79,145,.95); 
  z-index:1000; 
  justify-content:center; 
  align-items:center; 
  padding:2rem;
}
.lightbox.active{display:flex;}
.lightbox-content{max-width:90%; max-height:90%; position:relative;}
.lightbox img{max-width:100%; max-height:80vh; border-radius:12px;}
.lightbox-caption{color:var(--tile-white); margin-top:.8rem;}
.lightbox-close{position:absolute; top:-40px; right:0; color:var(--tile-white); font-size:2rem; cursor:pointer;}
.lightbox-nav{
  position:absolute; top:50%; left:0; right:0;
  display:flex; justify-content:space-between;
  transform:translateY(-50%); padding:0 10px;
}
.lightbox-nav button{
  background:rgba(255,255,255,.3);
  color:var(--tile-blue-dark);
  border:none; padding:10px 14px;
  border-radius:999px; cursor:pointer; font-size:1.2rem;
}

/* Tabs */
.tab-btn{
  padding:.6rem 1.2rem; 
  border-radius:9999px; 
  border:1px solid var(--tile-blue-light); 
  color:var(--tile-blue-dark); 
  background:var(--tile-gray);
  cursor:pointer;
  transition:background .2s, border-color .2s;
}
.tab-btn:hover{background:var(--tile-blue-light); color:var(--tile-white);}
.tab-btn.is-active{
  border-color:var(--tile-blue); 
  box-shadow:0 0 0 2px rgba(30,79,145,.2) inset;
}

/* Info Cards */
.info-card{
  background:var(--tile-gray); 
  border:1px solid var(--tile-blue-light); 
  border-radius:.75rem; 
  padding:.75rem .9rem; 
  display:flex; flex-direction:column;
}
.info-card .label{opacity:.7; font-size:.8rem; color:var(--tile-blue-dark);}
.info-card .value{font-weight:600; color:var(--tile-text);}

/* Ícones sociais */
.social-icon{
  transition:transform .2s, color .2s; 
  color:var(--tile-blue-dark);
  text-decoration:none;
}
.social-icon:hover{
  transform:translateY(-4px) scale(1.08); 
  color:var(--tile-blue);
  text-decoration:none;
}

/* Animações */
@keyframes fadeIn{from{opacity:0; transform:translateY(30px)} to{opacity:1; transform:translateY(0)}}
@keyframes float{0%,100%{transform:translateY(0)} 50%{transform:translateY(-16px)}}
.animate-fade-in{animation:fadeIn 1s ease-out forwards;}
.animate-float{animation:float 6s ease-in-out infinite;}

/* Responsivo */
@media (max-width: 768px) {
  .hero-title { font-size: 3rem; }
  .card-body { padding: 1rem; }
  .gallery-meta { padding: 0.75rem; }
}