/* ══════════════════════════════════════
   MUSEU JUDAICO RJ — Shared Components
   Componentes usados em 2+ páginas
══════════════════════════════════════ */

/* ── CTA BAND (9 páginas) ── */
.cta-band { background:var(--navy); padding:clamp(3rem,5vw,5rem) 0; position:relative; overflow:hidden; }
.cta-band::after { content:''; position:absolute; inset:0; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"); pointer-events:none; opacity:.45; mix-blend-mode:overlay; }
.cta-inner { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.cta-text-block h2 { font-family:var(--serif); font-size:clamp(1.5rem,3vw,2.25rem); font-weight:400; color:white; margin-bottom:.5rem; }
.cta-text-block h2 em { font-style:italic; color:var(--gold-light); }
.cta-text-block p { font-size:.9rem; color:rgba(255,255,255,.55); max-width:480px; line-height:1.65; }
.cta-buttons { display:flex; gap:.875rem; flex-wrap:wrap; flex-shrink:0; }

/* ── ACERVO LAYOUT (4 páginas acervo) ── */
.acervo-layout { display:grid; grid-template-columns:1fr 300px; gap:clamp(3rem,5vw,5rem); align-items:start; }

/* ── INTRO BODY (acervo + doações) ── */
.acervo-intro p, .intro-body p { font-size:.9375rem; color:var(--ink-2); line-height:1.8; }
.acervo-intro p + p, .intro-body p + p { margin-top:1rem; }
.acervo-bullets { list-style:none; margin-top:1.25rem; display:flex; flex-direction:column; gap:.5rem; }
.acervo-bullets li { display:flex; align-items:flex-start; gap:.625rem; font-size:.9rem; color:var(--ink-3); line-height:1.6; }
.acervo-bullets li::before { content:''; display:block; width:5px; height:5px; border-radius:50%; background:var(--gold); flex-shrink:0; margin-top:.55em; }

/* ── SEARCH SECTION (4 páginas acervo) ── */
.search-section { background:var(--parchment); border:1px solid var(--border); border-radius:10px; padding:2.5rem; margin-top:3rem; }
.search-section-title { font-family:var(--serif); font-size:1.625rem; font-weight:500; color:var(--ink); margin-bottom:.5rem; }
.search-section-sub { font-size:.875rem; color:var(--ink-3); margin-bottom:1.75rem; line-height:1.65; }
.search-section .search-bar { box-shadow:0 2px 12px rgba(14,14,20,.08); }
.search-section .search-select { min-width:160px; height:52px; flex-shrink:0; }
.search-section .search-input { height:52px; }
.search-section .search-btn { height:52px; flex-shrink:0; }
.search-note { margin-top:1rem; font-size:.8rem; color:var(--ink-3); line-height:1.6; }
.search-note a { color:var(--navy); text-decoration:underline; text-decoration-color:rgba(27,37,79,.3); }
.search-note a:hover { text-decoration-color:var(--navy); }

/* ── RESULTADOS (4 páginas acervo) ── */
.results-area { margin-top:1.5rem; display:none; }
.results-area.show { display:block; }
.results-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; font-family:var(--mono); font-size:.65rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); }
.results-count { color:var(--navy); font-weight:500; }
.result-item { background:white; border:1px solid var(--border); border-radius:6px; padding:1.25rem 1.5rem; margin-bottom:.75rem; transition:box-shadow 150ms; }
.result-item:hover { box-shadow:0 4px 16px rgba(14,14,20,.08); }
.result-title { font-family:var(--serif); font-size:1.0625rem; font-weight:500; color:var(--ink); margin-bottom:.25rem; }
.result-author { font-size:.8125rem; color:var(--ink-3); margin-bottom:.375rem; }
.result-tags { display:flex; flex-wrap:wrap; gap:.375rem; margin-top:.625rem; }
.result-tag { display:inline-block; background:var(--navy-tint); color:var(--navy-mid); font-family:var(--mono); font-size:.6rem; letter-spacing:.06em; padding:2px 8px; border-radius:3px; }

/* ── ASIDE BOX (4+ páginas) ── */
.aside-box { border:1px solid var(--border); border-radius:8px; overflow:hidden; margin-bottom:1.25rem; }
.aside-box-header { padding:.875rem 1.25rem; background:var(--navy); font-family:var(--mono); font-size:.6rem; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-light); }
.aside-link { display:flex; align-items:center; gap:.625rem; padding:.75rem 1.25rem; font-size:.8125rem; color:var(--ink-2); text-decoration:none; border-bottom:1px solid var(--border); transition:background 130ms, color 130ms; }
.aside-link:hover { background:var(--navy-tint); color:var(--navy); }
.aside-link.active-link { background:var(--navy-tint); color:var(--navy); font-weight:600; }
.aside-link:last-child { border-bottom:none; }
.aside-link .icon { color:var(--gold); flex-shrink:0; }
.aside-fact { padding:.875rem 1.25rem; border-bottom:1px solid var(--border); }
.aside-fact:last-child { border-bottom:none; }
.aside-fact-label { font-family:var(--mono); font-size:.58rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); margin-bottom:3px; }
.aside-fact-val { font-size:.875rem; font-weight:600; color:var(--ink); line-height:1.4; }
.aside-fact-sub { font-size:.8rem; font-weight:400; color:var(--ink-3); }
.aside-tip { padding:1.25rem; border-bottom:1px solid var(--border); font-size:.8375rem; color:var(--ink-3); line-height:1.65; }
.aside-tip:last-child { border-bottom:none; }
.aside-tip strong { display:block; color:var(--ink-2); margin-bottom:.25rem; font-size:.875rem; }

