:root{
  --bg:#f7f8fb;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#475569;

  /* borda mais suave */
  --line:rgba(15,23,42,.10);

  --brand:#2563eb;
  --brand2:#1e40af;

  /* tons suaves mais discretos */
  --soft:rgba(37,99,235,.08);
  --soft2:rgba(34,211,238,.08);

  --ok:#16a34a;

  /* sombras mais premium (leves) */
  --shadow: 0 10px 30px rgba(2,6,23,.06);
  --shadow-soft: 0 6px 18px rgba(2,6,23,.05);

  --radius:18px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html,body{width:100%;overflow-x:hidden;}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.55;
}

a{color:var(--brand);text-decoration:none;}
a:hover{text-decoration:underline;}

/* Acessibilidade: foco visível sem poluir */
:focus-visible{
  outline:3px solid rgba(37,99,235,.22);
  outline-offset:2px;
  border-radius:14px;
}

.container{
  width:100%;
  max-width:1140px;
  margin:0 auto;
  padding:0 22px;
}

.main{padding:22px 0 70px;}

.muted{color:var(--muted);}
strong{font-weight:900;}

/* ================= HEADER ================= */
.header{
  background:rgba(255,255,255,.88);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:100;
}

.header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:104px;
}

/* LOGO RESPONSIVO (visual maior) */
.brand img{
  height: clamp(72px, 7vw, 118px);
  width:auto;
  display:block;
}

/* NAV */
.nav{
  display:flex;
  align-items:center;
  gap:16px;
}

.nav__link{
  font-weight:700;
  color:var(--muted);
  padding:10px 14px;
  border-radius:14px;
}

.nav__link.active{
  background:var(--soft);
  color:var(--text);
}

.nav__cta{margin-left:6px;}

/* ================= NAV: ACESSAR LAUDO (NOVO) ================= */
.nav__link--laudo{
  padding:10px 14px;
  border-radius:14px;

  /* laranja suave, elegante e discreto */
  border:1px solid rgba(245,158,11,.26);
  background: rgba(245,158,11,.08);

  color:#7c2d12;
  font-weight:900;

  text-decoration:none !important;
}

.nav__link--laudo:hover{
  background: rgba(245,158,11,.13);
  border-color: rgba(245,158,11,.32);
  text-decoration:none !important;
}

.nav__link--laudo.active{
  background: rgba(245,158,11,.18);
  border-color: rgba(245,158,11,.36);
  color:#7c2d12;
}

/* MENU MOBILE */
.menuBtn{
  display:none;
  width:48px;
  height:42px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  padding:10px;
  cursor:pointer;
}
.menuBtn span{
  display:block;
  height:2px;
  background:#0f172a;
  margin:5px 0;
  border-radius:2px;
}

/* ================= BUTTONS ================= */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  padding:12px 16px;
  font-weight:900;
  border:1px solid transparent;
  transition:.2s ease;
  text-decoration:none !important;
}

.btn-lg{ padding:14px 18px; border-radius:18px; }

.btn-primary{
  background:var(--brand);
  color:#fff;
  box-shadow: 0 12px 22px rgba(37,99,235,.16);
}
.btn-primary:hover{ background:var(--brand2); }

.btn-outline{
  background:#fff;
  border-color: rgba(15,23,42,.12);
  color:var(--text);
}
.btn-outline:hover{ background: rgba(15,23,42,.03); }

.btn-block{ width:100%; }

/* ================= TYPO ================= */
.h1{
  font-size:2.55rem;
  letter-spacing:-0.03em;
  line-height:1.1;
  margin:12px 0 10px;
}
.h1--tutor{ max-width: 20ch; }

.h3{
  font-size:1.05rem;
  letter-spacing:-0.01em;
}

.subtitle{
  color:var(--muted);
  font-size:1.05rem;
  max-width: 62ch;
}

.section{
  margin-top: 26px;
}
.section--soft{
  margin-top: 26px;
}
.sectionHead{
  margin-bottom: 14px;
}
.section__title{
  font-size:1.6rem;
  letter-spacing:-0.02em;
  margin-bottom:10px;
}
.section__lead{
  color:var(--muted);
  max-width: 78ch;
}

/* ================= CARDS / UI ================= */
.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-soft);
}

/* hover mais discreto */
.card.card--hover:hover,
.procCard:hover{
  outline: 3px solid rgba(37,99,235,.10);
}

.cardPad{ padding:18px; }
.cardPad--lg{ padding:22px; }

.miniTitle{ font-weight:1000; margin-bottom:10px; }
.note{ color:var(--muted); font-size:.95rem; }

