:root {
--gs-deep-dark: #1a1d23; /* Dark Charcoal from Galactic Spirit */
--gs-gold: #dfb33e;      /* Signature Gold */
--gs-soft-bg: #fdfdfd;
--gs-text: #333333;
--purple:purple;
}
html { scroll-behavior: smooth; }
body {
background-color: #ffffff;
font-family: 'Arial', sans-serif;
color: var(--gs-text);
line-height: 1.6;
}
h1, h2, h3, .display-4, .display-5 {
    color: var(--deep-dark);
}
/* --- ACCORDION OPENER (reusable on any library page via .accordion-gs) --- */
.accordion-gs .accordion-button {
background: #fff;
color: inherit;
box-shadow: none;
font-family: inherit;
font-size: 1rem;
font-weight: 400;
letter-spacing: normal;
border: 1px solid rgba(0,79,132,0.15) !important;
justify-content:start;
}
.accordion-gs .accordion-button:not(.collapsed) {
background: #fff;
color: inherit;
box-shadow: none;
}
.accordion-gs .accordion-button:hover {
background: #fdf6e3 !important;
}
.accordion-gs .accordion-button::after {
    display: inline-block;
    content: "";
    width: 12px;
    height: 12px;
    margin-left: 16px;
    flex-shrink: 0;
    background-image: none;
    border-right: 3px solid var(--gs-gold);
    border-bottom: 3px solid var(--gs-gold);
    transform: rotate(45deg);
    transition: transform 0.2s ease-in-out;
    margin-left:auto;
    margin-right:0;
}
.accordion-gs .accordion-button:not(.collapsed)::after {
transform: rotate(-135deg);
}
/* --- HERO --- */
.hero-section {
padding: 4rem 0 2rem;
}
.access-line {
display: inline-flex;
align-items: center;
gap: 0.75rem;
margin-top: 1rem;
padding: 0.8rem 1rem;
border-radius: 999px;
border: 1px solid #e5e7eb;
background: #ffffff;
box-shadow: 0 10px 25px rgba(15, 23, 42, 0.06);
font-size: 0.95rem;
line-height: 1.4;
flex-wrap: wrap;
justify-content: flex-start;
width: 100%;
}
.access-mark {
width: 0.65rem;
height: 0.65rem;
border-radius: 50%;
flex: 0 0 0.65rem;
background: #94a3b8;
}
.access-left {
display: inline-flex;
align-items: center;
gap: 0.65rem;
flex-wrap: wrap;
color: #475569;
text-align: left;
}
.access-current {
color: #1e293b;
font-size: 0.95rem;
text-transform: uppercase;
}
.access-prefix {
color: #64748b;
font-weight: 700;
margin-right: 0.2rem;
}
.access-inline-level {
display: inline-flex;
align-items: center;
justify-content: center;
margin: 0 0.35rem 0 0.45rem;
padding: 0.12rem 0.45rem;
border-radius: 999px;
background: rgba(15, 23, 42, 0.05);
color: #475569;
font-size: 0.72rem;
font-weight: 700;
vertical-align: middle;
}
.access-class-badge {
display: inline-flex;
align-items: center;
justify-content: center;
margin-left: 0.45rem;
padding: 0.12rem 0.45rem;
border-radius: 999px;
background: linear-gradient(135deg, #6b21a8 0%, #ec4899 100%);
color: #ffffff;
font-size: 0.68rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
vertical-align: middle;
}
.access-right {
display: inline-flex;
align-items: center;
gap: 0.65rem;
margin-left: auto;
flex-wrap: wrap;
}
.access-requirement {
color: red;
font-size: 0.88rem;
text-transform: uppercase;
}
.access-actions {
display: inline-flex;
align-items: center;
gap: 0.5rem;
flex-wrap: wrap;
}
.access-cta {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.45rem 0.9rem;
border-radius: 999px;
font-size: 0.82rem;
font-weight: 700;
letter-spacing: 0.02em;
text-decoration: none;
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.access-cta:hover {
transform: translateY(-1px);
}
.access-cta-signin {
background: #eff6ff;
border: 1px solid #bfdbfe;
color: #1d4ed8;
}
.access-cta-upgrade {
background: #fff7e8;
border: 1px solid #f3dfb2;
color: #9a6700;
}
.access-cta-class {
background: #eefaf4;
border: 1px solid #cfead7;
color: #166534;
}
.access-current strong{
color: #1e293b;
}
.access-line.access-free {
border-color: #eadcf8;
background: #fbf7ff;
}
.access-line.access-free .access-mark {
background: #ba0cf8;
}
.access-line.access-has {
border-color: #cfead7;
background: #f4fbf6;
}
.access-line.access-has .access-mark {
background: #2f9e4f;
}
.access-line.access-locked {
border-color: #f3dfb2;
background: #fff9ef;
}
.access-line.access-locked .access-mark {
background: #edb230;
}
.access-line.access-signedout {
border-color: #cfe1fb;
background: #f4f8ff;
}
.access-line.access-signedout .access-mark {
background: #1c6fd6;
}
@media (max-width: 767px) {
.access-line {
border-radius: 1rem;
justify-content: flex-start;
}
.access-left,
.access-right {
width: 100%;
}
.access-levels {
white-space: normal;
}
}
/* --- STICKY NAV --- */
.nav-main-container {
background: white;
border-bottom: 2px solid var(--gs-deep-dark);
top: 0;
padding-top: 1rem;
}
.nav-main .nav-link {
display: flex;
flex-direction: column;
align-items: center;
padding: 12px 24px;
min-width: 150px;
color: #777;
border: none;
font-weight: 700;
position: relative;
border-radius: 10px 10px 0 0;
background-color:#cccccc33;
text-transform: uppercase;
justify-content: flex-end;
height:100%;
line-height:1.2;
}

.nav-main .nav-link.gold{
    background-color: var(--gs-gold) ;
    color:black ;
}
.nav-main .nav-link.active {
background-color: #551355 !important;
color: #f4b54e !important;
}
.nav-main .nav-link .badge{
    background-color: var(--gs-gold);
    position: absolute;
    top: 5px;
    color: #000;
    right: 5px;
    border-radius: 6px;
    font-size:10px;
}
.nav-main .nav-link .nav-txt{
    color:inherit;
    text-align:center;
}
.nav-symbol { width: 40px; height: 40px; margin-bottom: 8px;object-fit:contain }
//.nav-main .nav-link.active .nav-symbol { filter: grayscale(0); opacity: 1; }
.sub-nav-wrapper {
background: #f8f9fa;
border-bottom: 1px solid #eee;
margin-bottom: 3rem;
position: sticky;
z-index:1;
}
.sub-nav {
display: flex;
justify-content: center;
gap: 2rem;
list-style: none;
margin: 0;
padding: 0.75rem 0;
}
.sub-nav a {
text-decoration: none;
color: #666;
font-weight: 700;
text-transform: uppercase;
font-size: 0.75rem;
letter-spacing: 1;
transition: 0.2s;
}
.sub-nav a:hover { color: var(--gs-gold); }
.sub-nav a.btn{
    padding:7px 16px 6px;
}
.anchor-section { scroll-margin-top: 160px; }

.anchor-section .sub-nav {
    gap:12px;
}
/* --- JOURNEY SECTION --- */
.journey-section { padding: 2rem 0; }
.feature-icon-small {
width: 3.5rem; height: 3.5rem;
background-color: var(--gs-deep-dark);
color: var(--gs-gold);
border-radius: 50%;
display: inline-flex; align-items: center; justify-content: center;
}
.journey-detail-col>*{
margin-bottom:24px;
}
.journey-detail-col>*:last-child{
margin-bottom:24px;
}
/* --- EXPLORE SECTION --- */
.section-label {
font-weight: 700; text-transform: uppercase;
letter-spacing: 2px; color: var(--gs-deep-dark);
margin: 3rem 0; display: block; text-align: center;
}
span.section-label{
font-size:14px;
margin:0;
padding:3rem 0 0;
}

.custom-card {
background-color: var(--gs-deep-dark);
background-size: cover; height: 320px; border-radius: 1rem;
display: flex; flex-direction: column; justify-content: flex-end;
text-decoration: none; transition: 0.3s ease; border: 1px solid #eee;
}
.custom-card:hover { transform: translateY(-8px); box-shadow: 0 15px 30px rgba(0,0,0,0.15); }
.card-overlay {
background: linear-gradient(0deg, rgba(26,29,35,0.9) 0%, rgba(26,29,35,0) 100%);
padding: 1.5rem; color: white; border-radius: 0 0 1rem 1rem;
}
.custom-card h3{
color:#fff;
}
/* --- PRACTICE SECTION --- */
.practice-card { border: 1px solid #e2e8f0; border-radius: 1rem; background: #fff; transition: 0.3s; }
.practice-card:hover { border-color: var(--gs-gold); box-shadow: 0 5px 15px rgba(0,0,0,0.05); }
/* --- SERIES SECTION --- */
.series-hero {
max-width: 760px;
}
.series-hero__eyebrow,
.series-card__kicker {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #6c63a8;
    margin-bottom: 0.75rem;
    padding: 0;
}
.series-list {
display: grid;
gap: 1.5rem;
}
.series-card {
background: linear-gradient(135deg, #f8f6ff 0%, #ffffff 100%);
border: 1px solid #e5def9;
border-radius: 1.5rem;
box-shadow: 0 18px 45px rgba(42, 38, 95, 0.08);
padding: 2rem;
}
.series-card__head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 1rem;
margin-bottom: 1rem;
}
.series-card__title {
margin-bottom: 0;
padding:0;
}
.series-card__count {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.55rem 0.9rem;
border-radius: 999px;
background: #2A265F;
color: #fff;
font-size: 0.75rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
white-space: nowrap;
}
.series-card__text {
max-width: 720px;
color: #555;
margin-bottom: 1.5rem;
padding: 0;
}
.series-card__links {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1rem;
}
.series-pill {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem 1.1rem;
background: #fff;
border: 1px solid #e8e2f6;
border-radius: 1rem;
text-decoration: none;
color: inherit;
transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.series-pill:hover {
transform: translateY(-3px);
box-shadow: 0 12px 28px rgba(42, 38, 95, 0.12);
border-color: #cbbcf4;
}
.series-pill__index {
display: inline-flex;
align-items: center;
justify-content: center;
width: 2.5rem;
height: 2.5rem;
border-radius: 50%;
background: #2A265F;
color: var(--gs-gold);
font-weight: 700;
flex: 0 0 2.5rem;
}
.series-pill__body {
display: flex;
flex-direction: column;
gap: 0.15rem;
}
.series-pill__body strong {
color: #2A265F;
}
.series-pill__body small {
font-size: 0.78rem;
letter-spacing: 0.04em;
text-transform: uppercase;
color: #7a7695;
}
/* --- FOOTER CTA BLOCK --- */
.footer-cta {
background:purple;
color: white; padding: 6rem 1rem;
border-radius: 3rem 3rem 0 0;
}

.anchor-section .btn{
    padding:0.375rem;
    border:1px solid #fff;
}

.anchor-section .btn-dark,
.custom-card .btn-outline-light{
    color:#fff !important;
}

.btn.btn-gs-gold {
    background-color: var(--gs-gold);
    color: var(--gs-deep-dark);
    font-weight: 700; border-radius: 50px;
    text-transform: uppercase; letter-spacing: 1px;
}
.btn.btn-gs-gold:hover { background-color: #f0c24d; color: var(--gs-deep-dark); }
.btn.btn-gs-blue {
    background-color: #004F84;
    color: #fff;
    font-weight: 700; border-radius: 50px;
    text-transform: uppercase; letter-spacing: 1px;
}
.btn.btn-gs-blue:hover { background-color: #00355a; color: #fff; }
.btn.btn-outline-gold {
    border: 2px solid var(--gs-gold);
    color: var(--gs-gold);
    border-radius: 50px; padding: 0.9rem 2.5rem;
    text-transform: uppercase; font-weight: 700;
}
.btn.btn-outline-gold:hover { background: var(--gs-gold); color: var(--gs-deep-dark); }
.course-info {
padding: 30px;
position: relative;
width: 100%;
}
.pt0{
padding-top:0 !important;
}
.btn-bg-white{
background-color:#fff;
}
.btn-bg-white:hover{
border-color:#fff;
}
.text-bg-dark h1,
.text-bg-dark h2,
.text-bg-dark h3,
.text-bg-dark h4,
.text-bg-dark h5,
.text-bg-dark h6{
color:#fff;
}
.info-card .btn{
margin-right:10px;
}
.info-card .btn:last-child{
margin-right:0;
}
.f18{
    font-size:18px;
}

.locked-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(26, 29, 35, 0.4);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    transition: 0.3s;
   border-radius: 1rem;
}
.locked-card:hover .locked-overlay { backdrop-filter: blur(2px); background: rgba(26, 29, 35, 0.2); }

@media(max-width: 767px){
    .series-card {
        padding: 1.5rem;
    }
    .series-card__head {
        flex-direction: column;
    }
    .series-card__links {
        grid-template-columns: 1fr;
    }
    .nav-symbol{
        margin:0;
        position: absolute;
        left: 40px;
        margin: 0;
    }
    .nav-main .nav-item{
        width:100%;
    }
    .nav-main .nav-link{
        width:100%;
        flex-flow: row;
        justify-content: center;
        gap: 10px;
    }
    .nav-main .nav-link:not(.no-symbol){
        padding-left:40px;
    }
    .nav-main .nav-link .nav-txt {
        min-width: 200px;
        display: inline-block;
    }

    .preview-card-row .col{
        flex:1 1 100%;
    }
}

.access-line{display:inline-flex;align-items:center;gap:9px;margin-top:14px;padding:9px 15px;
  border-radius:11px;font-size:14px;border:1px solid #e6e6da;background:#fff; width:100%;}
.access-line .access-mark{width:9px;height:9px;border-radius:50%;flex:none;}
.access-has{background:#eef7ee;border-color:#cfe6d0;color:#1f3d1f;}
.access-has .access-mark{background:#2f9e4f;}
.access-locked{background:#fbf3dd;border-color:#ecdcae;color:#8a5c00;}
.access-locked .access-mark{background:#EDB230;}
.access-signedout{background:#eef4fb;border-color:#d3e2f2;color:#1a3a5c;}
.access-signedout .access-mark{background:#1c6fd6;}
.access-free .access-mark{background:#ba0cf8;}


.anchor-section .related-birthrights{
    margin-bottom:16px;
}

.anchor-section .related-birthrights .birthright-pair {
    border: none;
    margin-top: 0;
}

.anchor-section .journey-section .btn {
    padding: 8px 16px;
}