.club-section { background: var(--card-bg); border: 1px solid var(--acento); border-radius: 2rem; padding: clamp(1.4rem, 4vw, 3.5rem); margin-block: 2rem; color: var(--warm-accent); }
.club-intro { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(220px, .8fr); gap: 2.5rem; align-items: center; }
.club-intro h2 { text-align: left; margin: .5rem 0 1rem; }
.club-intro p { line-height: 1.7; }
.club-eyebrow { font-size: .78rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; color: var(--warm-accent); }
.club-saving { border-left: 1px solid var(--acento); padding-left: 2rem; }
.club-saving > strong { display: block; font-size: clamp(5rem, 9vw, 8rem); line-height: 1; letter-spacing: -.07em; color: var(--warm-accent); }
.club-saving > strong span { font-size: .45em; }
.club-saving > span { display: block; margin-top: .8rem; font-size: 1.3rem; font-weight: 700; }
.club-saving p { font-size: .88rem; }
.club-steps { list-style: none; counter-reset: club-step; margin: 2rem 0; padding: 0; border-block: 1px solid var(--acento); }
.club-steps li { counter-increment: club-step; display: grid; grid-template-columns: 2rem 11rem 1fr; gap: 1rem; align-items: baseline; padding: 1rem 0; }
.club-steps li::before { content: counter(club-step, decimal-leading-zero); font-size: .8rem; font-weight: 800; color: var(--warm-accent); }
.club-steps li + li { border-top: 1px solid var(--acento); }
.club-steps span, .club-terms { font-size: .93rem; line-height: 1.7; }
.club-section .calc-box { margin-top: 1.5rem; }
.club-section input:not([type=checkbox]) { width: 100%; max-width: 100%; padding: .85rem; border: 1px solid var(--acento); border-radius: .5rem; font: inherit; color: var(--warm-accent); background: var(--card-bg); }
.club-section small { display: block; margin-top: .5rem; }
.club-consent { display: flex; gap: .75rem; align-items: baseline; margin: 1rem 0; font-size: .92rem; line-height: 1.6; }
.club-account, .club-member { max-width: 640px; margin: 1.5rem auto 0; padding: 1.5rem; border: 1px solid var(--acento); border-radius: 1rem; background: var(--card-bg); }
.club-account summary { cursor: pointer; font-weight: 700; }
.club-account form { margin-top: 1.25rem; }
.club-text-button { display: inline-block; padding: .8rem .1rem; border: 0; color: var(--warm-accent); background: transparent; font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; }
.club-code { display: block; margin: .75rem 0; padding: 1rem; background: var(--card-bg); border-radius: .5rem; overflow-wrap: anywhere; letter-spacing: .05em; }
.club-member-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.club-status { max-width: 640px; margin: 1.5rem auto 0; line-height: 1.6; }
.club-status[data-state=error] { color: var(--error-text); }
.club-status[data-state=success] { color: var(--éxito); }
.club-section [hidden] { display: none !important; }
.club-section button:disabled { opacity: .6; cursor: wait; }
.club-section :focus-visible { outline: 3px solid var(--acento); outline-offset: 4px; }
@media (max-width: 700px) { .club-intro { grid-template-columns: 1fr; gap: 1rem; } .club-saving { border-left: 0; border-top: 1px solid var(--acento); padding: 1.5rem 0 0; } .club-steps li { grid-template-columns: 2rem 1fr; gap: .5rem; } .club-steps li span { grid-column: 2; } .club-member-actions .btn { width: 100%; } }