/* ===========================================================
   STYLES — Ana Ferreira Real — Silver Coast Lawyers
   Final build (wide logo, dark theme, gold accents)
   =========================================================== */

:root{
  --bg:#0b0b0b;
  --panel:#121212;
  --text:#f2f2f2;
  --muted:#bdbdbd;
  --gold:#d4b26a;
  --line:#1e1e1e;
  --logo-w: 640px; /* <-- adjust here for logo target width on desktop */
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter, ui-sans-serif, system-ui, Segoe UI, Roboto, Arial}
a{color:inherit;text-decoration:none}

.wrap{max-width:980px;margin:0 auto;padding:0 20px}
.site-header{border-bottom:1px solid var(--line);background:linear-gradient(180deg,#0d0d0d,#090909)}
.header-inner{display:flex;align-items:center;justify-content:center;gap:18px;padding:28px 0;position:relative}

/* Language switcher */
.lang{position:absolute;right:20px;top:50%;transform:translateY(-50%);}
.lang a{display:inline-block;border:1px solid var(--gold);border-radius:999px;padding:6px 10px;margin-left:8px;color:var(--gold);font-weight:600}
.lang a.active, .lang a:hover{background:var(--gold);color:#111}

/* Big logo */
.site-header .logo{
  width:var(--logo-w) !important;
  max-width:95vw !important;
  height:auto !important;
  display:block !important;
  margin:0 auto 6px !important;
  transform:none !important;
  filter:none !important;
  box-shadow:none !important;
}

/* Content */
.hero{text-align:center;padding:28px 0 16px}
.hero h1{font-size:2.2rem;margin:8px 0 6px}
.tagline{color:var(--muted);margin:4px 0 14px}

.btn{display:inline-block;border:1px solid var(--gold);border-radius:10px;padding:10px 16px;margin:6px;color:var(--gold);font-weight:600}
.btn.primary{background:var(--gold);color:#111}
.btn:hover{background:var(--gold);color:#111}

.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;margin:18px 0}
.card h2{color:var(--gold);margin:0 0 10px;font-size:1.3rem}
.card ul{padding-left:18px}
.card li{margin:6px 0}

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

/* Responsive */
@media (max-width: 768px){
  :root{ --logo-w: 88vw; }
  .lang{right:12px}
}
/* ==== Corrigir botões de idioma no telemóvel ==== */
@media (max-width: 768px) {

  /* A barra de idiomas deixa de ser absoluta e passa a comportar-se normalmente */
  .language-buttons {
    position: static !important;
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
    margin-bottom: -10px; /* opcional, ajusta espaço */
  }

  /* Ajustar tamanho e espaçamento dos botões no telemóvel */
  .language-buttons a {
    font-size: 14px;
    padding: 4px 8px;
  }
}