.softDivider{
  height:1px;
  background:var(--line);
  margin:16px 0;
}

.softNote{
  display:grid;
  gap:6px;
  color:var(--muted);
  font-size:.95rem;
}

/* ================= HOME HERO ================= */
.hero{
  position: relative;
  border-radius: var(--radius);
}
.hero__bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 420px at 15% 20%, rgba(37,99,235,.10), transparent 60%),
    radial-gradient(700px 380px at 85% 10%, rgba(34,211,238,.08), transparent 60%),
    linear-gradient(135deg,#f1f5ff,#fbfcfe);
  border:1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.hero--tutor{ padding: 0; }
.hero--tutor .container{ position:relative; padding-top: 26px; padding-bottom: 26px; }

.heroGrid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 22px;
  align-items: start;
}
.heroGrid--tutor{ padding: 12px; }

.badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:7px 12px;
  border-radius:999px;
  font-weight:1000;
  font-size:.82rem;
}
.badge--soft{
  background: rgba(22,163,74,.08);
  color:#14532d;
  border:1px solid rgba(22,163,74,.20);
}
.badgeDot{
  width:10px;height:10px;border-radius:999px;background:var(--ok);
  box-shadow:0 0 0 6px rgba(22,163,74,.10);
}

.actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top: 16px;
}
.actions--tutor{ margin-top: 18px; }

.trustRow{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 16px;
}
.trustPill{
  display:flex;
  gap:10px;
  align-items:flex-start;
  background: rgba(255,255,255,.70);
  border:1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  padding: 12px;
}
.trustPill strong{ display:block; }
.trustPill small{ color:var(--muted); display:block; margin-top:2px; }
.trustIcon{ font-size: 18px; line-height: 1; margin-top: 2px; }

.cardActions{
  display:grid;
  gap:10px;
  margin-top: 12px;
}

.kv{ display:grid; gap:10px; margin-top: 12px; }
.kvItem{
  display:grid;
  gap:4px;
  padding:12px;
  border:1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.70);
}
.kvItem--soft{
  background: rgba(255,255,255,.70);
}

/* ================= GRID / SECTIONS ================= */
.grid{ display:grid; gap:12px; }
.grid--4{ grid-template-columns: repeat(4, 1fr); }

.cardIcon{
  width:42px;height:42px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(37,99,235,.08);
  font-size: 18px;
  margin-bottom: 10px;
}

.ctaBar{
  margin-top: 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  background: rgba(255,255,255,.90);
  border:1px solid rgba(15,23,42,.08);
  border-radius: var(--radius);
  padding: 14px 16px;
  box-shadow: var(--shadow-soft);
}
.ctaBar strong{ display:block; }
.ctaBar span{ display:block; margin-top: 2px; }

.steps{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.step{
  display:flex;
  gap: 12px;
  align-items:flex-start;
  background: rgba(255,255,255,.90);
  border:1px solid rgba(15,23,42,.08);
  border-radius: var(--radius);
  padding: 16px;
  box-shadow: var(--shadow-soft);
}
.stepNum{
  width:36px;height:36px;
  border-radius: 14px;
  background: rgba(37,99,235,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:1000;
}

.procGrid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.procGrid--home{ grid-template-columns: repeat(4, 1fr); }
.procCard{ padding: 18px; }
.procCard h3{ font-size: 1.05rem; margin-bottom: 6px; }
.procCard p{ color:var(--muted); font-size:.95rem; }
.linkHint{ display:inline-block; margin-top: 10px; font-weight: 900; }

.aboutGrid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 12px;
  align-items: start;
}

.faq{ display:grid; gap:10px; margin-top: 10px; }
details{
  border:1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.80);
  padding: 10px 12px;
}
summary{
  cursor:pointer;
  font-weight: 900;
  list-style:none;
}
summary::-webkit-details-marker{ display:none; }
details p{ margin-top: 8px; }

.centerRow{
  margin-top: 14px;
  display:flex;
  justify-content:center;
}

/* ================= BLOCO: CONTEÚDO INFORMATIVO ================= */
.infoGrid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  align-items: stretch;
}

.infoCard{
  text-decoration:none;
  display:block;
  height:100%;
  transition: transform .12s ease, box-shadow .12s ease;
}

.infoCard:hover{
  transform: translateY(-2px);
  text-decoration:none;
}

.infoTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.infoIcon{
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.85);
  border: 1px solid var(--line);
  font-size: 1.2rem;
}

