:root{
  --navy: #0A2647;
  --navy-2: #163A63;
  --blue: #4C86B4;
  --green-dark: #0D6420;
  --green: #7FB238;
  --gold: #F2C14E;
  --gold-soft: #F6D585;
  --sand: #EDE9DE;
  --paper: #FAF8F3;
  --ink: #1E2A33;
  --ink-soft: #57626B;
  --line: rgba(30,42,51,0.12);
  --radius: 2px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Work Sans',sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;}
h1,h2,h3{ font-family:'Newsreader',serif; font-weight:500; letter-spacing:-0.01em; }

.eyebrow{ font-family:'IBM Plex Mono',monospace; font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--gold); }
.eyebrow.on-light{ color:var(--green-dark); }

.wrap{ max-width:1080px; margin:0 auto; padding:0 28px; }

/* ---------- Horizon divider bands: chains breaking into light ---------- */
.band{ width:100%; height:56px; }
.band-1{ background:linear-gradient(180deg,var(--navy) 0%, var(--navy-2) 100%); }
.band-2{ background:linear-gradient(180deg,var(--navy-2) 0%, #4B5D6E 100%); }
.band-3{ background:linear-gradient(180deg,#4B5D6E 0%, #A98A5C 100%); }
.band-4{ background:linear-gradient(180deg,#A98A5C 0%, var(--gold) 100%); }
.band-5{ background:linear-gradient(180deg,var(--gold) 0%, var(--sand) 100%); }

/* ---------- Logo ---------- */
.logo{ display:flex; align-items:center; gap:12px; }
.logo img{ width:66px; height:auto; flex-shrink:0; }
.logo-name{ font-family:'Newsreader',serif; font-size:1.15rem; font-weight:500; }
.logo-name .sub{ display:block; font-family:'IBM Plex Mono',monospace; font-size:0.6rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-soft); margin-top:2px; }

/* ---------- Top bar ---------- */
.topbar{ position:sticky; top:0; z-index:40; background:rgba(250,248,243,0.94); backdrop-filter:blur(6px); border-bottom:1px solid var(--line); }
.topbar-inner{ max-width:1080px; margin:0 auto; padding:14px 28px; display:flex; align-items:center; justify-content:space-between; gap:24px; }

.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'IBM Plex Mono',monospace; font-size:0.78rem; letter-spacing:0.03em;
  text-decoration:none; padding:10px 18px; border:1px solid var(--ink);
  border-radius:var(--radius); transition:all .2s ease; white-space:nowrap;
  background:transparent; color:inherit; cursor:pointer;
  appearance:none; -webkit-appearance:none; margin:0;
}
.btn-solid{ background:var(--ink); color:var(--paper); }
.btn-solid:hover{ background:var(--green-dark); border-color:var(--green-dark); }
.btn-ghost:hover{ background:var(--ink); color:var(--paper); }
.btn .wa-icon{ width:20px; height:20px; flex-shrink:0; object-fit:contain; }

/* ---------- Nav menu (new) ---------- */
.nav-menu{ display:flex; align-items:center; gap:28px; }
.nav-links{ display:flex; align-items:center; gap:26px; list-style:none; }
.nav-links a{
  font-family:'IBM Plex Mono',monospace; font-size:0.76rem; letter-spacing:0.04em;
  text-transform:uppercase; text-decoration:none; color:var(--ink-soft);
  padding:6px 2px; border-bottom:1px solid transparent; transition:all .2s ease;
}
.nav-links a:hover, .nav-links a.active{ color:var(--ink); border-bottom-color:var(--green); }

/* Prominent CTA in the topbar */
.btn-cta{
  background:var(--gold); border:1px solid var(--gold); color:var(--navy);
  font-weight:500; padding:12px 24px; border-radius:999px;
  box-shadow:0 4px 14px rgba(242,193,78,0.45);
}
.btn-cta:hover{ background:var(--gold-soft); border-color:var(--gold-soft); color:var(--navy); box-shadow:0 6px 18px rgba(242,193,78,0.6); transform:translateY(-1px); }

.nav-toggle{
  display:none; background:none; border:1px solid var(--ink); border-radius:var(--radius);
  padding:8px 10px; cursor:pointer; align-items:center; justify-content:center;
}
.nav-toggle svg{ width:20px; height:20px; display:block; }

/* ---------- Hero ---------- */
.hero{
  background:radial-gradient(ellipse at 50% -10%, var(--navy-2) 0%, var(--navy) 55%);
  color:var(--sand); padding:96px 0 80px; position:relative; overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    radial-gradient(1px 1px at 12% 22%, rgba(237,233,222,.5) 50%, transparent 51%),
    radial-gradient(1px 1px at 30% 10%, rgba(237,233,222,.35) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 68% 16%, rgba(237,233,222,.4) 50%, transparent 51%),
    radial-gradient(1px 1px at 80% 28%, rgba(237,233,222,.3) 50%, transparent 51%),
    radial-gradient(1px 1px at 92% 10%, rgba(237,233,222,.45) 50%, transparent 51%);
  pointer-events:none;
}
/* Sunburst breaking through, echoing the chains-breaking mark of the institute */
.sunburst{
  position:absolute; left:50%; top:30%; width:1000px; height:1000px;
  margin-left:-500px; margin-top:-500px;
  background:conic-gradient(from 0deg,
    rgba(242,193,78,0.14) 0deg, rgba(242,193,78,0.02) 14deg, transparent 26deg,
    transparent 40deg, rgba(242,193,78,0.02) 52deg, rgba(242,193,78,0.14) 64deg,
    rgba(242,193,78,0.02) 78deg, transparent 90deg, transparent 220deg,
    rgba(242,193,78,0.02) 232deg, rgba(242,193,78,0.14) 244deg, rgba(242,193,78,0.02) 256deg,
    transparent 270deg, transparent 346deg, rgba(242,193,78,0.14) 360deg);
  border-radius:50%;
  animation:spin 40s linear infinite;
  pointer-events:none;
}
@keyframes spin{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){ .sunburst{ animation:none; } }

.hero-inner{ position:relative; z-index:2; max-width:640px; }
.hero-logo{ width:190px; height:auto; margin-bottom:22px; filter:drop-shadow(0 8px 24px rgba(0,0,0,0.35)); }
.hero .eyebrow{ margin-bottom:4px; }
.hero h1{ font-size:clamp(2.1rem,4.4vw,3.2rem); color:var(--paper); margin:6px 0 6px; }
.hero .role{ font-family:'IBM Plex Mono',monospace; font-size:0.85rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:20px; }
.hero p.lede{ max-width:50ch; color:rgba(237,233,222,0.82); font-size:1rem; margin-bottom:30px; }
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; }
.hero-ctas .btn-solid{ background:var(--gold); border-color:var(--gold); color:var(--navy); }
.hero-ctas .btn-solid:hover{ background:var(--gold-soft); border-color:var(--gold-soft); }
.hero-ctas .btn-ghost{ border-color:rgba(237,233,222,0.4); color:var(--sand); }
.hero-ctas .btn-ghost:hover{ background:rgba(237,233,222,0.1); color:var(--paper); }

/* ---------- Sections ---------- */
section{ padding:64px 0; }
.section-head{ max-width:60ch; margin-bottom:36px; }
.section-head h2{ font-size:clamp(1.5rem,2.6vw,1.9rem); margin-top:8px; }

.sobre{ background:var(--sand); }
.sobre p{ margin-bottom:16px; color:var(--ink-soft); max-width:72ch; }
.sobre p strong{ color:var(--ink); font-weight:500; }

/* ---------- O que tratamos ---------- */
.tratamos{ background:var(--paper); }
.tratamos-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:12px; }
.tratamos-card{ background:var(--paper); padding:30px; }
.tratamos-card .tag{ font-family:'IBM Plex Mono',monospace; font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--blue); display:block; margin-bottom:10px; }
.tratamos-card h3{ font-size:1.15rem; margin-bottom:10px; }
.tratamos-card p{ color:var(--ink-soft); font-size:0.92rem; margin-bottom:10px; }
.tratamos-card ul{ list-style:none; color:var(--ink-soft); font-size:0.88rem; }
.tratamos-card ul li{ padding:4px 0 4px 16px; position:relative; }
.tratamos-card ul li::before{ content:"—"; position:absolute; left:0; color:var(--green); }

/* ---------- Equipe ---------- */
.equipe{ background:var(--sand); }
.team-grid{ display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:12px; }
.team-card{ border:1px solid var(--line); background:var(--paper); padding:28px; display:flex; flex-direction:column; gap:16px; }
.avatar-img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:var(--radius); }
.team-card h3{ font-size:1.2rem; margin-bottom:2px; }
.team-card .role{ font-family:'IBM Plex Mono',monospace; font-size:0.8rem; letter-spacing:0.02em; color:var(--green-dark); margin-bottom:8px; }
.team-card p{ color:var(--ink-soft); font-size:0.92rem; }
.cred-chip{ display:flex; flex-wrap:wrap; gap:14px; font-family:'IBM Plex Mono',monospace; font-size:0.7rem; color:var(--ink-soft); border-top:1px solid var(--line); padding-top:12px; margin-top:4px; }
.cred-chip b{ color:var(--ink); font-weight:500; }

