/* Visual layer only: content and application behavior remain with Clube PHP. */
.clube-content { --ink:#f5f5f5; --muted:#bababa; --paper:#222; --orange:#ffd100; --orange-dark:#ffd100; --orange-soft:#333020; --line:#454545; --shadow:0 10px 30px #0002; font:16px/1.7 'Open Sans',sans-serif; }
.clube-content main { width:min(1200px,calc(100% - 48px)); padding:32px 0 64px; }
.clube-content h1,.clube-content h2,.clube-content h3 { font-family:'Roboto Mono',monospace; font-weight:500; line-height:1.35; letter-spacing:-.025em; text-transform:none; }
.clube-content .site-header { position:static; background:#1b1b1b; flex-wrap:wrap; gap:16px; padding:16px max(24px,calc((100vw - 1200px)/2)); }
.clube-content .brand { width:auto; }
.clube-content .site-header nav { flex-wrap:wrap; }
.clube-content :is(.card,.form-card,.tier-card,.magazine-card,.trust-strip,.preview-grid article,.about,.faq details,.testimonial-card,.notice,.tier-benefits-details,.avatar-choice,.avatar-color-choice,.member-nav,.collection-card,.shelf-card) { background:#252525; color:var(--ink); border-color:var(--line); }
.clube-content :is(.tier-card.recommended,.print-highlight,.final-cta,.testimonials) { background:#1b1b1b; color:var(--ink); border-color:var(--line); }
.clube-content .button { background:#ffd100; color:#171717; border:1px solid #ffd100; border-radius:6px; font:500 14px/1.5 'Roboto Mono',monospace; box-shadow:none; text-transform:none; }
.clube-content .button:hover { background:#ffe055; color:#171717; }
.clube-content .button.secondary { background:transparent; color:#ffd100; border-color:#ffd100; }
.clube-content .button.danger { background:#922e2e; color:white; border-color:#bc4a4a; }
.clube-content :is(input,select,textarea) { background:#1b1b1b; color:var(--ink); border-color:var(--line); }
.clube-content :is(th,td) { border-color:var(--line); }
.clube-content :is(thead,th) { background:#303030; color:var(--ink); }
.clube-content .hero-layout { min-height:560px; padding:48px; background:#1b1b1b; border:1px solid #454545; border-radius:12px; box-shadow:none; }
.clube-content .hero-layout::before,.clube-content .hero-ambient { display:none; }
.clube-content .hero-layout::after { inset:24px 0 0 56%; background-position:center bottom; background-size:contain; animation:none; transform:none; filter:none; }
.clube-content .hero-layout > div { width:57%; max-width:620px; }
.clube-content .hero-layout h1 { max-width:17ch; font-size:clamp(32px,3.5vw,48px); text-shadow:none; }
.clube-content .hero-layout .hero-badges > .eyebrow,.clube-content .supporters-badge { padding:0; border:0; border-radius:0; background:none; box-shadow:none; backdrop-filter:none; color:#ffd100; }
.clube-content .hero-badges { gap:20px; }
.clube-content .hero-layout .button { box-shadow:none; }
.clube-content .campaign-image-band { width:100%; margin-inline:0; border-radius:12px; transform:none; }
.clube-content .campaign-image-band:hover { transform:none; }
.clube-content .campaign-band-glow { display:none; }
.clube-content .testimonial-heading .eyebrow { color:#ffd100; }
.clube-content iframe { max-width:100%; }
.clube-content footer { background:#1b1b1b; color:var(--muted); }
.clube-content :is(.faq,.report-chart,.mural-post,.podcast-card,.admin-tabs button,.admin-tabs a,.benefit-editor,.member-panel,.member-stat-grid article,.supporter-card,.supporter-empty,.supporters-cta,.collection-filters a,.empty-collection,.achievement,.achievement.is-earned,.goal-feature,.goal-milestones,.founder-callout) { background:#252525; color:var(--ink); border-color:var(--line); }
.clube-content :is(.supporters-total,.collection-total,.shelf-total,.membership-card-face) { background:#303030; color:var(--ink); border:1px solid #666; }
.clube-content :is(.supporters-total,.collection-total,.shelf-total) p { color:var(--muted); }
.clube-content :is(.admin-tabs button.is-active,.admin-tabs a.is-active,.member-nav-main a.is-active,.member-nav-main a:hover,.collection-filters a.is-active,.shelf-card.is-owned .shelf-check,.achievement.is-earned > i,.faq details[open] summary::after) { background:#ffd100; color:#171717; }
.clube-content :is(.shelf-tip,.tier-benefits .tier-benefit-physical,.tier-card.recommended .tier-benefit-physical) { background:#333020; color:#f5f5f5; }
.clube-content .tier-card.recommended .tier-benefit-physical small { color:#bababa; }
.clube-content :is(.tier-card.recommended .button,.tier-card.recommended .button:hover,.print-feature-grid article > i,.preview-grid article > i) { background:#ffd100; color:#171717; }
.clube-content .tier-card.recommended .button.secondary { background:transparent; color:#ffd100; border-color:#ffd100; }
.clube-content :is(.tier-badge,.tier-card.recommended .tier-badge) { background:none; color:#ffd100; border-radius:0; padding:0; }
.clube-content :is(.print-highlight .eyebrow,.print-plan-note i,.founder-callout .eyebrow,.card-identity p,.card-since) { color:#ffd100; }
.clube-content .membership-card-face::before,.clube-content .membership-card-face::after { display:none; }
.clube-content .form-card h1 { font-size:clamp(28px,4vw,36px); max-width:none; }
@media(max-width:760px) {
  .clube-content main { width:calc(100% - 32px); padding-top:20px; }
  .clube-content .hero-layout { min-height:780px; padding:28px 24px 340px; }
  .clube-content .hero-layout > div { width:100%; padding:0; }
  .clube-content .hero-layout::after { inset:auto 5% 0 15%; height:315px; background-position:center bottom; background-size:contain; }
  .clube-content .hero-layout h1 { font-size:32px; }
  .clube-content .site-header { padding:16px; }
  .clube-content .site-header .public-nav > a:not(.button):not(.login-link) { display:inline; }
}

/* Hierarquia dos planos e áreas autenticadas. */
.clube-content .subscription-selected { grid-template-columns: minmax(0, 620px); margin: 0 0 1.25rem; }
.clube-content .subscription-period { width: 100%; margin: 1.5rem 0 0; padding: 0; border: 0; display: flex; gap: 1rem; }
.clube-content .subscription-period legend { margin-bottom: .6rem; font-weight: 700; }
.clube-content .subscription-period { flex-wrap: wrap; }
.clube-content .support-error { color: #ffb5ae; margin: .6rem 0 0; font-size: .9rem; }
.clube-content .support-error:empty { display: none; }
.clube-content .subscription-period label { display: flex; align-items: center; gap: .5rem; padding: .6rem 1rem; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; }
.clube-content .subscription-period input { width: auto; margin: 0; accent-color: #ffd100; }
.clube-content .subscription-period label:has(:checked) { border-color: #ffd100; }
.clube-content .tier-card form[hidden] { display: none; }
.clube-content .support-extra { margin: .25rem 0 .75rem; width: 100%; }
.clube-content .support-extra summary { cursor: pointer; color: #ffd100; }
.clube-content .support-extra label { margin-top: 1rem; }
.clube-content .support-upgrade { order: -1; margin: 0; }
.clube-content .support-upgrade:empty { display: none; }
.clube-content .subscription-change { display: inline-block; margin-bottom: 1.5rem; }
.clube-content section:has(> .subscription-selected) > h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); max-width: none; }
.clube-content .subscription-selected .tier-card > strong { font-size: 1.4rem; }
.clube-content .subscription-selected .tier-card > .annual { font-size: 1.4rem; color: var(--ink); font-weight: 700; }
.clube-content .subscription-selected [hidden] { display: none !important; }
.clube-content .tier-nameplate,
.clube-content .tier-card.recommended .tier-nameplate,
.clube-content .tier-card > h2 {
  align-self: stretch;
  width: calc(100% + 2.7rem);
  margin: -1.35rem -1.35rem 1.15rem;
  padding: .7rem 1.2rem;
  border-radius: .78rem .78rem 0 0;
  background: #ffd100;
  color: #171717;
  order: -2;
}
.clube-content .tier-nameplate h3,
.clube-content .tier-card > h2 { font-size: 1.4rem; font-weight: 600; }
.clube-content .tier-card > h2 { line-height: 1.2; }
.clube-content .tier-card.recommended .tier-nameplate { background: #ffd100; color: #171717; }
.clube-content .tier-card > .tier-badge { order: -1; margin: -.45rem 0 .8rem; line-height: 1.4; }
.clube-content .tier-card form { display: grid; width: 100%; gap: .55rem; margin: 1rem 0 0; }
.clube-content .tier-card form + form { margin-top: .55rem; }
.clube-content .tier-card form label { display: grid; gap: .35rem; font-weight: 700; }
.clube-content .tier-card form .button { justify-self: start; }
.clube-content .tier-card > .button { margin-top: 1.1rem; }
.clube-content .tier-card .annual { margin: .35rem 0 0; }

/* O plano recomendado ganha presença própria, sem perder a leitura dos benefícios. */
.clube-content .tier-card.recommended {
  background: linear-gradient(155deg, #262112 0%, #1b1b1b 48%, #171717 100%);
  border-color: #d98a1b;
  box-shadow: 0 16px 34px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 209, 0, .16);
}
.clube-content .tier-card.recommended .tier-nameplate {
  background: linear-gradient(90deg, #e87c1c, #f6ae1b);
  color: #1d160b;
}
.clube-content .tier-card.recommended .tier-badge {
  color: #ffd100;
  font-weight: 800;
  letter-spacing: .04em;
}
.clube-content .tier-card.recommended .tier-benefits-details {
  margin: .25rem 0 1rem;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.clube-content .tier-card.recommended .tier-benefits > li > i {
  background: #ffd100;
  color: #1d160b;
}
.clube-content .tier-card.recommended .tier-benefits small {
  color: #cfcfcf;
}
.clube-content .tier-card.recommended .tier-benefits .tier-benefit-physical {
  background: rgba(232, 124, 28, .14);
  color: #f5f5f5;
  border: 1px solid rgba(246, 174, 27, .2);
}
.clube-content .tier-card.recommended .tier-benefits .tier-benefit-physical i {
  background: #e87c1c;
  color: #1d160b;
}
.clube-content .tier-card.recommended .tier-benefits .tier-benefit-physical small {
  color: #d6d0c7;
}

/* Reduz títulos que consumiam a primeira dobra nas áreas da conta. */
.clube-content main > section > h1,
.clube-content :is(.member-page-heading,.collection-header,.shelf-header,.supporters-hero) h1 {
  max-width: 15ch;
  margin: .25rem 0 .85rem;
  font-size: clamp(2.35rem, 4.25vw, 3.7rem);
  line-height: 1.12;
}
.clube-content main > section > h1 + p { max-width: 74ch; margin: 0 0 1.75rem; }
.clube-content :is(.member-page-heading,.collection-header,.shelf-header,.supporters-hero) > div:first-child > p:last-child,
.clube-content .member-page-heading > p:last-child { margin: 0; }

/* A carteirinha volta a ter acabamento holográfico, agora no tema escuro. */
.clube-content .membership-card-face {
  background: radial-gradient(circle at 88% 5%, rgba(255,255,255,.15) 0 14%, transparent 14.5%), linear-gradient(145deg, #444 0%, #1c1c1c 100%);
  box-shadow: 0 25px 60px rgba(0,0,0,.42), inset 0 1px rgba(255,255,255,.28);
}
.clube-content .membership-card-face::before,
.clube-content .membership-card-face::after { display: block; }
.clube-content .membership-card-back { background: linear-gradient(145deg, #3a332b, #171717); }
.clube-content :is(.card-identity p,.card-since,.membership-card-back dt) { color: #ffd100; }
.clube-content .membership-card-back > p { color: #d5d5d5; }

/* Remove o sombreado verde que restava do primeiro tema do Clube. */
.clube-content :is(.membership-card-face,.collection-total,.shelf-total,.supporters-total) { box-shadow: 0 18px 42px rgba(0,0,0,.28); }
.clube-content .campaign-image-band { background: #252525; box-shadow: 0 28px 70px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.12); }
.clube-content .campaign-image-band::after { background: linear-gradient(110deg, rgba(0,0,0,.36), transparent 40%, transparent 68%, rgba(0,0,0,.3)), rgba(0,0,0,var(--band-shade,.12)); }

@media(max-width:760px) {
  .clube-content .tier-nameplate,
  .clube-content .tier-card.recommended .tier-nameplate,
  .clube-content .tier-card > h2 {
    width: calc(100% + 2.7rem);
    margin-bottom: 1rem;
  }
  .clube-content main > section > h1,
  .clube-content :is(.member-page-heading,.collection-header,.shelf-header,.supporters-hero) h1 {
    max-width: 14ch;
    font-size: clamp(2rem, 10vw, 2.75rem);
    line-height: 1.12;
  }
  .clube-content .tier-card.recommended .tier-benefits-details {
    border: 1px solid rgba(246, 174, 27, .4);
    border-radius: .7rem;
  }
}


/* Cadastro único antes do checkout. */
.clube-content .checkout-profile { gap: 1rem; }
.clube-content .checkout-profile > p { margin: 0; color: var(--muted); }
.clube-content .checkout-address { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem 1rem; margin: .25rem 0; padding: 1rem; border: 1px solid var(--line); border-radius: .7rem; }
.clube-content .checkout-address legend { padding: 0 .35rem; color: var(--ink); font-weight: 700; }
.clube-content .checkout-address label { min-width: 0; }
.clube-content .checkout-address label:has([name$="_address_line1"]),
.clube-content .checkout-address label:has([name$="_address_line2"]),
.clube-content .checkout-address label:has([name$="_neighborhood"]) { grid-column: span 2; }
.clube-content .checkout-profile .check { display: flex; align-items: center; gap: .6rem; cursor: pointer; }
.clube-content .checkout-profile .check input { width: 1rem; height: 1rem; margin: 0; accent-color: #ffd100; }
@media(max-width:760px) { .clube-content .checkout-address { grid-template-columns: 1fr; } .clube-content .checkout-address label:has([name$="_address_line1"]), .clube-content .checkout-address label:has([name$="_address_line2"]), .clube-content .checkout-address label:has([name$="_neighborhood"]) { grid-column: auto; } }
.clube-content .admin-tabs a { border:1px solid var(--line); background:#252525; color:var(--ink); border-radius:.55rem; padding:.65rem 1rem; font:inherit; font-weight:700; text-decoration:none; display:inline-flex; align-items:center; }
.clube-content .admin-tabs a:hover { border-color:#ffd100; color:#ffd100; }
.clube-content .admin-tabs a.is-active { background:#ffd100; border-color:#ffd100; color:#171717; }