/* limita o texto a 2 linhas para manter cards uniformes */
.infoCard .muted{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.infoCTA{ background: rgba(255,255,255,.92); }

@media (max-width: 1200px){
  .infoGrid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 980px){
  .infoGrid{ grid-template-columns: 1fr; }
}

/* ================= PROFISSIONAL ================= */
.proHero{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 12px;
  align-items: start;
}

.proBadges{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 14px;
}

.proBadge{
  display:flex;
  gap:10px;
  align-items:flex-start;
  background: rgba(255,255,255,.90);
  border:1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  padding: 12px;
  box-shadow: var(--shadow-soft);
}

.proCard{ background: rgba(255,255,255,.92); }

.timeline{
  display:grid;
  gap: 10px;
}

.tItem{
  display:grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: start;
}

.tDot{
  width:10px;height:10px;border-radius:999px;
  background: var(--brand);
  margin-top: 10px;
  box-shadow: 0 0 0 6px rgba(37,99,235,.10);
}

.tCard{
  background: rgba(255,255,255,.90);
  border:1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  padding: 12px;
  box-shadow: var(--shadow-soft);
}
.tCard strong{ display:block; }
.tCard span{ display:block; margin-top: 2px; }

/* ================= FOOTER ================= */
.footer{
  background:#fff;
  border-top: 1px solid var(--line);
  padding: 26px 0;
  margin-top: 34px;
}
.footer__inner{
  display:flex;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}
.footer__right{ text-align:right; }

/* WhatsApp float */
.waFloat{
  position: fixed;
  right: 18px;
  bottom: 18px;
  background:#25d366;
  color:#fff !important;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 1000;
  box-shadow: 0 12px 22px rgba(0,0,0,.14);
  z-index: 200;
}

/* ================= RESPONSIVE ================= */
@media (max-width: 980px){
  .menuBtn{ display:block; }

  .nav{
    position:absolute;
    left:0; right:0;
    top:104px;
    background:#fff;
    border-bottom:1px solid var(--line);
    padding: 14px 18px 18px;
    display:none;
    flex-direction:column;
    gap: 10px;
  }
  .nav.open{ display:flex; }
  .nav__cta{ width:100%; }

  .heroGrid{ grid-template-columns: 1fr; }
  .trustRow{ grid-template-columns: 1fr; }

  .grid--4{ grid-template-columns: 1fr; }
  .steps{ grid-template-columns: 1fr; }
  .procGrid{ grid-template-columns: 1fr; }
  .procGrid--home{ grid-template-columns: 1fr; }
  .aboutGrid{ grid-template-columns: 1fr; }

  .proHero{ grid-template-columns: 1fr; }
  .proBadges{ grid-template-columns: 1fr; }

  .footer__right{ text-align:left; }

  .brand img{ height: clamp(66px, 10vw, 92px); }
  .h1{ font-size: 2.05rem; }
}

@media (max-width: 520px){
  .h1{ font-size: 1.85rem; }
  .btn-lg{ width:100%; }
  .ctaBar{ flex-direction:column; align-items:flex-start; }
}

/* ================= FOOTER MEGA (premium) ================= */
.footer__inner--mega{ display:block; }

.footerGrid{
  display:grid;
  grid-template-columns: repeat(4, minmax(170px, 1fr));
  gap: 22px;
  padding: 18px 0;
}

/* usamos <details> para colapsar no mobile (no desktop fica “aberto” e visualmente igual coluna) */
.footerGroup{
  border:0;
  background: transparent;
  padding: 0;
}
.footerGroup > summary{
  cursor: default;
  list-style:none;
  font-weight: 900;
  margin-bottom: 10px;
}
.footerGroup > summary::-webkit-details-marker{ display:none; }

.footerLink{
  display:block;
  font-size: .92rem;
  opacity: .88;
  margin: 8px 0;
}
.footerLink:hover{
  opacity: 1;
  text-decoration: underline;
}

.footerBottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  padding: 14px 0 6px;
  border-top: 1px solid var(--line);
}

.footerEmail{ font-size: .95rem; }

/* WhatsApp premium */
.waFloat--premium{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 12px 16px;
}
.waFloat__dot{
  width:10px;height:10px;border-radius:999px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 0 0 6px rgba(255,255,255,.18);
}
.waFloat__text{ font-weight: 1000; }

/* 2 colunas */
@media (max-width: 980px){
  .footerGrid{
    grid-template-columns: repeat(2, minmax(170px, 1fr));
    gap: 16px;
  }
}

