* { margin: 0; padding: 0; box-sizing: border-box; }
:root {
    --black: #0a0a0a;
    --white: #ffffff;
    --grey-dark: #141414;
    --grey-mid: #1e1e1e;
    --grey-light: #2a2a2a;
    --text-muted: #777777;
    --text-light: #b0b0b0;
    --sidebar-width: 320px;
    --ticker-height: 38px;
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
}
html { scroll-behavior: smooth; overflow-x: clip; }
body { font-family: 'Inter', sans-serif; background: var(--black); color: var(--white); line-height: 1.6; overflow-x: clip; }
a { color: inherit; text-decoration: none; }
body::before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.03; pointer-events: none; z-index: 10000; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E"); }

.sidebar { position: fixed; top: 0; left: 0; width: var(--sidebar-width); height: calc(100vh - var(--ticker-height)); background: var(--grey-dark); border-right: 1px solid rgba(255,255,255,0.06); display: flex; flex-direction: column; z-index: 1000; }
.sidebar-header { padding: 2.5rem 2rem; text-align: center; border-bottom: 1px solid rgba(255,255,255,0.06); }
.profile-pic { width: 110px; height: 110px; background: linear-gradient(145deg, #252525 0%, #1a1a1a 100%); border-radius: 50%; margin: 0 auto 1.25rem; display: flex; align-items: center; justify-content: center; font-size: 0.65rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; overflow: hidden; box-shadow: 0 8px 32px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.05); transition: transform 0.5s var(--ease-out-expo), box-shadow 0.5s var(--ease-out-expo); }
.profile-pic:hover { transform: scale(1.05); box-shadow: 0 12px 40px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.08); }
.profile-pic img { width: 100%; height: 100%; object-fit: cover; }
.sidebar-header h1 { font-size: 1.35rem; font-weight: 900; letter-spacing: -0.5px; margin-bottom: 0.35rem; }
.sidebar-header .tagline { font-size: 0.75rem; color: var(--text-muted); font-weight: 600; text-transform: uppercase; letter-spacing: 2px; }
.sidebar-header .tagline-quote { font-size: 0.8rem; color: var(--text-muted); font-style: italic; line-height: 1.5; max-width: 260px; margin: 0 auto; }
.sidebar-social { display: flex; justify-content: center; gap: 0.75rem; padding: 1.25rem 2rem; border-bottom: 1px solid rgba(255,255,255,0.06); }
.sidebar-social a { width: 35px; height: 35px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); display: flex; align-items: center; justify-content: center; transition: all 0.4s var(--ease-out-expo); border-radius: 4px; }
.sidebar-social a img { width: 20px; height: 20px; object-fit: contain; transition: all 0.3s ease; }
.sidebar-social a.invert img { filter: invert(1); }
.sidebar-social a:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.3); }
.sidebar-cta { padding: 1.5rem 2rem; border-bottom: 1px solid rgba(255,255,255,0.06); }
.btn-sidebar { display: block; width: 100%; padding: 1rem 1.5rem; background: transparent; color: var(--white); font-weight: 700; text-transform: uppercase; letter-spacing: 1px; font-size: 0.8rem; text-align: center; border: 1px solid rgba(255,255,255,0.3); cursor: pointer; transition: all 0.5s ease; }
.btn-sidebar:hover { border-color: var(--white); box-shadow: 0 0 20px rgba(255,255,255,0.2), inset 0 0 20px rgba(255,255,255,0.05); }