/* ---------- Formação e base legal: inline toggle under each photo ---------- */
.cred-toggle{ margin:0; }
.cred-toggle summary{
  cursor:pointer; list-style:none; display:inline-flex; align-items:center; gap:10px;
  font-family:'IBM Plex Mono',monospace; font-size:0.74rem; letter-spacing:0.02em;
  padding:10px 16px; border:1px solid var(--ink); border-radius:var(--radius);
  color:var(--ink); transition:all .2s ease; width:100%; justify-content:space-between;
}
.cred-toggle summary::-webkit-details-marker{ display:none; }
.cred-toggle summary::after{ content:"+"; font-family:'Work Sans',sans-serif; font-size:1rem; line-height:1; }
.cred-toggle[open] summary::after{ content:"–"; }
.cred-toggle summary:hover{ background:var(--ink); color:var(--paper); }
.cred-toggle-panel{ border:1px solid var(--line); border-top:none; background:var(--sand); padding:18px; }

/* ---------- Como funciona ---------- */
.como{ background:var(--paper); }
.steps{ display:grid; grid-template-columns:repeat(2,1fr); gap:32px 40px; margin-top:12px; }
.step{ border-top:2px solid var(--green); padding-top:16px; }
.step .num{ font-family:'IBM Plex Mono',monospace; font-size:0.75rem; color:var(--green-dark); display:block; margin-bottom:10px; }
.step h3{ font-size:1.1rem; margin-bottom:8px; font-weight:500; }
.step p{ color:var(--ink-soft); font-size:0.95rem; }