/* ── PAGE LAYOUT 2-COL (doações, associe-se, fale-conosco) ── */
.page-layout { display:grid; grid-template-columns:1fr 320px; gap:clamp(3rem,5vw,5rem); align-items:start; }

/* ── FORM CARD (associe-se, fale-conosco) ── */
.form-card { background:white; border:1px solid var(--border); border-radius:12px; overflow:hidden; box-shadow:0 4px 24px rgba(14,14,20,.06); }
.form-card-top { height:4px; background:linear-gradient(to right,var(--gold),var(--gold-light) 50%,rgba(180,145,80,.2) 100%); }
.form-body { padding:2.5rem; }

.field { margin-bottom:1.5rem; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.field label { display:block; font-size:.8125rem; font-weight:600; color:var(--ink-2); margin-bottom:.5rem; letter-spacing:.01em; }
.field label .req { color:var(--gold-dark); margin-left:2px; font-weight:400; }
.field-hint { font-size:.75rem; color:var(--ink-3); margin-top:.375rem; }

.input, .textarea, .select {
  width:100%; font-family:var(--sans); font-size:.9375rem; color:var(--ink);
  background:var(--off-white); border:1.5px solid var(--border); border-radius:5px;
  padding:.75rem 1rem; outline:none; transition:border-color 180ms, box-shadow 180ms;
  -webkit-appearance:none; appearance:none;
}
.input:focus, .textarea:focus, .select:focus {
  border-color:var(--navy); background:white;
  box-shadow:0 0 0 3px rgba(27,37,79,.07);
}
.input.error, .textarea.error, .select.error { border-color:var(--error); }
.field-error { display:none; font-size:.75rem; color:var(--error); margin-top:.375rem; align-items:center; gap:.25rem; }
.field-error.show { display:flex; }

.textarea { resize:vertical; min-height:160px; line-height:1.6; }
.select { background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%235A5A70' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1rem center; padding-right:2.5rem; cursor:pointer; }

.field-footer { display:flex; justify-content:flex-end; margin-top:.375rem; }
.char-count { font-family:var(--mono); font-size:.65rem; color:var(--ink-3); }
.char-count.warn { color:var(--gold-dark); }

.form-submit { border-top:1px solid var(--border); padding:1.75rem 2.5rem; background:var(--parchment); display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.submit-note { font-size:.8rem; color:var(--ink-3); line-height:1.6; }
.submit-note a { color:var(--navy); text-decoration:underline; text-decoration-color:rgba(27,37,79,.3); }

.btn-submit { height:50px; padding:0 2.25rem; background:var(--navy); color:white; font-family:var(--sans); font-size:.9375rem; font-weight:600; border:none; border-radius:4px; cursor:pointer; display:flex; align-items:center; gap:.625rem; transition:background 150ms, transform 150ms, opacity 150ms; flex-shrink:0; }
.btn-submit:hover:not(:disabled) { background:var(--navy-deep); }
.btn-submit:disabled { opacity:.45; cursor:not-allowed; }
.btn-submit:active:not(:disabled) { transform:scale(.98); }
.btn-submit .spinner { width:16px; height:16px; border:2px solid rgba(255,255,255,.3); border-top-color:white; border-radius:50%; animation:spin .7s linear infinite; display:none; }
.btn-submit.loading .spinner { display:block; }
.btn-submit.loading .btn-label { opacity:0; }
@keyframes spin { to { transform:rotate(360deg); } }

.form-feedback { display:none; border-radius:8px; padding:1.25rem 1.5rem; margin-bottom:1.5rem; align-items:flex-start; gap:.875rem; }
.form-feedback.show { display:flex; }
.form-feedback.success { background:var(--success-bg); border:1px solid rgba(42,122,75,.2); }
.form-feedback.error-msg { background:var(--error-bg); border:1px solid rgba(176,58,46,.2); }
.feedback-icon { flex-shrink:0; color:var(--success); }
.form-feedback.error-msg .feedback-icon { color:var(--error); }
.feedback-text strong { display:block; font-size:.9375rem; font-weight:600; color:var(--ink); margin-bottom:.25rem; }
.feedback-text p { font-size:.875rem; color:var(--ink-3); line-height:1.6; }

/* ══════════════════════════════════════
   RESPONSIVE — Tablet (≤960px)
══════════════════════════════════════ */
@media (max-width:960px) {
  .cta-inner { flex-direction:column; text-align:center; align-items:center; }
  .cta-text-block p { max-width:none; }
  .cta-buttons { justify-content:center; }
  .acervo-layout { grid-template-columns:1fr; }
  .page-layout { grid-template-columns:1fr; }
  .field-row { grid-template-columns:1fr; }
  .search-section { padding:2rem 1.5rem; }
  .form-body { padding:2rem 1.5rem; }
  .form-submit { padding:1.5rem; flex-direction:column; align-items:stretch; text-align:center; }
  .btn-submit { width:100%; justify-content:center; }
}

/* ══════════════════════════════════════
   RESPONSIVE — Mobile (≤600px)
══════════════════════════════════════ */
@media (max-width:600px) {
  .cta-band { padding:clamp(2.5rem,5vw,3.5rem) 0; }
  .cta-text-block h2 { font-size:clamp(1.375rem,5vw,1.75rem); }
  .search-section { padding:1.5rem 1.25rem; margin-top:2rem; }
  .search-section-title { font-size:1.375rem; }
  .form-body { padding:1.5rem 1.25rem; }
  .form-submit { padding:1.25rem; }
}
