/* ChessDepth Academy - shared styles (header, footer, WhatsApp button, form messages) */
body { font-family: 'Poppins', sans-serif; }
.cd-demo-btn { background: #c2410c; color: #fff; font-weight: 600; border-radius: 9999px; padding: .5rem 1.1rem; transition: background .2s ease; white-space: nowrap; }
.cd-demo-btn:hover { background: #9a3412; color: #fff; }
.whatsapp-float { position: fixed; right: 20px; bottom: 20px; z-index: 40; display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 9999px; background: #22c55e; color: #fff; box-shadow: 0 10px 15px -3px rgba(0,0,0,.15); transition: transform .2s ease, background .2s ease; }
.whatsapp-float:hover { transform: translateY(-2px) scale(1.04); background: #16a34a; color: #fff; }
.cd-footer a { color: #d1d5db; transition: color .2s ease; }
.cd-footer a:hover { color: #a5b4fc; }
.cd-form-msg { margin-top: 1rem; padding: .85rem 1rem; border-radius: .375rem; border-left: 4px solid; font-size: .95rem; }
.cd-form-msg.error { background: #fef2f2; border-color: #ef4444; color: #991b1b; }
.cd-form-msg.success { background: #f0fdf4; border-color: #22c55e; color: #166534; }
[id] { scroll-margin-top: 90px; }
@media (prefers-reduced-motion: reduce) { .whatsapp-float { transition: none; } }
/* Orange colours used across the site (not included in Tailwind 2's default palette) */
.bg-orange-100 { background-color: #ffedd5; }
.bg-orange-500 { background-color: #c2410c; }
.hover\:bg-orange-600:hover { background-color: #9a3412; }
.text-orange-600 { color: #9a3412; }
.text-orange-700 { color: #c2410c; }
.text-orange-800 { color: #9a3412; }
.hover\:text-orange-800:hover { color: #9a3412; }
.cd-login-btn { border: 2px solid #4f46e5; color: #4338ca; font-weight: 600; border-radius: 9999px; padding: .4rem 1rem; white-space: nowrap; transition: background .2s ease, color .2s ease; }
.cd-login-btn:hover, .cd-login-btn.cd-active-btn { background: #4f46e5; color: #fff; }

/* ================= Header ================= */
:root { --cd-ink: #1f2547; --cd-ink-2: #2d3463; --cd-brass: #b08a4e; --cd-brass-soft: #e9dcc4; --cd-line: #e6e3ef; --cd-header-h: 76px; }
.cd-wrap { max-width: 80rem; margin: 0 auto; padding: 0 1.25rem; }

/* Thin information strip */
.cd-topbar { background: var(--cd-ink); color: #c9cde6; font-size: .8rem; }
.cd-topbar-inner { display: flex; justify-content: space-between; align-items: center; min-height: 38px; gap: 1rem; }
.cd-topbar p { display: flex; align-items: center; gap: 1.5rem; margin: 0; }
.cd-topbar a { color: #c9cde6; display: inline-flex; align-items: center; gap: .45rem; transition: color .15s; }
.cd-topbar a:hover, .cd-topbar a[aria-current] { color: #fff; }
.cd-topbar a i { color: var(--cd-brass); font-size: .75rem; }
.cd-topbar .cd-theme-btn { width: 1.9rem; height: 1.9rem; background: transparent; border-color: rgba(255,255,255,.18); color: #e9dcc4; }
.cd-topbar .cd-theme-btn:hover { border-color: var(--cd-brass); }

/* Main bar */
.cd-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--cd-line); transition: box-shadow .2s; }
.cd-header.shadow-xl, .cd-header.is-scrolled { box-shadow: 0 6px 18px -12px rgba(31,37,71,.35); }
.cd-header-inner { display: flex; align-items: center; justify-content: space-between; height: var(--cd-header-h); gap: 2rem; }

.cd-brand { display: inline-flex; align-items: center; gap: .7rem; color: var(--cd-ink); text-decoration: none; }
.cd-mark { width: 34px; height: 34px; color: var(--cd-ink); flex-shrink: 0; }
.cd-brand-text { display: flex; flex-direction: column; line-height: 1; }
.cd-brand-name { font-family: 'EB Garamond', Georgia, 'Times New Roman', serif; font-weight: 600; font-size: 2rem; letter-spacing: -.01em; color: var(--cd-ink); }
.cd-brand-sub { font-family: 'EB Garamond', Georgia, serif; font-style: italic; font-size: .95rem; color: #6b6f8a; margin-top: .2rem; }
.cd-brand:hover .cd-brand-name { color: var(--cd-ink-2); }

.cd-nav { display: none; align-items: center; gap: 2rem; }
.cd-nav .cd-link { position: relative; color: #3c4060; font-weight: 500; font-size: .95rem; padding: .35rem 0; transition: color .15s; }
.cd-nav .cd-link:hover { color: var(--cd-ink); }
.cd-nav .cd-link[aria-current] { color: var(--cd-ink); font-weight: 600; }
.cd-nav .cd-link[aria-current]::after { content: ''; position: absolute; left: 0; right: 0; bottom: -4px; height: 2px; background: var(--cd-brass); border-radius: 1px; }

.cd-hdr-cta { display: inline-flex; align-items: center; justify-content: center; background: var(--cd-ink); color: #fff; font-weight: 600; font-size: .9rem; padding: .7rem 1.25rem; border-radius: 6px; white-space: nowrap; transition: background .15s; }
.cd-hdr-cta:hover { background: var(--cd-ink-2); color: #fff; }

.cd-header-mobile { display: flex; align-items: center; gap: .5rem; }
.cd-menu-btn { padding: .5rem; color: var(--cd-ink); border-radius: 6px; }
.cd-header a:focus-visible, .cd-header button:focus-visible, .cd-topbar a:focus-visible, .cd-topbar button:focus-visible { outline: 2px solid var(--cd-brass); outline-offset: 3px; }

/* Phone menu */
.cd-mobile-menu { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--cd-line); box-shadow: 0 16px 24px -16px rgba(31,37,71,.35); }
.cd-mobile-menu nav { display: flex; flex-direction: column; padding-top: .5rem; padding-bottom: 1.25rem; }
.cd-mobile-menu nav > a { padding: .8rem 0; border-bottom: 1px solid var(--cd-line); color: #3c4060; font-weight: 500; }
.cd-mobile-menu nav > a[aria-current] { color: var(--cd-ink); font-weight: 600; box-shadow: inset 3px 0 0 var(--cd-brass); padding-left: .75rem; }
.cd-mobile-actions { display: flex; gap: .75rem; margin-top: 1.1rem; }
.cd-mobile-actions > a { flex: 1; }
.cd-mobile-login { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; border: 1px solid var(--cd-ink); color: var(--cd-ink); border-radius: 6px; font-weight: 600; font-size: .9rem; padding: .7rem 1rem; }
.cd-mobile-contact { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; margin-top: 1rem; font-size: .85rem; }
.cd-mobile-contact a { color: #6b6f8a; }

@media (max-width: 767px) { .cd-topbar { display: none; } :root { --cd-header-h: 66px; } .cd-brand-name { font-size: 1.6rem; } .cd-mark { width: 30px; height: 30px; } }
@media (min-width: 1200px) { .cd-nav { display: flex; } .cd-header-mobile { display: none; } .cd-mobile-menu { display: none !important; } }
@media (min-width: 1200px) and (max-width: 1340px) { .cd-nav { gap: 1.35rem; } }
@media (min-width: 768px) { .cd-header-mobile .cd-theme-btn { display: none; } }

/* "Coming soon" label for ChessDepth AI in the menu */
.cd-soon { display: inline-block; margin-left: .4rem; padding: .05rem .4rem; border: 1px solid var(--cd-brass); border-radius: 4px; color: #8a6a37; font-size: .62rem; font-weight: 600; letter-spacing: .02em; vertical-align: .15rem; line-height: 1.4; }
.cd-nav .cd-link-ai { white-space: nowrap; }
.cd-mobile-menu .cd-soon { font-size: .7rem; vertical-align: .1rem; }
.cd-free { display: inline-block; margin-left: .35rem; padding: 0 .35rem; border-radius: 4px; background: #b08a4e; color: #1f2547; font-size: .62rem; font-weight: 700; line-height: 1.5; }
/* Shared page banner: same colour, pattern, height and type on every page */
.cd-hero-bg, .blog-hero, .rs-hero, .ab-hero { background-color: #5b3fe0; background-image: linear-gradient(45deg, rgba(255,255,255,.06) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.06) 75%), linear-gradient(45deg, rgba(255,255,255,.06) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.06) 75%), linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important; background-size: 48px 48px, 48px 48px, auto !important; background-position: 0 0, 24px 24px, 0 0 !important; animation: none !important; }
.cd-hero { color: #fff; }
.cd-hero-inner { max-width: 56rem; margin: 0 auto; padding: 3.5rem 1rem; min-height: 20rem; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; }
.cd-hero-eyebrow { text-transform: uppercase; letter-spacing: .14em; font-size: .8rem; font-weight: 600; color: #c7d2fe; margin-bottom: .8rem; }
.cd-hero-title { font-weight: 800; font-size: clamp(2rem, 4.5vw, 3rem); line-height: 1.15; letter-spacing: -.01em; color: #fff; }
.cd-hero-lead { font-size: 1.125rem; line-height: 1.7; color: #e0e7ff; max-width: 46rem; margin-top: 1rem; }
.cd-hero-note { font-size: .85rem; color: #c7d2fe; margin-top: 1rem; }
@media (min-width: 768px) { .cd-hero-lead { font-size: 1.2rem; } }
html.dark .cd-hero-title { color: #fff !important; }
/* Chess boards (all products): no page scroll while dragging a piece; tap-to-move highlights */
chess-board { touch-action: none; -webkit-user-select: none; user-select: none; }
.cd-board-overlay .cd-sq-last { background: rgba(250, 204, 21, .5); mix-blend-mode: multiply; }
.cd-board-overlay .cd-sq-sel { background: rgba(99, 102, 241, .45); mix-blend-mode: multiply; }
.cd-board-overlay .cd-sq-dot::after { content: ""; position: absolute; left: 50%; top: 50%; width: 30%; height: 30%; transform: translate(-50%, -50%); border-radius: 50%; background: rgba(30, 27, 75, .35); }
.cd-board-overlay .cd-sq-cap { box-shadow: inset 0 0 0 4px rgba(30, 27, 75, .35); border-radius: 50%; }

/* Signed-in account chip (header) */
.cd-signed-in .cd-acct-img, .cd-signed-in .cd-acct-initial { width: 22px; height: 22px; border-radius: 999px; flex-shrink: 0; object-fit: cover; }
.cd-signed-in .cd-acct-initial { display: inline-flex; align-items: center; justify-content: center; background: var(--cd-brass); color: var(--cd-ink); font-weight: 700; font-size: .7rem; }
.cd-topbar a.cd-signed-in { font-weight: 600; color: #fff; }
.cd-topbar a.cd-signed-in .cd-acct-img { box-shadow: 0 0 0 2px rgba(255,255,255,.25); }
.cd-mobile-login.cd-signed-in .cd-acct-img, .cd-mobile-login.cd-signed-in .cd-acct-initial { width: 26px; height: 26px; }

/* Boards: open-hand cursor, arrows/circles layer, phone "Draw arrows" toggle */
chess-board.cd-drawable, chess-board.cd-drawable::part(board), chess-board.cd-drawable::part(square), chess-board.cd-drawable::part(piece), chess-board.cd-drawable::part(notation) { cursor: grab; }
chess-board.cd-drawable:active, chess-board.cd-drawable:active::part(square), chess-board.cd-drawable:active::part(piece), chess-board.cd-drawable:active::part(notation) { cursor: grabbing; }
html.cd-grabbing, html.cd-grabbing * { cursor: grabbing !important; }
chess-board.cd-pen-on, chess-board.cd-pen-on::part(square), chess-board.cd-pen-on::part(piece), chess-board.cd-pen-on::part(notation) { cursor: crosshair; touch-action: none; }
.cd-pen-bar { display: flex; justify-content: center; gap: .5rem; margin-top: .6rem; }
.cd-pen-btn { display: inline-flex; align-items: center; gap: .4rem; font-size: .85rem; font-weight: 600; color: #4338ca; background: #eef2ff; border: 1px solid #c7d2fe; border-radius: 999px; padding: .4rem .9rem; }
.cd-pen-btn[aria-pressed="true"] { background: #4f46e5; color: #fff; border-color: #4f46e5; }
.cd-pen-clear { padding: .4rem .7rem; }
html.dark .cd-pen-btn { background: #1e293b; color: #c7d2fe; border-color: #334155; }
html.dark .cd-pen-btn[aria-pressed="true"] { background: #6366f1; color: #fff; }

/* Community cards (_includes/community.html) */
.cm-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.cm-card { display: flex; flex-direction: column; gap: .7rem; background: #fff; border: 1px solid #e5e7eb; border-radius: .9rem; padding: 1.2rem 1.25rem; transition: box-shadow .15s, transform .15s, border-color .15s; color: #374151; }
.cm-card:hover { box-shadow: 0 12px 28px -14px rgba(30,27,75,.35); transform: translateY(-2px); border-color: #c7d2fe; }
.cm-ic { width: 2.9rem; height: 2.9rem; border-radius: .75rem; display: inline-flex; align-items: center; justify-content: center; font-size: 1.4rem; color: #fff; }
.cm-wa .cm-ic { background: #22c55e; } .cm-li .cm-ic { background: #262421; } .cm-cc .cm-ic { background: #81b64c; }
.cm-txt b { display: block; color: #111827; font-size: 1.05rem; } .cm-txt span { display: block; font-size: .9rem; line-height: 1.5; margin-top: .2rem; }
.cm-go { margin-top: auto; font-weight: 600; font-size: .9rem; color: #4f46e5; display: inline-flex; align-items: center; gap: .35rem; } .cm-go i { font-size: .75rem; }
@media (max-width: 760px) { .cm-grid { grid-template-columns: 1fr; } }
html.dark .cm-card { background: #162032; border-color: #273449; color: #a8b3c4; }
html.dark .cm-card:hover { border-color: #6366f1; }
html.dark .cm-txt b { color: #f1f5f9; } html.dark .cm-go { color: #a5b4fc; } html.dark .cm-li .cm-ic { background: #0b0a09; }
.cd-footer .cd-foot-social a { display: inline-flex; }
/* Drop-down menu in the header ("Academy": Courses, Coaches, Shop) */
.cd-dd { position: relative; }
.cd-nav .cd-dd-btn { display: inline-flex; align-items: center; gap: .35rem; background: none; border: 0; cursor: pointer; font-family: inherit; }
.cd-dd-caret { font-size: .62rem; transition: transform .2s; opacity: .7; }
.cd-dd.is-open .cd-dd-caret { transform: rotate(180deg); }
.cd-dd-menu { position: absolute; top: calc(100% + 14px); left: 50%; transform: translate(-50%, 6px); min-width: 19.5rem; background: #fff; border: 1px solid var(--cd-line); border-radius: 10px; box-shadow: 0 18px 40px -18px rgba(31,37,71,.45); padding: .45rem; opacity: 0; visibility: hidden; transition: opacity .15s, transform .15s, visibility .15s; z-index: 60; }
.cd-dd-menu::before { content: ''; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }   /* keeps hover alive across the gap */
.cd-dd.is-open .cd-dd-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
@media (hover: hover) { .cd-dd:hover .cd-dd-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); } .cd-dd:hover .cd-dd-caret { transform: rotate(180deg); } }
.cd-dd-item { display: flex; align-items: flex-start; gap: .75rem; padding: .65rem .75rem; border-radius: 8px; color: var(--cd-ink); transition: background .12s; }
.cd-dd-item:hover, .cd-dd-item:focus-visible { background: #f4f2ec; }
.cd-dd-item i { width: 1.1rem; text-align: center; color: #8a6a37; margin-top: .2rem; }
.cd-dd-item b { display: block; font-weight: 600; font-size: .95rem; }
.cd-dd-item small { display: block; color: #6b6f8a; font-size: .8rem; margin-top: .1rem; white-space: nowrap; }
.cd-dd-item[aria-current] { background: #f4f2ec; box-shadow: inset 3px 0 0 var(--cd-brass); }
.cd-m-group { border-bottom: 1px solid var(--cd-line); padding: .7rem 0 .4rem; }
.cd-m-group-h { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #8a6a37; margin-bottom: .2rem; }
.cd-m-group a { display: flex; align-items: center; gap: .65rem; padding: .55rem 0 .55rem .25rem; color: #3c4060; font-weight: 500; }
.cd-m-group a i { width: 1.1rem; text-align: center; color: #8a6a37; font-size: .9rem; }
.cd-m-group a[aria-current] { color: var(--cd-ink); font-weight: 600; box-shadow: inset 3px 0 0 var(--cd-brass); padding-left: .75rem; }
html.dark .cd-dd-menu { background: #141a2e; border-color: #222a44; box-shadow: 0 18px 40px -18px rgba(0,0,0,.8); }
html.dark .cd-dd-item { color: #e5e7f0; }
html.dark .cd-dd-item:hover, html.dark .cd-dd-item[aria-current] { background: #1d2440; }
html.dark .cd-dd-item small { color: #9aa1bd; }
html.dark .cd-dd-item i, html.dark .cd-m-group a i, html.dark .cd-m-group-h { color: #c9a66b; }
html.dark .cd-m-group { border-color: #222a44; }
html.dark .cd-m-group a { color: #b9bfd8; } html.dark .cd-m-group a[aria-current] { color: #fff; }