.thought-feed { flex: 1; overflow-y: auto; padding: 1.5rem; }
.thought-feed-title { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: var(--text-muted); margin-bottom: 1rem; display: flex; align-items: center; gap: 0.5rem; }
.thought-feed-title::before { content: ''; width: 10px; height: 10px; background: #4ade80; border-radius: 50%; animation: pulse 2s ease-in-out infinite; box-shadow: 0 0 10px rgba(74,222,128,0.5); will-change: transform, opacity; }
@keyframes pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(0.9); } }
.thought { padding: 1rem 0; border-bottom: 1px solid rgba(255,255,255,0.06); opacity: 0; transform: translateY(20px); animation: thoughtFadeIn 1s var(--ease-out-expo) forwards; }
.thought:last-child { border-bottom: none; }
@keyframes thoughtFadeIn { to { opacity: 1; transform: translateY(0); } }
.thought:nth-child(2) { animation-delay: 0.2s; } .thought:nth-child(3) { animation-delay: 0.4s; } .thought:nth-child(4) { animation-delay: 0.6s; } .thought:nth-child(5) { animation-delay: 0.8s; } .thought:nth-child(6) { animation-delay: 1s; } .thought:nth-child(7) { animation-delay: 1.2s; } .thought:nth-child(8) { animation-delay: 1.4s; }
.thought-time { font-size: 0.65rem; color: var(--text-muted); font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 0.4rem; }
.thought-text { font-size: 0.85rem; line-height: 1.55; color: var(--text-light); }
.thought-text strong { color: var(--white); }
.thought-loading { text-align: center; padding: 2rem; color: var(--text-muted); font-size: 0.8rem; }
.thought-feed::-webkit-scrollbar { width: 3px; } .thought-feed::-webkit-scrollbar-track { background: transparent; } .thought-feed::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 3px; }

.main-content { margin-left: var(--sidebar-width); margin-bottom: var(--ticker-height); min-height: calc(100vh - var(--ticker-height)); }

nav { position: sticky; top: 0; z-index: 900; padding: 1.5rem 3rem; display: flex; justify-content: flex-end; align-items: center; background: rgba(10,10,10,0.85); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid rgba(255,255,255,0.05); }
.nav-burger { display: none; background: none; border: none; cursor: pointer; padding: 0.5rem; z-index: 1001; }
.nav-burger span { display: block; width: 24px; height: 2px; background: var(--white); margin: 5px 0; transition: all 0.3s ease; }
.nav-burger.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.nav-burger.active span:nth-child(2) { opacity: 0; }
.nav-burger.active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }
.nav-links { display: flex; gap: 2.5rem; list-style: none; }
.nav-links a { font-weight: 600; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 1.5px; transition: color 0.3s ease; position: relative; padding-bottom: 4px; }
.nav-links a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background: var(--white); transition: width 0.4s var(--ease-out-expo); }
.nav-links a:hover { color: var(--white); } .nav-links a:hover::after { width: 100%; }
.nav-links a.active { color: var(--white); }
.nav-links a.active::after { width: 100%; }

.hero { min-height: calc(100vh - var(--ticker-height)); display: grid; grid-template-columns: 1fr 1.2fr; align-items: center; padding: 4rem; gap: 4rem; position: relative; overflow: hidden; }
.hero::before { content: ''; position: absolute; top: 0; right: 0; width: 60%; height: 100%; background: radial-gradient(ellipse at 70% 50%, rgba(40,40,40,0.4) 0%, transparent 70%); pointer-events: none; }
.hero-content { z-index: 2; }
.hero-content h1 { font-size: 4.5rem; font-weight: 900; line-height: 1.05; letter-spacing: -3px; margin-bottom: 1.75rem; }
.hero-content p { font-size: 1.1rem; color: var(--text-muted); line-height: 2.2; margin-bottom: 2.5rem; }

/* Hero text reveal animation */
.hero-content h1 .word-1,
.hero-content h1 .word-2,
.hero-content h1 .word-3 {
    display: inline-block;
    opacity: 0;
    transform: translateY(30px);
    animation: revealWord 0.8s ease forwards;
}
.hero-content h1 .word-1 { animation-delay: 0.2s; }
.hero-content h1 .word-2 { animation-delay: 0.4s; }
.hero-content h1 .word-3 { animation-delay: 0.6s; }

/* Hero text gradient shimmer - fading down */
.hero-content h1 .word-1 {
    background: linear-gradient(135deg, #ffffff 0%, #cccccc 50%, #ffffff 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: revealWord 0.8s ease forwards, gradientShift 4s ease infinite;
    animation-delay: 0.2s, 0s;
}
.hero-content h1 .word-2 {
    background: linear-gradient(135deg, #b0b0b0 0%, #888888 50%, #b0b0b0 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: revealWord 0.8s ease forwards, gradientShift 4s ease infinite;
    animation-delay: 0.4s, 0.5s;
}
.hero-content h1 .word-3 {
    background: linear-gradient(135deg, #777777 0%, #555555 50%, #777777 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: revealWord 0.8s ease forwards, gradientShift 4s ease infinite;
    animation-delay: 0.6s, 1s;
}

/* Hero paragraph and buttons reveal */
.hero-content p {
    opacity: 0;
    transform: translateY(20px);
    animation: revealWord 0.8s ease forwards;
    animation-delay: 0.8s;
}
.hero-content .btn-group,
.hero-content .btn {
    opacity: 0;
    transform: translateY(20px);
    animation: revealWord 0.8s ease forwards;
    animation-delay: 1s;
}
.hero-content p { font-size: 1.1rem; color: var(--text-muted); margin-bottom: 2.5rem; max-width: 460px; line-height: 1.75; }
.btn { display: inline-block; padding: 0.85rem 1.75rem; background: transparent; border: 1px solid rgba(255,255,255,0.4); color: var(--white); font-weight: 600; text-transform: uppercase; letter-spacing: 1px; font-size: 0.75rem; cursor: pointer; transition: all 0.5s ease; text-decoration: none; position: relative; overflow: hidden; }
.btn::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent); transition: none; }
.btn:hover { border-color: var(--white); background: rgba(255,255,255,0.05); }
.btn:hover::before { left: 100%; transition: left 0.6s ease; }
.hero-image { height: 100%; display: flex; align-items: center; justify-content: center; font-size: 0.9rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 2px; position: relative; overflow: hidden; }
.hero-image img { width: 100%; height: 130%; object-fit: cover; position: absolute; top: 0; left: 0; will-change: transform; }

section { padding: 3rem 4rem; }
.section-title { font-size: 2.75rem; font-weight: 900; letter-spacing: -1.5px; margin-bottom: 1rem; }
.section-subtitle { font-size: 1.05rem; color: var(--text-muted); margin-bottom: 3.5rem; max-width: 550px; line-height: 1.7; }

.the-group { background: var(--grey-dark); position: relative; overflow: clip; padding-left: 0; padding-right: 0; }
.the-group .section-title, .the-group .section-subtitle { margin-left: 4%; }
.the-group::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent); }
.carousel-container { position: relative; overflow: hidden; }
.carousel-container::before, .carousel-container::after { content: ''; position: absolute; top: -20px; bottom: -20px; width: 100px; z-index: 8; pointer-events: none; }
.carousel-container::before { left: 0; background: linear-gradient(to right, var(--grey-dark) 20%, transparent 100%); }
.carousel-container::after { right: 0; background: linear-gradient(to left, var(--grey-dark) 20%, transparent 100%); }
.carousel-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; background: none; border: none; color: var(--white); width: 80px; height: 150px; font-size: 2.5rem; cursor: pointer; transition: all 0.3s ease; display: flex; align-items: center; justify-content: center; opacity: 0.9; }
.carousel-arrow:hover { opacity: 1; }
.carousel-arrow-left { left: 0; padding-left: 20px; justify-content: flex-start; }
.carousel-arrow-right { right: 0; padding-right: 20px; justify-content: flex-end; }
.group-carousel { display: flex; gap: 1.5rem; transition: transform 0.5s var(--ease-out-expo); padding: 20px 80px; will-change: transform; }
.group-card { background: var(--black); padding: 2rem; border: 1px solid rgba(255,255,255,0.06); transition: all 0.5s var(--ease-out-expo); position: relative; overflow: hidden; flex: 0 0 300px; display: flex; flex-direction: column; }
.group-card::before { content: ''; position: absolute; top: -1px; left: -1px; right: -1px; height: 2px; background: linear-gradient(90deg, transparent, var(--white), transparent); opacity: 0; transition: opacity 0.4s ease; z-index: 2; }
.group-card::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 85% 0%, rgba(255,255,255,0.15) 0%, transparent 30%), radial-gradient(ellipse at 10% 100%, rgba(255,255,255,0.08) 0%, transparent 20%), radial-gradient(ellipse at 55% 51%, rgba(255,255,255,0.08) 0%, transparent 30%), radial-gradient(ellipse at 30% 75%, rgba(255,255,255,0.08) 0%, transparent 30%); opacity: 0; transition: opacity 0.5s ease; pointer-events: none; }
.group-card:hover { transform: translateY(-8px); border-color: rgba(255,255,255,0.2); box-shadow: 0 20px 50px rgba(0,0,0,0.4); overflow: visible; }
.group-card:hover::before { opacity: 1; }
.group-card:hover::after { opacity: 1; }
.group-card-logo { height: 60px; background: var(--grey-mid); margin-bottom: 1.5rem; display: flex; align-items: center; justify-content: center; font-size: 0.6rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; overflow: hidden; transition: all 0.4s ease; padding: 0.5rem; }
.group-card:hover .group-card-logo { background: var(--grey-light); }
.group-card-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.group-card h3 { font-size: 1.1rem; margin-bottom: 0.75rem; font-weight: 700; }
.group-card p { color: var(--text-muted); font-size: 0.85rem; line-height: 1.6; flex: 1; }
.group-card .card-tag { display: inline-block; margin-top: auto; padding-top: 1.25rem; font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--text-muted); border: 1px solid rgba(255,255,255,0.1); padding: 0.4rem 0.85rem; transition: all 0.3s ease; align-self: flex-start; }
.group-card:hover .card-tag { border-color: rgba(255,255,255,0.2); color: var(--text-light); }