/* ---------- Para quem ---------- */
.paraquem{ background:var(--sand); }
.cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:12px; }
.card{ background:var(--sand); padding:26px; }
.card h3{ font-size:1rem; font-weight:500; margin-bottom:8px; }
.card p{ color:var(--ink-soft); font-size:0.92rem; }

/* ---------- Credencial ---------- */
.credencial{ background:var(--paper); }
.cred-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.cred-box{ border:1px solid var(--line); padding:28px; }
.cred-box h3{ font-size:1rem; margin-bottom:16px; font-weight:500; }
.cred-item{ margin-bottom:14px; }
.cred-item .k{ font-family:'IBM Plex Mono',monospace; font-size:0.65rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-soft); display:block; margin-bottom:4px; }
.cred-item .v{ font-family:'IBM Plex Mono',monospace; font-size:0.95rem; color:var(--ink); }
.cred-note{ margin-top:20px; font-size:0.85rem; color:var(--ink-soft); max-width:74ch; }

/* ---------- Contato ---------- */
.contato{ background:var(--navy); color:var(--sand); }
.contato .section-head .eyebrow{ color:var(--gold); }
.contato h2{ color:var(--paper); }
.contato-grid{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:start; }
.contato p{ color:rgba(237,233,222,0.78); margin-bottom:18px; }
.contato-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-top:8px; }
.contato-ctas .btn-solid{ background:var(--gold); border-color:var(--gold); color:var(--navy); }
.contato-ctas .btn-solid:hover{ background:var(--gold-soft); border-color:var(--gold-soft); }
.contato-ctas .btn-ghost{ border-color:rgba(237,233,222,0.4); }
.contato-ctas .btn-ghost:hover{ background:rgba(237,233,222,0.1); }

