/* ================================
   style.css — layout estável e fácil de manter
   ================================ */
:root{
  /* Paleta */
  --bg:#f6f7fb; --paper:#fff; --ink:#1e293b; --muted:#5b667a;
  --primary:#5A6BF2; --chip-bg:#eef1ff; --chip-bd:#dfe4ff; --line:#e8ebf3;

  /* UI */
  --radius:14px; --shadow:0 10px 30px rgba(0,0,0,.06);
  --container:1040px; --sidebar:320px; --gap:32px; --space:18px;

  /* Tipografia */
  --font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", Arial;

  /* Avatar */
  --avatar:140px; --avatar-sm:120px; --avatar-shift-x:-30px;
}

/* ===== Reset mínimo / base ===== */
*{ box-sizing:border-box }
html,body{ height:100% }
body{
  margin:0; font-family:var(--font); color:var(--ink);
  background:linear-gradient(180deg,#f2f5ff 0%, var(--bg) 100%);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img{ max-width:100%; display:block }

/* ===== Página ===== */
.page{
  max-width:var(--container);
  margin:40px auto 120px;
  background:var(--paper);
  border:1px solid #f2f3f8;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
}

/* ===== Ações ===== */
.actions{
  position:sticky; top:12px; z-index:10;
  display:flex; justify-content:flex-end;
  padding:12px clamp(16px,5vw,56px);
}
.btn{
  display:inline-flex; align-items:center; gap:10px; cursor:pointer;
  padding:10px 14px; border-radius:12px; font-weight:600;
  border:1px solid var(--chip-bd); background:#fff; color:#0f172a;
  box-shadow:0 6px 20px rgba(0,0,0,.06);
}
.btn:hover{ transform:translateY(-1px) }
.btn svg{ width:18px; height:18px }

/* ===== HERO ===== */
.hero{
  padding:48px clamp(16px,5vw,56px) 40px;
  background:
    radial-gradient(1200px 300px at 20% -30%, rgba(90,107,242,.20), transparent 60%),
    radial-gradient(1200px 300px at 120% -30%, rgba(90,107,242,.18), transparent 60%),
    linear-gradient(180deg,#fff 0%, #f9faff 100%);
  border-bottom:1px solid var(--line);
}
.hero__grid{
  display:grid; gap:24px; align-items:start;
  grid-template-columns:var(--avatar) 1fr;
  grid-template-areas:"avatar id";
}
.hero__grid > *{ min-width:0 }

.avatar{
  grid-area:avatar;
  width:var(--avatar); height:var(--avatar);
  border-radius:50%; overflow:hidden; background:#e8ecff;
  border:3px solid #fff; box-shadow:0 8px 20px rgba(0,0,0,.08);
  transform:translateX(var(--avatar-shift-x));
}
.avatar img{ width:100%; height:100%; object-fit:cover }
.avatar img[src=""], .avatar img:not([src]){ display:none }

.id{ grid-area:id; min-width:0; word-break:break-word }
.id__name{ margin:0 0 6px; font-size:clamp(26px,4vw,34px); line-height:1.15 }
.id__title{ margin:0 0 10px; color:var(--muted); font-weight:600 }
.id__summary{ margin:0 }
.id .contacts{ margin-top:12px }

/* ===== Chips / Contatos ===== */
.contacts{ min-width:0 }
.chip-list, .tag-list{
  display:flex; flex-wrap:wrap; gap:12px;
  margin:0 0 10px; padding:0; list-style:none;
}
.chip{
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  padding:8px 12px; border-radius:999px; font-size:13px; color:#334155;
  background:var(--chip-bg); border:1px solid var(--chip-bd);
}

/* ===== Conteúdo principal ===== */
.content.grid{
  display:grid;
  grid-template-columns:minmax(260px,var(--sidebar)) 1fr;
  gap:var(--gap);
  padding:28px clamp(16px,5vw,56px) 56px;
}
.sidebar{ border-right:1px solid var(--line); padding-right:16px }
.card{
  margin-bottom:var(--space);
  padding:var(--space);
  border:1px solid var(--line); border-radius:12px; background:#fff;
}
.section-title{
  margin:0 0 12px; font-size:15px; text-transform:uppercase; letter-spacing:.08em; color:#334155;
}
.tag-list{ gap:8px; margin:0 } /* herda demais da definição conjunta */
.tag{ padding:6px 10px; border:1px dashed #cfd7ff; border-radius:999px; background:#f6f8ff; font-size:12px }
.tag-contact{ font-size:14px }

.list{ margin:8px 0 0; padding-left:18px }
.item{
  padding:14px 16px; background:#fff; border:1px solid var(--line); border-radius:12px;
}
.item + .item{ margin-top:12px }
.item__title{ margin:0; font-weight:700 }
.item__org{ margin:2px 0 0; color:#334155 }
.item__meta{ margin:4px 0 0; color:var(--muted); font-size:13px }

/* ===== Skills ===== */
.skill{ margin-bottom:12px }
.skill__label{ display:flex; justify-content:space-between; font-size:13px; color:#48566c; margin-bottom:6px }
.skill__bar{
  height:8px; border-radius:999px; overflow:hidden; background:#eef2ff; position:relative;
}
.skill__bar::after{
  content:""; position:absolute; inset:0; width:var(--level,60%); background:var(--primary);
}

/* ===== Main (blocos, timeline) ===== */
.block{ margin-bottom:26px; padding-bottom:6px; border-bottom:1px dashed #eef1f8 }
.with-dot{ display:flex; align-items:center; gap:10px }
.with-dot::before{
  content:""; width:9px; height:9px; border-radius:50%;
  background:var(--primary); box-shadow:0 0 0 5px rgba(90,107,242,.12);
}

.timeline{ position:relative; margin-left:8px; padding-left:18px }
.timeline::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:2px;
  background:linear-gradient(180deg, var(--primary), #c7cffd); border-radius:2px;
}
.tl-item{ position:relative; list-style:none }
.tl-item + .tl-item{ margin-top:18px }
.tl-item::before{
  content:""; position:absolute; left:-6px; top:16px; width:12px; height:12px;
  background:#fff; border:2px solid var(--primary); border-radius:50%;
}

/* ===== Responsivo ===== */
@media (max-width:1080px){
  .hero__grid{
    grid-template-columns:var(--avatar-sm) 1fr;
    grid-template-areas:"avatar id";
  }
  .avatar{
    width:var(--avatar-sm); height:var(--avatar-sm);
    transform:translateX(calc(var(--avatar-shift-x) * .6));
  }
  .contacts{ margin-top:6px }
  .content.grid{
    grid-template-columns:1fr;
    padding:18px clamp(14px,5vw,20px) 28px;
  }
  .sidebar{ border-right:0; padding-right:0 }
}

/* ================================
   Impressão / PDF — 1 página (Chrome)
   ================================ */
@page{ size:A4 portrait; margin:9mm }

@media print{
  :root{
    --print-w:210mm; --print-h:297mm; --print-margin:1mm;
    --print-usable-h:calc(var(--print-h) - 2 * var(--print-margin));
  }

  html,body{ -webkit-print-color-adjust:exact; print-color-adjust:exact }
  body{ background:#fff }

  /* esconder controles */
  .actions, .btn, .print-hide{ display:none !important }

  /* Base da página — fecha em 1 página */
  .page{
    width:var(--print-w) !important; height:var(--print-usable-h) !important;
    margin:0 !important; padding-bottom:1mm !important;
    border:1px solid #eaeaea !important; border-radius:14px !important;
    box-shadow:none !important; overflow:hidden !important;
    display:flex !important; flex-direction:column !important;
  }

  /* Hero compacto */
  .hero{
    padding:12mm 0 5mm !important;
    border-bottom:1px solid #ddd !important; flex:0 0 auto !important;
  }
  .hero__grid{ gap:7mm !important }
  .hero .avatar{ width:30mm; height:30mm; margin-left:20px; transform:none !important }
  .hero .avatar img{ width:30mm; height:30mm; object-fit:cover }

  /* Grid ocupa o restante */
  .content.grid{
    gap:5mm !important; padding:4mm 6mm 6mm !important;
    grid-template-columns:28% 1fr !important;
    flex:1 1 auto !important; min-height:0 !important; overflow:hidden !important;
  }

  /* Tipografia topo */
  .id__name{ font-size:15pt; line-height:1.15 }
  .id__title{ font-size:10pt }
  .id__summary{ font-size:9pt; line-height:1.3 }

  /* Cartões e listas compactos */
  .section-title{ margin:0 0 2.5mm; font-size:10.5pt; letter-spacing:.05em }
  .card, .block, .item{ margin-bottom:3.5mm; box-shadow:none; border-color:#eaeaea }
  .item{ padding:7px 9px }
  .item__title{ font-size:10.5pt }
  .item__meta{ font-size:9pt }

  /* Sidebar — certificações em 2 colunas */
  .sidebar .card .list{
    columns:2; column-gap:4mm; list-style:none;
    padding-left:0; margin:1mm 0;
  }
  .sidebar .card .list li{
    break-inside:avoid; page-break-inside:avoid;
    margin:0 0 1.5mm; padding-left:0; font-size:7.5pt;
  }

  /* Timeline ajustes */
  .timeline{ margin-left:18px; padding-left:24px }
  .tl-item::before{
    left:-11px; top:18px; width:12px; height:12px; border-width:1px; box-shadow:none;
  }

  /* Tags & textos no main */
  .sidebar .tag-list{ gap:4px; margin:1mm 0 }
  .sidebar .tag{ font-size:9pt; padding:3px 7px }
  .main p{ font-size:9.5pt; line-height:1.35; margin:0 0 2mm }
  .main .list{ margin:1mm 0; padding-left:16px }
  .main .list li{ margin:.5mm 0; font-size:9.5pt }
  .main .tag-list{ gap:4px; margin:1mm 0 }
  .main .tag{ font-size:9pt; padding:3px 7px }

  /* Evitar quebras feias */
  .card, .block, .item, .timeline, .tl-item,
  .list li, .tag-list li, article.item{
    break-inside:avoid; page-break-inside:avoid;
  }

  a{ color:inherit; text-decoration:none }
  .tag-contact{ font-size:11px }
}