.podcast { background: var(--black); }
.podcast-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 4rem; align-items: center; }
.podcast-image { height: 480px; background: linear-gradient(145deg, #252525 0%, #151515 100%); display: flex; align-items: center; justify-content: center; color: var(--text-muted); text-transform: uppercase; letter-spacing: 2px; position: relative; overflow: hidden; box-shadow: 0 25px 60px rgba(0,0,0,0.4); transition: all 0.5s var(--ease-out-expo); }
.podcast-image:hover { transform: scale(1.02); box-shadow: 0 30px 70px rgba(0,0,0,0.5); }
.podcast-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--ease-out-expo); }
.podcast-image:hover img { transform: scale(1.05); }
.podcast-content h2 { font-size: 2.75rem; font-weight: 900; letter-spacing: -1.5px; margin-bottom: 1rem; }
.podcast-content .podcast-tagline { font-size: 1rem; color: var(--text-muted); margin-bottom: 2rem; line-height: 1.75; }
.btn-group { display: flex; gap: 1rem; flex-wrap: wrap; }
.btn-group-inline { flex-wrap: nowrap; }
.btn-icon { display: inline-flex; align-items: center; gap: 0.75rem; }
.btn-icon svg { width: 28px; height: 28px; flex-shrink: 0; }
.btn-img-icon { width: 28px; height: 28px; flex-shrink: 0; object-fit: contain; }
.btn-img-icon-lg { width: 45px; height: 45px; flex-shrink: 0; object-fit: contain; }
.episode-list { margin-top: 2.5rem; }
a.episode { display: flex; align-items: center; gap: 1.25rem; padding: 1.1rem 0; border-bottom: 1px solid rgba(255,255,255,0.06); transition: all 0.3s ease; cursor: pointer; text-decoration: none; color: inherit; }
a.episode:hover { padding-left: 1rem; background: rgba(255,255,255,0.02); }
a.episode:last-child { border-bottom: none; }
.episode-number { font-size: 0.7rem; font-weight: 700; color: var(--text-muted); width: 50px; transition: color 0.3s ease; }
a.episode:hover .episode-number { color: var(--white); }
.episode-title { flex: 1; font-size: 0.95rem; font-weight: 600; }
.coming-soon { color: var(--text-muted); font-weight: 400; }
.episode-arrow { font-size: 0.9rem; color: var(--text-muted); opacity: 0; transform: translateX(-10px); transition: all 0.3s ease; }
a.episode:hover .episode-arrow { opacity: 1; transform: translateX(0); color: var(--white); }