.info-list{ list-style:none; }
.info-list li{ font-family:'IBM Plex Mono',monospace; font-size:0.85rem; padding:12px 0; border-top:1px solid rgba(237,233,222,0.15); display:flex; justify-content:space-between; gap:16px; }
.info-list li:last-child{ border-bottom:1px solid rgba(237,233,222,0.15); }
.info-list .k{ color:rgba(237,233,222,0.5); }

/* ---------- Página Equipe: intro ---------- */
.equipe-intro{ background:var(--navy); color:var(--sand); padding:72px 0 56px; }
.equipe-intro .eyebrow{ color:var(--gold); }
.equipe-intro h1{ color:var(--paper); font-size:clamp(1.9rem,3.6vw,2.6rem); margin:8px 0 14px; }
.equipe-intro p{ max-width:60ch; color:rgba(237,233,222,0.82); }

/* ---------- Página Unidades ---------- */
.unidades{ background:var(--sand); }
.unidade-head{ margin-bottom:22px; }
.unidade-head .cidade{ font-family:'Newsreader',serif; font-size:1.7rem; font-weight:500; }
.unidade-head .estado{ font-family:'IBM Plex Mono',monospace; font-size:0.8rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); margin-top:4px; }
.unidade-gallery{
  display:flex; gap:16px; overflow-x:auto; padding-bottom:14px;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
}
.unidade-gallery img{
  flex:0 0 auto; width:340px; max-width:80vw; aspect-ratio:4/3; object-fit:cover;
  border-radius:var(--radius); scroll-snap-align:start; border:1px solid var(--line);
}
.unidade-gallery::-webkit-scrollbar{ height:8px; }
.unidade-gallery::-webkit-scrollbar-track{ background:var(--line); }
.unidade-gallery::-webkit-scrollbar-thumb{ background:var(--ink-soft); border-radius:99px; }
.unidade-hint{ font-family:'IBM Plex Mono',monospace; font-size:0.7rem; color:var(--ink-soft); margin-top:2px; }

/* legacy grid kept for future multi-unit use */
.unidades-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:32px; margin-top:12px; }
.unidade-card{ border:1px solid var(--line); background:var(--paper); overflow:hidden; }
.unidade-card img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.unidade-card .unidade-info{ padding:18px 20px; }
.unidade-card .cidade{ font-family:'Newsreader',serif; font-size:1.1rem; font-weight:500; }
.unidade-card .estado{ font-family:'IBM Plex Mono',monospace; font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); margin-top:2px; }

footer{ background:var(--navy); color:rgba(237,233,222,0.5); padding:24px 0 36px; font-size:0.78rem; font-family:'IBM Plex Mono',monospace; }
footer .wrap{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; align-items:center; }
footer img{ width:22px; opacity:0.85; }
footer .fgroup{ display:flex; align-items:center; gap:10px; }
.credit-row{
  margin-top:18px; padding-top:18px; border-top:1px solid rgba(237,233,222,0.12);
  display:flex; align-items:center; justify-content:center; gap:10px;
}
.credit-text{ font-size:0.7rem; letter-spacing:0.04em; color:rgba(237,233,222,0.4); }
.credit-logo{ height:34px; width:auto; opacity:0.95; }
.credit-name{ font-family:'Newsreader',serif; font-size:0.95rem; font-weight:500; color:rgba(237,233,222,0.85); letter-spacing:0.01em; }

@media (max-width:900px){
  .nav-links{
    position:absolute; top:100%; left:0; right:0; background:var(--paper);
    flex-direction:column; align-items:flex-start; gap:0; border-bottom:1px solid var(--line);
    max-height:0; overflow:hidden; transition:max-height .25s ease;
  }
  .nav-links.open{ max-height:400px; }
  .nav-links li{ width:100%; }
  .nav-links a{ display:block; width:100%; padding:14px 28px; border-bottom:1px solid var(--line); }
  .nav-toggle{ display:flex; }
  .btn-cta span.full{ display:none; }
}

@media (max-width:760px){
  .tratamos-grid{ grid-template-columns:1fr; }
  .team-grid{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .cards{ grid-template-columns:1fr; }
  .cred-grid{ grid-template-columns:1fr; }
  .contato-grid{ grid-template-columns:1fr; }
  .unidades-grid{ grid-template-columns:1fr; }
  .logo img{ width:52px; }
}

:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }