
.course-page { background:var(--color-background); color:var(--color-text); }
.course-page .sticky-header { display:block; }
.course-skip { position:fixed; left:16px; top:-100px; z-index:100; background:var(--color-text); color:var(--color-background); padding:var(--space-3); }
.course-skip:focus { top:12px; }
.course-hero { padding:calc(var(--cga-header-offset,110px) + var(--space-12)) 0 var(--space-12); background:linear-gradient(145deg,var(--color-hero-tint),var(--color-background) 68%); border-bottom:1px solid var(--color-border); }
.course-back { display:inline-block; color:var(--color-muted); margin-bottom:var(--space-8); font-size:var(--font-body); }
.course-hero h1 { font-size:var(--font-title); font-weight:650; letter-spacing:-.04em; line-height:1.08; margin:var(--space-4) 0 var(--space-6); max-width:var(--width-content); }
.course-headline { color:var(--color-secondary); font-size:var(--font-body); line-height:1.3; margin-bottom:var(--space-5); }
.course-lead { max-width:var(--width-reading); font-size:var(--font-body); line-height:1.7; color:var(--color-secondary); }
.course-actions { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-8); }
.course-actions a { text-align:center; }
.course-content { padding-top:var(--space-12); padding-bottom:var(--space-10); }
.course-content h2 { font-size:var(--font-heading); line-height:1.3; font-weight:600; margin-bottom:var(--space-4); }
.course-content p { line-height:1.8; color:var(--color-secondary); }
.course-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:var(--space-6) 0 var(--space-12); border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border); }
.course-facts div { padding:var(--space-5) var(--space-4) var(--space-5) 0; }
.course-facts dt { font-size:var(--font-small); color:var(--color-muted); margin-bottom:var(--space-2); }
.course-facts dd { font-size:var(--font-heading); font-weight:600; }
.course-columns { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:var(--space-16); }
.course-columns section + section { margin-top:var(--space-10); }
.course-signature { display:flex; gap:var(--space-5); border-top:1px solid var(--color-border); padding-top:var(--space-8); }
.course-hole { color:var(--color-accent); font-size:var(--font-heading); line-height:1; font-weight:600; }
.course-visit { padding-left:var(--space-6); border-left:2px solid var(--color-accent); }
.course-visit address { font-style:normal; font-size:var(--font-small); line-height:2; margin:var(--space-6) 0 var(--space-4); overflow-wrap:anywhere; }
.course-text-link { color:var(--color-secondary); text-decoration:underline; text-underline-offset:5px; }
.course-media-section,.course-notes { margin-top:var(--space-12); }
.course-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-6); }
.course-gallery img,.course-gallery video,.course-hero-image { display:block; width:100%; border-radius:var(--radius-control); }
.course-hero-image { max-height:600px; object-fit:cover; margin-top:var(--space-8); }
.course-gallery figcaption { font-size:var(--font-small); color:var(--color-secondary); margin-top:var(--space-2); }
.course-return { padding:var(--space-8) 0; margin-top:var(--space-8); border-top:1px solid var(--color-border); }
.course-sources { font-size:var(--font-small); color:var(--color-muted); line-height:1.9; }
.course-sources summary { cursor:pointer; }
.course-sources a { text-decoration:underline; }
.course-page .site-footer { border-top:1px solid var(--color-border); padding:var(--space-6) 0; color:var(--color-muted); font-size:var(--font-small); }
/* Rounded course dashboard, using the CGA logo palette. */
.course-dashboard { background: var(--color-background); }
.course-dashboard .course-hero { background: radial-gradient(ellipse at top right, rgb(var(--color-accent-rgb) / .17), transparent 65%); border: 0; padding-bottom: var(--space-6); }
.course-dashboard .course-back { margin-bottom: var(--space-4); }
.course-dashboard .course-lead { max-width: none; }
.course-dashboard .course-content { padding-top: var(--space-4); }
.course-dashboard-top { display: grid; grid-template-columns: minmax(11rem, .7fr) minmax(0, 1.6fr); gap: var(--space-5); align-items: stretch; }
.course-ring-card { display: grid; justify-items: center; align-content: center; gap: var(--space-2); border-radius: 1.5rem; padding: var(--space-4); background: var(--color-surface); }
.course-ring { width: 7.5rem; aspect-ratio: 1; border: .65rem solid var(--color-accent); border-radius: 50%; display: grid; place-items: center; background: var(--color-raised); }
.course-ring > div { display: grid; justify-items: center; }
.course-ring-number { font-size: 2.5rem; font-weight: 700; line-height: 1.1; }
.course-ring-card p { font-weight: 650; color: var(--color-text); }
.course-ring-card > span { color: var(--color-muted); font-size: var(--font-small); }
.course-dashboard .course-facts { display: grid; grid-template-columns: 1fr; gap: var(--space-3); border: 0; margin: 0; }
.course-dashboard .course-facts > div { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding: var(--space-3) var(--space-4); border-radius: 1.25rem; background: var(--color-surface-tint); }
.course-dashboard .course-facts > div:nth-child(2) { background: var(--color-raised); }
.course-dashboard .course-facts > div:nth-child(3) { background: var(--color-surface-selected); }
.course-dashboard .course-facts dt { font-size: var(--font-body); color: var(--color-secondary); margin: 0; }
.course-dashboard .course-facts dd { font-size: 1.5rem; white-space: nowrap; }
.course-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-5); }
.course-info-card { background: var(--color-surface); border: 1px solid var(--color-border-subtle); border-radius: 2rem; padding: var(--space-6); min-width: 0; }
.course-card-wide { grid-column: 1 / -1; }
.course-dashboard .course-info-card h2 { margin-block: var(--space-2) var(--space-3); }
.course-dashboard .course-card-label { font-size: var(--font-small); color: var(--color-accent-soft); font-weight: 600; }
.course-info-card p + a { display: inline-block; margin-top: var(--space-5); }
.course-signature-card { background: linear-gradient(130deg, var(--color-surface-tint), var(--color-surface)); }
.course-dashboard .course-hole { display: inline-block; font-size: 2.5rem; margin-top: var(--space-3); color: var(--color-text); }
.course-dashboard .course-visit { border-left: 1px solid var(--color-border-subtle); }
.course-map-card { background: linear-gradient(145deg, var(--color-surface-tint), var(--color-surface)); scroll-margin-top: calc(var(--cga-header-offset) + var(--space-4)); }
.course-dashboard .course-scorecard-link { display: block; margin-top: var(--space-4); }
.course-dashboard .course-visit .course-actions { align-items: center; margin-top: var(--space-4); }
.course-dashboard .course-sources { background: var(--color-surface); padding: var(--space-4) var(--space-5); border-radius: 1.5rem; }
@media (max-width: 639px) {
 .course-dashboard-top { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--space-3); }
 .course-ring-card { padding: var(--space-3); border-radius: 1.5rem; }
 .course-ring { width: min(100%, 6rem); border-width: .65rem; }
 .course-ring-number { font-size: 2rem; }
 .course-dashboard .course-facts > div { padding: var(--space-3); border-radius: 1.25rem; gap: var(--space-2); flex-wrap: wrap; }
 .course-dashboard .course-facts dt { font-size: var(--font-small); }
 .course-dashboard .course-facts dd { font-size: 1.5rem; }
 .course-card-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
 .course-info-card { border-radius: 1.5rem; padding: var(--space-5); }
}
@media(max-width: 767px) {
 .course-hero { padding-top:calc(var(--cga-header-offset,140px) + var(--space-6)); }
 .course-back { margin-bottom:var(--space-6); }
 .course-columns { grid-template-columns:1fr; gap:var(--space-8); }
 .course-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .course-gallery { grid-template-columns:1fr; }
 .course-visit { padding-left:var(--space-4); }
 .course-actions { flex-direction:column; align-items:stretch; }
}

.course-table-scroll { max-width:100%; overflow-x:auto; border-radius:1rem; }
.course-table-scroll:focus-visible { outline:2px solid var(--cga-red); outline-offset:4px; }
.course-stats-table { width:100%; border-collapse:collapse; font-size:var(--font-body); }
.course-stats-table caption { text-align:left; color:var(--color-muted); padding-block:0 var(--space-4); }
.course-stats-table th, .course-stats-table td { padding:var(--space-3) var(--space-4); border-bottom:1px solid var(--color-border-subtle); text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.course-stats-table th:first-child { text-align:left; }
.course-stats-table thead th { font-weight:600; }
.course-stats-table tbody th { font-weight:500; }
.course-stats-table .course-current { background:var(--color-surface-selected); }
.course-stats-table .course-current th { box-shadow:inset 3px 0 var(--cga-red); }
.course-dashboard .course-stat-note { margin-top:var(--space-4); color:var(--color-muted); }
.course-stat-sources { margin-top:var(--space-3); }
.course-par-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-3); margin-top:var(--space-3); }
.course-par-stats > div { padding:var(--space-4); border-radius:1.25rem; background:var(--color-surface-tint); }
.course-par-stats dt { color:var(--color-accent-soft); }
.course-par-stats dd { margin:var(--space-2) 0 0; font-size:var(--font-heading); font-weight:600; }
.course-par-stats dd span { font-size:var(--font-body); font-weight:400; }
@media(max-width:639px) {
 .course-stats-table th, .course-stats-table td { padding:var(--space-3) var(--space-2); }
 .course-par-stats > div { padding:var(--space-3); }
 .course-par-stats dd span { display:block; }
}

.course-youtube-pending:disabled { opacity:.65; cursor:default; background:transparent; }
