:root {
    --cl-navy: #12263f;
    --cl-blue: #2f6f9f;
    --cl-orange: #f28c28;
    --cl-mint: #dff3e9;
    --cl-cream: #fff8ef;
    --cl-light: #f5f7fa;
    --cl-border: #dfe6ed;
    --cl-text: #243447;
    --cl-radius: 18px;
    --cl-shadow: 0 18px 45px rgba(18, 38, 63, .12);
}

.clublab-section-intro { max-width: 760px; margin-bottom: 2rem; }
.clublab-eyebrow { display: inline-block; color: var(--cl-orange); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; margin-bottom: .6rem; }
.clublab-button { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; padding: .85rem 1.25rem; border: 0; border-radius: 999px; background: var(--cl-orange); color: #fff; font-weight: 750; text-decoration: none; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; }
.clublab-button:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 10px 25px rgba(242, 140, 40, .28); }
.clublab-button--outline { background: transparent; color: var(--cl-navy); border: 1px solid var(--cl-border); }
.clublab-button--outline:hover { color: var(--cl-navy); background: #fff; }
.clublab-button--light { background: #fff; color: var(--cl-navy); }
.clublab-text-link { color: var(--cl-blue); font-weight: 750; text-decoration: none; }

.clublab-form-wrap { background: #fff; border-radius: 24px; padding: clamp(1.5rem, 4vw, 3rem); box-shadow: var(--cl-shadow); }
.clublab-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.25rem; }
.clublab-form p { margin: 0 0 1.1rem; }
.clublab-form label { display: block; margin-bottom: .4rem; color: var(--cl-navy); font-weight: 700; }
.clublab-form input, .clublab-form select, .clublab-form textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--cl-border); border-radius: 12px; padding: .8rem .9rem; background: #fff; color: var(--cl-text); font: inherit; }
.clublab-form input:focus, .clublab-form select:focus, .clublab-form textarea:focus { outline: 3px solid rgba(47,111,159,.16); border-color: var(--cl-blue); }
.clublab-honeypot { position: absolute !important; left: -10000px !important; }
.clublab-notice { padding: 1rem 1.15rem; margin-bottom: 1.25rem; border-radius: 12px; font-weight: 650; }
.clublab-notice--success { background: var(--cl-mint); color: #174c37; }
.clublab-notice--error { background: #fff0f0; color: #8c2525; }

.clublab-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.clublab-card { position: relative; overflow: hidden; display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--cl-border); border-radius: var(--cl-radius); background: #fff; box-shadow: 0 8px 28px rgba(18,38,63,.07); }
.clublab-card-body, .clublab-download-card { padding: 1.4rem; }
.clublab-card h3 { margin: .65rem 0; font-size: 1.2rem; color: var(--cl-navy); }
.clublab-card h3 a { color: inherit; text-decoration: none; }
.clublab-card p { flex-grow: 1; color: #526273; }
.clublab-card-image { aspect-ratio: 16/9; display: block; overflow: hidden; background: linear-gradient(135deg, var(--cl-mint), #dbeaf7); }
.clublab-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.clublab-card:hover .clublab-card-image img { transform: scale(1.035); }
.clublab-image-placeholder { width: 100%; height: 100%; display: grid; place-items: center; color: var(--cl-navy); font-size: 1.4rem; font-weight: 850; }
.clublab-pill { display: inline-flex; width: max-content; padding: .28rem .65rem; border-radius: 999px; background: var(--cl-mint); color: #18513a; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.clublab-icon-badge { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 1rem; border-radius: 14px; background: var(--cl-cream); color: var(--cl-orange); font-size: 1.65rem; font-weight: 800; }
.clublab-empty { grid-column: 1 / -1; padding: 2rem; border-radius: var(--cl-radius); background: var(--cl-light); text-align: center; }

.clublab-agenda-list { display: grid; gap: 1rem; }
.clublab-agenda-item { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 1.25rem; align-items: center; padding: 1.15rem; border: 1px solid var(--cl-border); border-radius: var(--cl-radius); background: #fff; }
.clublab-date-tile { display: grid; place-items: center; align-content: center; min-height: 72px; border-radius: 16px; background: var(--cl-navy); color: #fff; text-align: center; }
.clublab-date-tile strong { font-size: 1.65rem; line-height: 1; }
.clublab-date-tile span { margin-top: .3rem; color: #fff; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.clublab-agenda-content h3 { margin: .2rem 0; font-size: 1.2rem; }
.clublab-agenda-content h3 a { color: var(--cl-navy); text-decoration: none; }
.clublab-agenda-content p { margin: .35rem 0 0; color: #586879; }
.clublab-meta { color: var(--cl-orange); font-size: .8rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }

.clublab-login-layout { display: grid; grid-template-columns: 1fr minmax(320px, .8fr); gap: 3rem; align-items: center; }
.clublab-login-card { padding: 2rem; border: 1px solid var(--cl-border); border-radius: 22px; background: #fff; box-shadow: var(--cl-shadow); }
.clublab-login-card label { display: block; color: var(--cl-navy); font-weight: 700; }
.clublab-login-card input[type="text"], .clublab-login-card input[type="password"] { width: 100%; box-sizing: border-box; padding: .8rem; border: 1px solid var(--cl-border); border-radius: 10px; }
.clublab-login-card input[type="submit"] { border: 0; border-radius: 999px; padding: .85rem 1.25rem; background: var(--cl-orange); color: #fff; font-weight: 750; cursor: pointer; }
.clublab-login-help { margin-bottom: 0; }

.clublab-dashboard-hero { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; padding: clamp(1.5rem, 4vw, 3rem); border-radius: 24px; background: var(--cl-navy); color: #fff; }
.clublab-dashboard-hero h2, .clublab-dashboard-hero p { color: #fff; }
.clublab-dashboard-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-bottom: 2.5rem; }
.clublab-dashboard-tile { display: flex; flex-direction: column; gap: .3rem; padding: 1.4rem; border-radius: 18px; background: var(--cl-light); color: var(--cl-navy); text-decoration: none; }
.clublab-dashboard-tile strong { font-size: 1.05rem; }
.clublab-dashboard-tile span { color: #607083; }

.clublab-chat { position: fixed; right: 24px; bottom: 24px; z-index: 99990; font-family: inherit; }
.clublab-chat-toggle { width: 58px; height: 58px; border: 0; border-radius: 18px 18px 4px 18px; background: var(--cl-orange); color: #fff; box-shadow: var(--cl-shadow); font-size: 1.55rem; font-weight: 900; cursor: pointer; }
.clublab-chat-panel { position: absolute; right: 0; bottom: 72px; width: min(380px, calc(100vw - 32px)); overflow: hidden; border: 1px solid var(--cl-border); border-radius: 22px; background: #fff; box-shadow: 0 24px 70px rgba(18,38,63,.22); }
.clublab-chat-panel > header { display: flex; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.2rem; background: var(--cl-navy); color: #fff; }
.clublab-chat-panel > header div { display: flex; flex-direction: column; }
.clublab-chat-panel > header span { opacity: .76; font-size: .78rem; }
.clublab-chat-panel > header button { align-self: flex-start; border: 0; background: transparent; color: #fff; font-size: 1.45rem; cursor: pointer; }
.clublab-chat-messages { max-height: 360px; overflow-y: auto; padding: 1rem; background: var(--cl-light); }
.clublab-chat-message { max-width: 88%; margin-bottom: .75rem; padding: .75rem .9rem; border-radius: 14px; font-size: .9rem; line-height: 1.45; }
.clublab-chat-message p { margin: 0 0 .5rem; }
.clublab-chat-message p:last-child { margin-bottom: 0; }
.clublab-chat-message--bot { background: #fff; border-bottom-left-radius: 4px; }
.clublab-chat-message--user { margin-left: auto; background: var(--cl-blue); color: #fff; border-bottom-right-radius: 4px; }
.clublab-chat-message ul { margin: .5rem 0 0; padding: 0; list-style: none; }
.clublab-chat-message li { padding: .5rem 0; border-top: 1px solid var(--cl-border); }
.clublab-chat-message li a { display: block; color: var(--cl-blue); font-weight: 750; text-decoration: none; }
.clublab-chat-message li small { color: #718093; }
.clublab-chat-suggestions { display: flex; flex-wrap: wrap; gap: .4rem; }
.clublab-chat-suggestions button { border: 1px solid var(--cl-border); border-radius: 999px; background: #fff; padding: .45rem .65rem; color: var(--cl-navy); cursor: pointer; font-size: .75rem; }
.clublab-chat-panel form { display: grid; grid-template-columns: 1fr 42px; gap: .5rem; padding: .8rem; border-top: 1px solid var(--cl-border); }
.clublab-chat-panel form input { min-width: 0; border: 1px solid var(--cl-border); border-radius: 999px; padding: .7rem .85rem; }
.clublab-chat-panel form button { border: 0; border-radius: 50%; background: var(--cl-orange); color: #fff; font-size: 1.15rem; cursor: pointer; }
.clublab-chat-panel > footer { display: flex; gap: 1rem; padding: 0 .9rem .8rem; font-size: .75rem; }
.clublab-chat-panel > footer a { color: var(--cl-blue); }

@media (max-width: 800px) {
    .clublab-card-grid, .clublab-dashboard-grid { grid-template-columns: 1fr 1fr; }
    .clublab-login-layout { grid-template-columns: 1fr; gap: 1.5rem; }
    .clublab-agenda-item { grid-template-columns: 64px 1fr; }
    .clublab-agenda-action { grid-column: 2; }
}
@media (max-width: 560px) {
    .clublab-form-grid, .clublab-card-grid, .clublab-dashboard-grid { grid-template-columns: 1fr; }
    .clublab-dashboard-hero { align-items: flex-start; flex-direction: column; }
    .clublab-agenda-item { grid-template-columns: 56px 1fr; gap: .8rem; }
    .clublab-date-tile { min-height: 60px; }
    .clublab-chat { right: 16px; bottom: 16px; }
}
