*{box-sizing:border-box}
:root{--bg:#f7f7f4;--panel:#fff;--text:#1f2937;--muted:#6b7280;--border:#e5e7eb;--accent:#a86816;--accent2:#85510d;--soft:#fff4dd;--danger:#b42318;--success:#067647;--shadow:0 8px 24px rgba(0,0,0,.055)}
body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}
a{color:inherit}.container{width:min(1180px,calc(100% - 28px));margin:auto}
.site-header{background:#111827;color:#fff;position:sticky;top:0;z-index:20;box-shadow:0 2px 10px #0002}
.header-inner{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{font-weight:800;text-decoration:none}.nav{display:flex;gap:14px;align-items:center}.nav a{text-decoration:none;color:#e5e7eb}.page{padding:28px 0 44px}.footer{color:var(--muted);padding:28px 0;border-top:1px solid var(--border)}
.hero{background:linear-gradient(135deg,#111827,#374151);color:#fff;border-radius:22px;padding:24px;margin-bottom:20px}.hero h1{margin:0 0 8px;font-size:clamp(1.65rem,4vw,2.4rem)}.hero p{margin:0;color:#e5e7eb}
.grid{display:grid;gap:14px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:18px;box-shadow:var(--shadow)}
.card h2,.card h3{margin-top:0}.muted{color:var(--muted)}.small{font-size:.88rem}.strong{font-weight:750}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--border);border-radius:11px;padding:10px 14px;background:#fff;color:var(--text);text-decoration:none;cursor:pointer;font:inherit}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);border-color:var(--accent);color:white}.btn.danger{background:#fff;color:var(--danger);border-color:#f1b7b2}.actions{display:flex;gap:8px;flex-wrap:wrap}
.badge{display:inline-flex;border-radius:999px;padding:5px 9px;background:var(--soft);color:var(--accent2);font-size:.78rem;font-weight:700}.chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}label{font-weight:650;font-size:.92rem}input,select,textarea{width:100%;border:1px solid #d0d5dd;border-radius:11px;padding:11px 12px;background:#fff;font:inherit;color:inherit}textarea{min-height:110px;resize:vertical}input:focus,select:focus,textarea:focus{outline:2px solid #a8681638;border-color:var(--accent)}
.rating-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.metric{border:1px solid var(--border);border-radius:12px;padding:10px}.metric label{font-size:.8rem}.metric select{margin-top:5px}
.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:15px;background:#fff}table{width:100%;border-collapse:collapse;min-width:760px}th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--border);vertical-align:top}th{background:#fafafa;font-size:.82rem;text-transform:uppercase;letter-spacing:.03em}.table-actions{white-space:nowrap}
.toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px;flex-wrap:wrap}.toolbar form{display:flex;gap:8px;flex:1;max-width:560px}.toolbar input{min-width:180px}
.alert{padding:12px 14px;border-radius:12px;margin-bottom:14px}.alert.success{background:#ecfdf3;color:#05603a}.alert.error{background:#fef3f2;color:#912018}
.login-card{max-width:460px;margin:50px auto}.admin-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.beer-card{cursor:pointer;transition:.15s}.beer-card:hover{transform:translateY(-1px);border-color:var(--accent)}.beer-card details{margin-top:12px}.meter{height:9px;background:#f3eadc;border-radius:999px;overflow:hidden}.meter span{display:block;height:100%;background:var(--accent)}
.filters{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:10px;margin-bottom:16px}
.section-title{margin:26px 0 12px}.empty{text-align:center;color:var(--muted);padding:40px}
@media(max-width:900px){.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.filters{grid-template-columns:repeat(2,1fr)}.rating-row{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.grid-2,.grid-3,.form-grid,.filters{grid-template-columns:1fr}.field.full{grid-column:auto}.rating-row{grid-template-columns:repeat(2,1fr)}.header-inner{align-items:flex-start;padding:14px 0;flex-direction:column}.nav{width:100%;justify-content:space-between}.page{padding-top:18px}.hero{padding:19px}.toolbar{align-items:stretch}.toolbar form{max-width:none;width:100%}.toolbar form .btn{flex:0 0 auto}}


/* =========================
   PUBLIC EXPLORER - V2
   Hierarchical card navigation
   ========================= */
.explorer-intro{
  padding:8px 0 6px;
  max-width:820px;
}
.explorer-intro h1{
  margin:4px 0 8px;
  font-size:clamp(1.7rem,4vw,2.55rem);
  line-height:1.08;
}
.explorer-intro p,.level-copy{
  margin:0;
  color:var(--muted);
  line-height:1.6;
}
.eyebrow{
  color:var(--accent2);
  font-size:.76rem;
  font-weight:850;
  letter-spacing:.09em;
}
.explorer-breadcrumb{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin:18px 0 14px;
  font-size:.92rem;
}
.explorer-breadcrumb a,.explorer-breadcrumb .current{
  text-decoration:none;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:999px;
  padding:7px 11px;
}
.explorer-breadcrumb a:hover{border-color:var(--accent)}
.explorer-breadcrumb .current{
  background:var(--soft);
  color:var(--accent2);
  border-color:#f0d5a8;
  font-weight:750;
}
.explorer-breadcrumb>span:not(.current){color:var(--muted)}

.explorer-filterbar{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:13px 0 20px;
  border-bottom:1px solid var(--border);
  margin-bottom:22px;
}
.filter-label{
  padding-top:7px;
  font-weight:750;
  font-size:.88rem;
  white-space:nowrap;
}
.country-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.country-pill{
  text-decoration:none;
  border:1px solid var(--border);
  background:var(--panel);
  border-radius:999px;
  padding:7px 11px;
  font-size:.86rem;
  box-shadow:0 2px 7px rgba(0,0,0,.025);
}
.country-pill:hover{border-color:var(--accent)}
.country-pill.active{
  background:#111827;
  border-color:#111827;
  color:#fff;
}

.level-heading{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:16px;
  margin:0 0 14px;
}
.level-heading h2{
  margin:3px 0 0;
  font-size:clamp(1.3rem,3vw,1.8rem);
}
.selection-note{
  display:inline-flex;
  background:var(--soft);
  color:var(--accent2);
  border:1px solid #f0d5a8;
  border-radius:999px;
  padding:7px 11px;
  font-weight:750;
  font-size:.84rem;
}

.explorer-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.explorer-grid-families{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.explorer-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:100%;
  padding:20px;
  background:#ffffff;
  color:var(--text);
  text-decoration:none;

  /* Borda sempre visível */
  border:2px solid #c9ced6;
  border-radius:19px;

  box-shadow:0 4px 12px rgba(17,24,39,.05);

  transition:
    border-color .18s ease,
    background-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

a.explorer-card:hover{
  border-color:var(--accent);
  background:var(--soft);
  transform:translateY(-2px);
  box-shadow:
    0 10px 24px rgba(17,24,39,.10),
    0 0 0 1px var(--accent);
}

a.explorer-card:focus-visible{
  outline:none;
  border-color:var(--accent);
  background:var(--soft);
  box-shadow:
    0 0 0 3px rgba(168,104,22,.20),
    0 10px 24px rgba(17,24,39,.10);
}

.explorer-card.selected,
.explorer-card.active{
  border-color:var(--accent);
  background:var(--soft);
  box-shadow:
    0 0 0 1px var(--accent),
    0 8px 22px rgba(17,24,39,.08);
}
.family-card{
  min-height:370px;
  padding:24px;
}
.explorer-card-top{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
}
.explorer-card h3{
  margin:5px 0 0;
  font-size:1.24rem;
  line-height:1.2;
}
.family-card h3{font-size:1.65rem}
.card-kicker{
  color:var(--accent2);
  font-size:.74rem;
  letter-spacing:.055em;
  font-weight:850;
}
.outline-badge,.count-badge{
  flex:0 0 auto;
  border:1px solid #ead5b0;
  border-radius:999px;
  padding:6px 9px;
  color:var(--accent2);
  background:#fffaf0;
  font-size:.76rem;
  font-weight:750;
}
.count-badge{
  color:var(--muted);
  border-color:var(--border);
  background:#fafafa;
}
.card-description{
  margin:14px 0 16px;
  color:#475467;
  line-height:1.55;
}
.card-stats{
  display:flex;
  gap:20px;
  margin-bottom:16px;
  padding:12px 0;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  color:var(--muted);
  font-size:.9rem;
}
.card-stats strong{color:var(--text)}

.profile-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:9px;
  margin-top:auto;
}
.profile-metric{min-width:0}
.profile-metric-head{
  display:flex;
  justify-content:space-between;
  gap:5px;
  font-size:.69rem;
  color:var(--muted);
  margin-bottom:5px;
}
.profile-metric-head strong{color:var(--text)}
.profile-meter{
  height:7px;
  border-radius:999px;
  overflow:hidden;
  background:#eee9df;
}
.profile-meter span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:var(--accent);
}
.card-cta,.card-footer-line{
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid var(--border);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  color:var(--accent2);
  font-weight:800;
}
.card-footer-line{
  color:var(--muted);
  font-size:.86rem;
  font-weight:650;
}
.card-footer-line .arrow,.card-cta span{
  color:var(--accent);
  font-size:1.15rem;
}
.beer-example-grid .explorer-card{min-height:310px}
.beer-meta{
  margin-top:7px;
  color:var(--muted);
  font-size:.88rem;
}
.beer-detail-card .profile-grid{margin-top:auto}
.explorer-empty{
  padding:44px 20px;
  text-align:center;
  border:1.5px dashed #cfd4dc;
  border-radius:19px;
  background:rgba(255,255,255,.55);
}
.empty-icon{font-size:2rem}
.explorer-empty h3{margin:8px 0}
.explorer-empty p{color:var(--muted);margin:0 0 16px}

@media(max-width:950px){
  .explorer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .profile-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:680px){
  .explorer-grid,.explorer-grid-families{grid-template-columns:1fr}
  .family-card{min-height:auto}
  .explorer-filterbar{flex-direction:column;gap:8px}
  .filter-label{padding-top:0}
  .level-heading{align-items:flex-start;flex-direction:column}
  .profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .explorer-card{padding:17px}
  .family-card{padding:19px}
  .explorer-card-top{gap:9px}
  .outline-badge,.count-badge{font-size:.7rem}
}


.explorer-breadcrumb a:focus-visible,
.country-pill:focus-visible{
  outline:3px solid rgba(168,104,22,.20);
  outline-offset:2px;
  border-color:var(--accent);
}