/* 1 coluna + acordeão de verdade */
@media (max-width: 560px){
  .footerGrid{ grid-template-columns: 1fr; }
  .footerBottom{ flex-direction: column; align-items: flex-start; }

  .footerGroup{
    border:1px solid rgba(15,23,42,.08);
    background: rgba(255,255,255,.65);
    border-radius: 16px;
    padding: 12px 12px;
  }
  .footerGroup > summary{
    cursor: pointer;
    margin-bottom: 8px;
  }
  .footerGroup[open]{
    box-shadow: var(--shadow-soft);
  }
}

/* ================= AJUSTES PREMIUM: PÁGINA PROFISSIONAL ================= */

/* 1) H1: menos “quebra” e mais elegante */
.h1--tutor{
  max-width: 26ch;              /* antes 20ch */
}
@media (max-width: 980px){
  .h1--tutor{ max-width: 22ch; }
}

/* 2) Pro Hero: mais respiro + proporção melhor */
.proHero{
  gap: 18px;                    /* antes 12px */
  margin-top: 6px;
}
.proHero__left{
  padding: 2px 0;
}

/* 3) Sidebar (card da direita) um pouco mais “seco” e alinhado */
.proCard{
  position: sticky;
  top: 118px;                   /* fica elegante com header sticky */
  box-shadow: var(--shadow);    /* dá um pouco mais presença */
}
@media (max-width: 980px){
  .proCard{
    position: static;
    top: auto;
  }
}

/* 4) Badges: menos “quadradão” e texto com melhor leitura */
.proBadges{
  gap: 12px;                    /* antes 10px */
}
.proBadge{
  border-radius: 18px;
  padding: 14px;                /* antes 12px */
}
.proBadge small{
  line-height: 1.35;
}

/* 5) Timeline: cards mais “flat premium” e separação melhor */
.timeline{ gap: 12px; }
.tCard{
  padding: 14px;                /* antes 12px */
}
.tDot{
  margin-top: 12px;
}

/* 6) About grid (FAQ + CTA): mais ar e alinhamento */
.aboutGrid{
  gap: 16px;                    /* antes 12px */
}
.faq details{
  padding: 12px 14px;           /* antes 10px 12px */
}

/* ================= COMPONENTES REUSÁVEIS (SITE) ================= */

/* Botão ativo (usado no filtro de Procedimentos) */
button.isActive,
.btn.isActive{
  background: var(--soft);
  border-color: var(--soft);
}

/* Pills / tags (Procedimentos) */
.tagPill{
  display:inline-flex;
  align-items:center;
  border:1px solid var(--line);
  background:#fff;
  padding:6px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:.72rem;
  color: var(--muted);
}

/* ================= PÁGINA: CONTATO ================= */

/* Grid principal */
.contactGrid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  align-items: start;
}

/* Steps: mantemos 1 coluna por card */
.steps--oneLine{
  grid-template-columns: 1fr;
  gap: 10px;
}

/* Localização */
.locGrid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  align-items: stretch;
}

.locActions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.locMapCard{
  padding:0 !important;
  overflow:hidden;
}
.locMapCard iframe{
  display:block;
}

/* Responsivo contato */
@media (max-width: 980px){
  .contactGrid{ grid-template-columns: 1fr; }
  .locGrid{ grid-template-columns: 1fr; }
}

/* ================= MENU MOBILE (melhor acabamento) ================= */
@media (max-width: 980px){
  .nav{
    box-shadow: 0 18px 40px rgba(2,6,23,.10);
  }
}

/* ================= AJUSTES PREMIUM: PÁGINA PROFISSIONAL ================= */

/* H1: menos quebra */
.h1--tutor{ max-width: 26ch; }
@media (max-width: 980px){
  .h1--tutor{ max-width: 22ch; }
}

/* Pro Hero: mais respiro */
.proHero{
  gap: 18px;
  margin-top: 6px;
}
.proHero__left{ padding: 2px 0; }

/* Card da direita “gruda” com bom espaçamento (desktop) */
.proCard{
  position: sticky;
  top: 118px;
  box-shadow: var(--shadow);
}
@media (max-width: 980px){
  .proCard{ position: static; top:auto; }
}

/* Badges: mais premium */
.proBadges{ gap: 12px; }
.proBadge{
  border-radius: 18px;
  padding: 14px;
}
.proBadge small{ line-height: 1.35; }

/* Timeline */
.timeline{ gap: 12px; }
.tCard{ padding: 14px; }
.tDot{ margin-top: 12px; }

/* About grid */
.aboutGrid{ gap: 16px; }
.faq details{ padding: 12px 14px; }