.trade-up { background: var(--grey-dark); position: relative; }
.trade-up::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent); }
.trade-up-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 4rem; align-items: center; }
.trade-up-content h2 { font-size: 2.75rem; font-weight: 900; letter-spacing: -1.5px; margin-bottom: 1rem; }
.trade-up-content .highlight { font-size: 1.6rem; font-weight: 700; color: var(--white); margin-bottom: 1.25rem; line-height: 1.4; }
.trade-up-content p { font-size: 1rem; color: var(--text-muted); margin-bottom: 1.5rem; line-height: 1.75; }
.trade-progress { display: flex; align-items: center; gap: 1.5rem; margin: 2.5rem 0; padding: 1.5rem; background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.06); }
.trade-start, .trade-end { text-align: center; flex: 0 0 auto; }
.trade-start .label, .trade-end .label { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 1.5px; color: var(--text-muted); margin-bottom: 0.5rem; }
.trade-start .value, .trade-end .value { font-size: 0.95rem; font-weight: 700; }
.trade-slider { flex: 1; position: relative; height: 4px; background: rgba(255,255,255,0.1); border-radius: 2px; }
.trade-slider-fill { position: absolute; left: 0; top: 0; height: 100%; width: 0; background: linear-gradient(90deg, var(--white), rgba(255,255,255,0.7)); border-radius: 2px; transition: width 2.5s var(--ease-out-expo); }
.trade-slider-marker { position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%); width: 28px; height: 28px; transition: left 2.5s var(--ease-out-expo); }
.trade-slider-marker img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 2px 6px rgba(0,0,0,0.5)); transition: transform 0.3s ease; }
.trade-slider-marker:hover img { transform: rotate(20deg) scale(1.1); }
.trade-slider-count { position: absolute; top: -24px; left: 50%; transform: translateX(-50%); font-size: 0.65rem; font-weight: 700; color: var(--white); white-space: nowrap; }
.trade-up-image { height: 480px; background: linear-gradient(145deg, #252525 0%, #151515 100%); display: flex; align-items: center; justify-content: center; color: var(--text-muted); text-transform: uppercase; letter-spacing: 2px; position: relative; overflow: hidden; box-shadow: 0 25px 60px rgba(0,0,0,0.4); }
.trade-up-image img { width: 100%; height: 130%; object-fit: cover; position: absolute; top: 0; left: 0; will-change: transform; }
.trade-up-embed { width: 100%; aspect-ratio: 1920 / 3390; max-height: 700px; overflow: hidden; border-radius: 4px; box-shadow: 0 25px 60px rgba(0,0,0,0.4); background: var(--grey-dark); }
.trade-up-embed iframe { width: 100%; height: 100%; border: none; scrollbar-width: none; -ms-overflow-style: none; }
.trade-up-embed iframe::-webkit-scrollbar { display: none; }
.embed-cta { text-align: center; font-size: 0.9rem; color: var(--text-muted); margin-bottom: 1rem; font-style: italic; }

/* Modal */
.modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.85); z-index: 1000; display: none; align-items: center; justify-content: center; padding: 1.5rem; }
.modal-overlay.active { display: flex; }
.modal { background: var(--grey-dark); padding: 2rem; max-width: 480px; width: 100%; position: relative; border: 1px solid rgba(255,255,255,0.1); }
.modal-close { position: absolute; top: 1rem; right: 1rem; background: none; border: none; color: var(--text-muted); font-size: 1.5rem; cursor: pointer; transition: color 0.3s ease; }
.modal-close:hover { color: var(--white); }
.modal h3 { font-size: 1.35rem; font-weight: 700; margin-bottom: 0.4rem; }
.modal > p { color: var(--text-muted); font-size: 0.85rem; margin-bottom: 1.25rem; line-height: 1.5; }
.modal-form .form-group { margin-bottom: 1rem; }
.modal-form label { display: block; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 0.4rem; color: var(--text-light); }
.modal-form input, .modal-form textarea { width: 100%; padding: 0.7rem 0.9rem; background: #2B2B2B; border: 1px solid rgba(255,255,255,0.15); color: var(--white); font-size: 0.9rem; transition: all 0.3s ease; }
.modal-form input::placeholder, .modal-form textarea::placeholder { color: var(--text-muted); font-style: italic; font-size: 0.85rem; }
.modal-form input:focus, .modal-form textarea:focus { outline: none; border-color: rgba(255,255,255,0.3); background: #333333; }
.modal-form textarea { min-height: 80px; resize: vertical; }
.modal-form .btn { width: 100%; margin-top: 0.5rem; }

/* Video Modal */
.video-modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.95); z-index: 2000; display: none; align-items: center; justify-content: center; padding: 2rem; }
.video-modal-overlay.active { display: flex; }
.video-modal-close { position: absolute; top: 1.5rem; right: 1.5rem; background: none; border: none; color: var(--white); font-size: 2.5rem; cursor: pointer; transition: opacity 0.3s ease; z-index: 2001; }
.video-modal-close:hover { opacity: 0.7; }
.video-modal { width: 100%; max-width: 900px; }
.video-container { position: relative; width: 100%; padding-bottom: 56.25%; background: var(--black); }
.video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; }

.about { background: var(--black); }
.about-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 4rem; align-items: start; }
.about-grid-flipped { grid-template-columns: 1.4fr 1fr; }
.about-image { height: 580px; display: flex; align-items: center; justify-content: center; color: var(--text-muted); text-transform: uppercase; letter-spacing: 2px; position: sticky; top: 100px; overflow: hidden; }
.about-image img { width: 100%; height: 100%; object-fit: contain; }
.about-content p { font-size: 1.05rem; color: var(--text-muted); margin-bottom: 1.75rem; line-height: 1.85; }
.about-content p:first-of-type { font-size: 1.2rem; color: var(--text-light); }

.contact { background: var(--black); color: var(--white); padding: 7rem 4rem; position: relative; overflow: hidden; }
.contact-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 4rem; align-items: center; border: 1px solid #52492b; padding: 3rem; position: relative; overflow: hidden; }
.contact-grid::before { content: 'GET IN TOUCH'; position: absolute; top: -0.7rem; left: 2rem; background: var(--black); padding: 0 1rem; font-size: 0.7rem; font-weight: 700; letter-spacing: 2px; color: #52492b; }
.contact-content h2 { font-size: 2.75rem; font-weight: 900; margin-bottom: 1rem; letter-spacing: -1.5px; }
.contact-content p { font-size: 1.1rem; margin-bottom: 2rem; color: var(--text-muted); }
.contact-form { display: flex; flex-direction: column; gap: 1.25rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.form-group { display: flex; flex-direction: column; gap: 0.5rem; }
.form-group label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--text-light); }
.form-group input, .form-group textarea, .form-group select { padding: 1rem 1.25rem; background: #2B2B2B; border: 1px solid rgba(255,255,255,0.1); color: var(--white); font-family: inherit; font-size: 1rem; transition: all 0.3s ease; width: 100%; max-width: 100%; box-sizing: border-box; }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { outline: none; border-color: #D4AF37; }
.form-group textarea { min-height: 150px; resize: vertical; }
.contact .btn { background: transparent; border: 1px solid rgba(255,255,255,0.3); color: var(--white); align-self: flex-start; margin-top: 0.5rem; }
.contact .btn:hover { border-color: var(--white); background: rgba(255,255,255,0.05); }

footer { padding: 3rem; text-align: center; background: var(--black); border-top: 1px solid rgba(255,255,255,0.05); }
.footer-text { color: var(--text-muted); font-size: 0.8rem; letter-spacing: 0.5px; }

.ticker-bar { position: fixed; bottom: 0; left: 0; right: 0; height: var(--ticker-height); background: #D4AF37; display: flex; align-items: center; overflow: hidden; z-index: 1001; }
.ticker-bar::before, .ticker-bar::after { content: ''; position: absolute; top: 0; bottom: 0; width: 80px; z-index: 2; pointer-events: none; }
.ticker-bar::before { left: 0; background: linear-gradient(to right, #D4AF37 0%, transparent 100%); }
.ticker-bar::after { right: 0; background: linear-gradient(to left, #D4AF37 0%, transparent 100%); }
.ticker-content { display: flex; animation: ticker 55s linear infinite; color: var(--black); will-change: transform; }
.ticker-item { display: flex; align-items: center; padding: 0px 0.7rem; white-space: nowrap; font-weight: 500; font-size: 0.7rem; letter-spacing: 0.5px; }
.ticker-item::before { content: '—'; margin-right: 1rem; font-size: 0.7rem; opacity: 0.25; transform: translateY(1px); }
@keyframes ticker { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

@keyframes revealWord {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes gradientShift {
    0%, 100% { background-position: 0% center; }
    50% { background-position: 100% center; }
}

.fade-in-up { opacity: 0; transform: translateY(50px); transition: opacity 1s var(--ease-out-expo), transform 1s var(--ease-out-expo); }
.fade-in-up.visible { opacity: 1; transform: translateY(0); }
.stagger-1 { transition-delay: 0.15s; } .stagger-2 { transition-delay: 0.3s; } .stagger-3 { transition-delay: 0.45s; } .stagger-4 { transition-delay: 0.6s; }

/* Premium section animations */
.section-title { opacity: 0; transform: translateY(30px); transition: opacity 0.8s var(--ease-out-expo), transform 0.8s var(--ease-out-expo); }
.section-subtitle { opacity: 0; transform: translateY(30px); transition: opacity 0.8s var(--ease-out-expo) 0.15s, transform 0.8s var(--ease-out-expo) 0.15s; }
.section-title.visible, .section-subtitle.visible { opacity: 1; transform: translateY(0); }

/* Podcast content stagger */
.podcast-content h2 { opacity: 0; transform: translateY(25px); transition: opacity 0.8s var(--ease-out-expo), transform 0.8s var(--ease-out-expo); }
.podcast-content .podcast-tagline { opacity: 0; transform: translateY(25px); transition: opacity 0.8s var(--ease-out-expo) 0.1s, transform 0.8s var(--ease-out-expo) 0.1s; }
.podcast-content .btn-group { opacity: 0; transform: translateY(25px); transition: opacity 0.8s var(--ease-out-expo) 0.2s, transform 0.8s var(--ease-out-expo) 0.2s; }
.podcast-content .episode-list { opacity: 0; transform: translateY(25px); transition: opacity 0.8s var(--ease-out-expo) 0.3s, transform 0.8s var(--ease-out-expo) 0.3s; }
.podcast-content.visible h2, .podcast-content.visible .podcast-tagline, .podcast-content.visible .btn-group, .podcast-content.visible .episode-list { opacity: 1; transform: translateY(0); }

/* About content stagger */
.about-content .section-title { transition-delay: 0s; }
.about-content p:nth-of-type(1) { opacity: 0; transform: translateY(20px); transition: opacity 0.7s var(--ease-out-expo) 0.1s, transform 0.7s var(--ease-out-expo) 0.1s; }
.about-content p:nth-of-type(2) { opacity: 0; transform: translateY(20px); transition: opacity 0.7s var(--ease-out-expo) 0.2s, transform 0.7s var(--ease-out-expo) 0.2s; }
.about-content p:nth-of-type(3) { opacity: 0; transform: translateY(20px); transition: opacity: 0.7s var(--ease-out-expo) 0.3s, transform 0.7s var(--ease-out-expo) 0.3s; }
.about-content p:nth-of-type(4) { opacity: 0; transform: translateY(20px); transition: opacity 0.7s var(--ease-out-expo) 0.4s, transform 0.7s var(--ease-out-expo) 0.4s; }
.about-content p:nth-of-type(5) { opacity: 0; transform: translateY(20px); transition: opacity 0.7s var(--ease-out-expo) 0.5s, transform 0.7s var(--ease-out-expo) 0.5s; }
.about-content p:nth-of-type(6) { opacity: 0; transform: translateY(20px); transition: opacity 0.7s var(--ease-out-expo) 0.6s, transform 0.7s var(--ease-out-expo) 0.6s; }
.about-content.visible .section-title, .about-content.visible p { opacity: 1; transform: translateY(0); }

/* Trade Up content stagger */
.trade-up-content h2 { opacity: 0; transform: translateY(25px); transition: opacity 0.8s var(--ease-out-expo), transform 0.8s var(--ease-out-expo); }
.trade-up-content .highlight { opacity: 0; transform: translateY(25px); transition: opacity 0.8s var(--ease-out-expo) 0.1s, transform 0.8s var(--ease-out-expo) 0.1s; }
.trade-up-content > p:not(.highlight) { opacity: 0; transform: translateY(25px); transition: opacity 0.8s var(--ease-out-expo) 0.2s, transform 0.8s var(--ease-out-expo) 0.2s; }
.trade-up-content .trade-progress { opacity: 0; transform: translateY(25px); transition: opacity 0.8s var(--ease-out-expo) 0.3s, transform 0.8s var(--ease-out-expo) 0.3s; }
.trade-up-content .btn-group { opacity: 0; transform: translateY(25px); transition: opacity 0.8s var(--ease-out-expo) 0.4s, transform 0.8s var(--ease-out-expo) 0.4s; }
.trade-up-content.visible h2, .trade-up-content.visible .highlight, .trade-up-content.visible > p, .trade-up-content.visible .trade-progress, .trade-up-content.visible .btn-group { opacity: 1; transform: translateY(0); }

/* Pull quote */
.pull-quote { font-size: 1.5rem; font-weight: 700; font-style: italic; color: var(--white); border-left: 3px solid var(--white); padding-left: 1.5rem; margin: 2rem 0; line-height: 1.5; }

/* Footer social */
.footer-social { display: flex; justify-content: center; gap: 1rem; margin-bottom: 1.5rem; }
.footer-social a { width: 35px; height: 35px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); display: flex; align-items: center; justify-content: center; transition: all 0.4s var(--ease-out-expo); border-radius: 4px; }
.footer-social a img { width: 20px; height: 20px; object-fit: contain; }
.footer-social a.invert img { filter: invert(1); }
.footer-social a:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.3); }

/* Card tag as link */
a.card-tag { text-decoration: none; cursor: pointer; }
a.card-tag:hover { background: rgba(255,255,255,0.05); }

@media (max-width: 1200px) { :root { --sidebar-width: 280px; } .hero-content h1 { font-size: 3.5rem; } .hero-image { height: 520px; } .group-card { flex: 0 0 280px; } .carousel-arrow { width: 35px; height: 35px; font-size: 1.25rem; } section { padding: 5rem 3rem; } .contact-grid { grid-template-columns: 1fr; } }
@media (max-width: 1024px) { .sidebar { display: none; } .main-content { margin-left: 0; } nav { justify-content: space-between; } .nav-burger { display: block; } .nav-links { position: fixed; top: 0; right: -100%; width: 280px; height: 100vh; background: var(--grey-dark); flex-direction: column; justify-content: center; align-items: center; gap: 2rem; transition: right 0.3s ease; padding: 2rem; } .nav-links.active { right: 0; } .nav-links a { font-size: 1rem; } .hero { grid-template-columns: 1fr; text-align: center; min-height: auto; padding-top: 5rem; } .hero-content p { margin: 0 auto 2.5rem; } .hero-image { height: 420px; } .podcast-grid, .trade-up-grid, .about-grid { grid-template-columns: 1fr; } .about-image { position: relative; top: 0; height: 420px; } .ticker-label { display: none; } .form-row { grid-template-columns: 1fr; } .carousel-container::before, .carousel-container::after { width: 60px; } .carousel-arrow { width: 40px; height: 80px; font-size: 1.5rem; } .carousel-arrow-left { padding-left: 10px; } .carousel-arrow-right { padding-right: 10px; } .group-carousel { padding: 20px 50px; } }
@media (max-width: 768px) { section { padding: 4rem 1.5rem; } nav { padding: 1rem 1.5rem; } .nav-links { gap: 1.5rem; } .nav-links a { font-size: 0.7rem; } .hero { padding: 3rem 1.5rem; } .hero-content h1 { font-size: 2.75rem; } .hero-image { height: 350px; } .group-card { flex: 0 0 260px; } .carousel-container::before, .carousel-container::after { width: 40px; } .carousel-arrow { width: 30px; height: 60px; font-size: 1.25rem; } .carousel-arrow-left { padding-left: 8px; } .carousel-arrow-right { padding-right: 8px; } .group-carousel { padding: 20px 35px; } .btn-group { flex-direction: column; align-items: center; } .btn-group-inline { flex-wrap: wrap; justify-content: center; } .btn-icon { justify-content: center; } .trade-up-content { text-align: center; } .trade-up-content .btn-group { align-items: stretch; } .podcast-image, .trade-up-image { height: 320px; } .section-title, .contact-content h2 { font-size: 2rem; } .contact { padding: 3rem 1rem; } .contact-grid { padding: 1.5rem; gap: 2rem; } .contact-grid::before { left: 1rem; font-size: 0.6rem; } }

.thought-text a, .thought-text a:visited, .thought-text a:hover, .thought-text a:active, .stealth-link, .stealth-link:visited, .stealth-link:hover, .stealth-link:active { color: inherit !important; text-decoration: none !important; border-bottom: none !important; }