/* --- RESET & VARIABLES --- */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

:root {
    --bg-dark: #030d22;
    --bg-glow: #081a36;
    --text-white: #ffffff;
    --text-muted: #abb7c9;
    --btn-blue: #2c66ff;
    --btn-blue-hover: #1a52e0;
    --grid-color: rgba(255, 255, 255, 0.03);
    --pill-gradient: linear-gradient(90deg, #3b82f6 0%, #8b5cf6 50%, #ec4899 100%);
    
    /* Component Color Profiles */
    --search-btn: #4862f4;
    --search-btn-hover: #374fd6;
    --tag-bg: rgba(255, 255, 255, 0.05);
    --tag-text: #cbd5e1;
    --spotlight-blue: #79a3ff;
    --spotlight-brand: #437ef7;
    
    /* Blue Neon Divider Spec */
    --neo-divider-glow: rgba(44, 102, 255, 0.4);
}

body {
    background-color: var(--bg-dark);
    background-image: 
        radial-gradient(circle at 50% 20%, var(--bg-glow) 0%, transparent 60%),
        linear-gradient(var(--grid-color) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid-color) 1px, transparent 1px);
    background-size: 100% 100%, 80px 80px, 80px 80px;
    color: var(--text-white);
    min-height: 100vh;
    overflow-x: hidden;
}

/* --- GLOBAL BLUE NEO DIVIDER --- */
.neo-divider {
    height: 1px;
    width: 100%;
    background: linear-gradient(90deg, transparent 0%, rgba(44, 102, 255, 0.3) 20%, rgba(44, 102, 255, 0.6) 50%, rgba(44, 102, 255, 0.3) 80%, transparent 100%);
    box-shadow: 0 1px 8px var(--neo-divider-glow);
    margin: 60px auto;
    max-width: 1400px;
}

/* --- HEADER SECTION --- */
.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 40px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

.logo {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.5px;
    color: var(--text-white);
    text-decoration: none;
}

.logo span {
    color: var(--spotlight-blue);
    font-weight: 400;
}

.nav-links {
    display: flex;
    gap: 24px;
    align-items: center;
    list-style: none;
}

.nav-links a {
    color: var(--text-muted);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.2s;
    display: flex;
    align-items: center;
    gap: 4px;
}

.nav-links a:hover { color: var(--text-white); }
.nav-links .dropdown-arrow::after { content: '▾'; font-size: 10px; color: var(--text-muted); }

.header-actions {
    display: flex;
    align-items: center;
    gap: 20px;
}

.lang-select { color: var(--text-muted); font-size: 14px; cursor: pointer; }
.btn-login { color: var(--text-white); text-decoration: none; font-size: 14px; font-weight: 600; }

.btn-sm-primary {
    background-color: var(--btn-blue);
    color: var(--text-white);
    padding: 8px 16px;
    border-radius: 20px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    transition: background 0.2s;
}
.btn-sm-primary:hover { background-color: var(--btn-blue-hover); }

.menu-toggle {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    background: none;
    border: none;
}
.menu-toggle span { display: block; width: 25px; height: 2px; background-color: var(--text-white); }

/* --- HERO & INTEGRATED DARK SEARCH SECTION --- */
.hero {
    max-width: 900px;
    margin: 60px auto 0 auto;
    text-align: center;
    padding: 0 20px;
}

.ratings-container {
    display: flex;
    justify-content: center;
    gap: 24px;
    margin-bottom: 30px;
    flex-wrap: wrap;
    font-size: 12px;
    font-weight: 600;
}
.rating-item { display: flex; align-items: center; gap: 6px; }
.stars { color: #00b67a; }
.g2-stars { color: #ff4b2b; }
.cap-stars { color: #ff9a00; }

.promo-pill {
    display: inline-flex;
    align-items: center;
    padding: 8px 20px;
    border-radius: 30px;
    background: var(--pill-gradient);
    color: var(--text-white);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    margin-bottom: 40px;
    box-shadow: 0 4px 20px rgba(139, 92, 246, 0.3);
    transition: transform 0.2s;
}
.promo-pill:hover { transform: translateY(-2px); }
.promo-pill span { margin-right: 6px; }

.hero h1 {
    font-size: 64px;
    font-weight: 700;
    letter-spacing: -1.5px;
    line-height: 1.1;
    margin-bottom: 24px;
}

.hero p.hero-subtitle {
    color: var(--text-muted);
    font-size: 18px;
    line-height: 1.6;
    max-width: 760px;
    margin: 0 auto 40px auto;
}

.search-container {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(8px);
    border-radius: 16px;
    padding: 8px 8px 8px 20px;
    display: flex;
    align-items: center;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3);
    margin: 0 auto 24px auto;
    max-width: 760px;
}

.search-input-wrapper { display: flex; align-items: center; flex: 1; }
.search-icon { color: #abb7c9; margin-right: 14px; display: flex; align-items: center; }
.search-input { border: none; outline: none; width: 100%; font-size: 16px; color: var(--text-white); background: transparent; }
.search-input::placeholder { color: #5a6e85; }

.btn-search {
    background-color: var(--search-btn);
    color: var(--text-white);
    border: none;
    outline: none;
    padding: 14px 36px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 0.2s;
}
.btn-search:hover { background-color: var(--search-btn-hover); }

.popular-tags-container { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; }
.popular-title { font-size: 12px; font-weight: 700; color: #718096; text-transform: uppercase; letter-spacing: 0.8px; }

.tag-pill {
    background-color: var(--tag-bg);
    color: var(--tag-text);
    border: 1px solid rgba(255, 255, 255, 0.05);
    padding: 8px 18px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: transform 0.2s, background-color 0.2s, color 0.2s;
}
.tag-pill:hover { transform: translateY(-1px); background-color: rgba(255, 255, 255, 0.1); color: #fff; }
.search-footer-text { font-size: 13px; color: #718096; text-align: center; }

/* --- PROFILE SHOWCASE SECTION --- */
.profile-section {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

.profile-section-tag { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: #718096; display: block; text-align: center; margin-bottom: 14px; }
.profile-section-title { font-size: 34px; font-weight: 600; margin-bottom: 40px; color: var(--text-white); letter-spacing: -0.5px; text-align: center; }
.profile-section-title span { color: var(--spotlight-blue); }

.profile-card-wrapper {
    width: 100%;
}

.profile-card {
    background: linear-gradient(135deg, rgba(8, 26, 54, 0.6) 0%, rgba(3, 13, 34, 0.8) 100%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 24px;
    padding: 40px;
    display: flex;
    flex-direction: row;
    gap: 48px;
    align-items: center;
    position: relative;
    z-index: 1;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.4);
}

.profile-left-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    padding-right: 40px;
}

.profile-right-col {
    flex: 1.5;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.profile-avatar-box {
    width: 130px;
    height: 130px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid rgba(76, 210, 255, 0.3);
    margin-bottom: 20px;
    background-color: #1a202c;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

.profile-avatar-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hire-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(0, 230, 118, 0.1);
    border: 1px solid rgba(0, 230, 118, 0.3);
    color: #00e676;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 16px;
}

.hire-dot {
    width: 8px;
    height: 8px;
    background-color: #00e676;
    border-radius: 50%;
    box-shadow: 0 0 8px #00e676;
}

.profile-name { font-size: 26px; font-weight: 700; color: #4cd2ff; margin-bottom: 6px; }
.profile-role { font-size: 16px; color: var(--text-white); font-weight: 500; margin-bottom: 8px; }

.profile-location {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: #718096;
    margin-bottom: 24px;
}
.profile-location svg { color: #ff4d4d; }

.profile-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    width: 100%;
    gap: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    padding-bottom: 24px;
    margin-bottom: 24px;
}

.stat-box { display: flex; flex-direction: column; align-items: center; }
.stat-val { font-size: 22px; font-weight: 700; color: var(--text-white); margin-bottom: 4px; }
.stat-lbl { font-size: 12px; color: #718096; text-transform: capitalize; }

.skills-block {
    margin-bottom: 28px;
}

.skills-header {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #718096;
    margin-bottom: 14px;
    text-align: left;
}

.skills-grid-matrix {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.profile-skill-tag {
    font-size: 13px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    padding: 6px 14px;
    border-radius: 6px;
    font-weight: 500;
}

.profile-socials-row {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.social-bubble {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffffff;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}
.social-bubble:hover { transform: translateY(-4px); }

.sb-facebook  { background: #1877f2; box-shadow: 0 4px 14px rgba(24, 119, 242, 0.4); }
.sb-twitter   { background: #1da1f2; box-shadow: 0 4px 14px rgba(29, 161, 242, 0.4); }
.sb-instagram { background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); box-shadow: 0 4px 14px rgba(220, 39, 67, 0.4); }
.sb-behance   { background: #0057ff; box-shadow: 0 4px 14px rgba(0, 87, 255, 0.4); }
.sb-github    { background: #24292e; box-shadow: 0 4px 14px rgba(36, 41, 46, 0.4); border: 1px solid rgba(255,255,255,0.1); }
.sb-dribbble  { background: #ea4c89; box-shadow: 0 4px 14px rgba(234, 76, 137, 0.4); }
.sb-link      { background: #e11d48; box-shadow: 0 4px 14px rgba(225, 29, 72, 0.4); }

.profile-actions-row {
    display: flex;
    gap: 14px;
    width: 100%;
    margin-top: auto;
}

.btn-profile-act {
    flex: 1;
    padding: 14px 24px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    text-align: center;
    transition: transform 0.2s, opacity 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.btn-profile-act:hover { transform: translateY(-2px); }

.act-email { background: linear-gradient(90deg, #1d92e6 0%, #0066cc 100%); color: #ffffff; box-shadow: 0 6px 20px rgba(0, 102, 204, 0.3); }
.act-whatsapp { background: linear-gradient(90deg, #e11d48 0%, #be123c 100%); color: #ffffff; box-shadow: 0 6px 20px rgba(190, 18, 60, 0.3); }

/* --- SUPPORT SECTION --- */
.support-section {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

.support-content { flex: 1; max-width: 520px; }
.support-tag { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: #718096; display: block; margin-bottom: 14px; }
.support-title { font-size: 42px; font-weight: 700; line-height: 1.2; margin-bottom: 20px; color: var(--text-white); letter-spacing: -0.8px; }
.support-desc { color: var(--text-muted); font-size: 16px; line-height: 1.6; margin-bottom: 32px; }

.support-list { list-style: none; display: flex; flex-direction: column; gap: 16px; }
.support-item { display: flex; align-items: center; gap: 14px; font-size: 16px; color: #cbd5e1; font-weight: 500; }
.check-icon-circle { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: rgba(44, 102, 255, 0.16); color: #558cff; flex-shrink: 0; }

.support-graphic-side { flex: 1; display: flex; justify-content: center; align-items: center; position: relative; min-height: 440px; }
.graphic-glow-container { position: relative; width: 360px; height: 360px; border-radius: 50%; background: radial-gradient(circle, rgba(44, 102, 255, 0.15) 0%, transparent 70%); display: flex; justify-content: center; align-items: center; }
.graphic-glow-container::before { content: ''; position: absolute; width: 100%; height: 100%; border: 1px dashed rgba(44, 102, 255, 0.25); border-radius: 50%; animation: spin 45s linear infinite; }
@keyframes spin { 100% { transform: rotate(360deg); } }

.representative-window-box {
    position: relative;
    width: 260px;
    height: 310px;
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(8, 26, 54, 0.8) 0%, rgba(3, 13, 34, 0.95) 100%);
    border: 2px solid rgba(44, 102, 255, 0.4);
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5), 0 0 30px rgba(44, 102, 255, 0.2);
    z-index: 2;
    overflow: hidden;
}

.representative-window-box img { width: 100%; height: 100%; object-fit: cover; display: block; }
.widget-live-badge { position: absolute; top: 16px; left: 16px; background: rgba(3, 13, 34, 0.8); backdrop-filter: blur(8px); border: 1px solid rgba(255, 255, 255, 0.1); padding: 6px 12px; border-radius: 30px; display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; color: #ffffff; text-transform: uppercase; letter-spacing: 0.5px; z-index: 3; }
.live-pulse-dot { width: 6px; height: 6px; background-color: #00e676; border-radius: 50%; box-shadow: 0 0 8px #00e676; animation: live-pulse-glow 1.8s infinite; }
@keyframes live-pulse-glow { 0% { transform: scale(0.9); opacity: 0.6; } 50% { transform: scale(1.2); opacity: 1; } 100% { transform: scale(0.9); opacity: 0.6; } }
.floating-chat-accent { position: absolute; bottom: -12px; right: -12px; width: 52px; height: 52px; background: var(--btn-blue); border-radius: 50%; display: flex; justify-content: center; align-items: center; color: #ffffff; box-shadow: 0 10px 25px rgba(44, 102, 255, 0.4); border: 3px solid var(--bg-dark); z-index: 4; }

/* --- BRIGHT INITIATIVE SECTION --- */
.initiative-section { max-width: 1200px; margin: 0 auto; padding: 0 40px; }
.initiative-top-block { display: flex; justify-content: space-between; align-items: flex-start; gap: 60px; margin-bottom: 60px; }
.initiative-brand-box { flex: 1; max-width: 440px; }
.initiative-logo { font-size: 44px; font-weight: 700; line-height: 0.95; letter-spacing: -1.5px; color: #ffffff; margin-bottom: 24px; }
.initiative-logo span { color: #437ef7; display: block; }
.initiative-desc { font-size: 16px; line-height: 1.6; color: #cbd5e1; }
.initiative-vertical-line { width: 1px; align-self: stretch; background: rgba(255, 255, 255, 0.1); }

.initiative-stats-panel { flex: 1.3; display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 24px; }
.stat-node { display: flex; flex-direction: column; }
.stat-number { font-size: 26px; font-weight: 700; color: #ffffff; margin-bottom: 4px; font-family: Georgia, serif; }
.stat-label { font-size: 14px; line-height: 1.4; color: #718096; font-weight: 500; }
.stat-node.link-node { justify-content: flex-start; padding-top: 4px; }
.initiative-learn-more { font-size: 15px; font-weight: 600; color: var(--btn-blue); text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.initiative-learn-more:hover { color: #ffffff; }

.initiative-logos-matrix { display: grid; grid-template-columns: repeat(7, 1fr); gap: 32px 20px; align-items: center; justify-items: center; opacity: 0.55; transition: opacity 0.3s; margin-top: 40px; }
.initiative-logos-matrix:hover { opacity: 0.85; }
.corp-logo-item { display: flex; justify-content: center; align-items: center; width: 100%; max-width: 140px; }
.corp-logo-item img { max-height: 38px; max-width: 100%; width: auto; height: auto; object-fit: contain; display: block; }
.corp-logo-item.bordered-logo { border-left: 1px solid rgba(255, 255, 255, 0.3); padding-left: 20px; max-width: 160px; }

/* --- SECURITY & PRIVACY SECTION --- */
.security-section { max-width: 1240px; margin: 0 auto; padding: 0 40px; text-align: center; }
.security-title { font-size: 30px; font-weight: 500; color: #cbd5e1; margin-bottom: 45px; letter-spacing: -0.5px; }

.security-container {
    background: linear-gradient(135deg, rgba(8, 26, 54, 0.4) 0%, rgba(3, 13, 34, 0.6) 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 50px 40px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    text-align: left;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
}

.security-item-box { display: flex; flex-direction: column; gap: 22px; }
.security-shield-icon { color: #2c66ff; display: flex; align-items: center; }
.security-text { font-size: 15px; line-height: 1.6; color: #abb7c9; }
.security-text strong { color: #ffffff; font-weight: 700; }

/* --- INTEGRATIONS SECTION --- */
.integrations-section { max-width: 1200px; margin: 0 auto; padding: 0 20px; text-align: center; }
.integrations-tag { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: #718096; display: block; margin-bottom: 14px; }
.integrations-title { font-size: 34px; font-weight: 600; line-height: 1.25; color: var(--text-white); max-width: 800px; margin: 0 auto 50px auto; letter-spacing: -0.8px; }

.integrations-display-wrapper { display: flex; flex-direction: column; gap: 20px; align-items: center; justify-content: center; }
.integration-row { display: flex; justify-content: center; align-items: center; gap: 16px; width: 100%; flex-wrap: wrap; }
.integration-row.tier-background { opacity: 0.2; transform: scale(0.85); }
.integration-row.tier-midground { opacity: 0.45; transform: scale(0.92); }
.integration-row.tier-foreground { opacity: 1; transform: scale(1); margin-top: 5px; }

.app-icon-card { background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 100%); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 12px; width: 54px; height: 54px; display: flex; justify-content: center; align-items: center; padding: 8px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4); transition: transform 0.2s, border-color 0.2s; }
.app-icon-card img { width: 100%; height: 100%; object-fit: contain; border-radius: 4px; }
.tier-foreground .app-icon-card:hover { transform: translateY(-6px); border-color: rgba(44, 102, 255, 0.6); box-shadow: 0 12px 24px rgba(44, 102, 255, 0.2); }

/* --- FIRST FOOTER --- */
.first-footer { max-width: 1400px; margin: 0 auto; padding: 0 40px 20px 40px; display: grid; grid-template-columns: repeat(5, 1fr) 1.2fr; gap: 40px 24px; }
.footer-column { display: flex; flex-direction: column; }
.footer-block-chunk { margin-bottom: 35px; }
.footer-block-chunk:last-child { margin-bottom: 0; }
.footer-header { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.8px; color: #718096; margin-bottom: 18px; }

.footer-links-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-links-list a { font-size: 14px; color: #cbd5e1; text-decoration: none; transition: color 0.15s ease; line-height: 1.4; display: inline-block; }
.footer-links-list a:hover { color: #ffffff; }

.footer-sidebar-panel { display: flex; flex-direction: column; padding-left: 20px; }
.sidebar-icon-row { display: flex; align-items: center; gap: 16px; margin-bottom: 30px; flex-wrap: wrap; }
.sidebar-icon-link { color: #cbd5e1; transition: color 0.2s, transform 0.2s; display: inline-flex; align-items: center; }
.sidebar-icon-link:hover { color: #437ef7; transform: translateY(-2px); }

.location-address-box { margin-top: auto; display: flex; gap: 10px; align-items: flex-start; color: #718096; font-size: 12px; line-height: 1.5; max-width: 240px; }
.location-pin-icon { color: #437ef7; flex-shrink: 0; margin-top: 2px; }

/* --- FINAL FOOTER --- */
.final-footer { max-width: 1400px; margin: 0 auto; padding: 0 40px 40px 40px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 24px; }
.final-footer-left { display: flex; align-items: center; gap: 12px; font-size: 14px; color: #718096; }
.final-footer-left a { color: #cbd5e1; text-decoration: none; transition: color 0.2s; }
.final-footer-left a:hover { color: #ffffff; }
.bullet-separator { color: #4a5568; user-select: none; }

.final-footer-center { display: flex; align-items: center; gap: 20px; }
.tp-widget { display: flex; flex-direction: column; align-items: center; text-align: center; }
.tp-title-text { font-size: 15px; font-weight: 700; color: #ffffff; margin-bottom: 4px; letter-spacing: -0.2px; }

.tp-star-matrix { display: flex; gap: 2px; margin-bottom: 4px; }
.tp-star-box { background-color: #00b67a; color: #ffffff; width: 18px; height: 18px; display: inline-flex; justify-content: center; align-items: center; font-size: 11px; font-weight: 700; }
.tp-star-box.faded-box { background-color: #4a5568; }
.tp-footer-label { font-size: 11px; color: #718096; font-weight: 500; letter-spacing: 0.5px; }

.final-vertical-pipe { width: 1px; height: 40px; background-color: rgba(255, 255, 255, 0.15); }
.score-metrics-box { display: flex; flex-direction: column; }
.score-headline { font-size: 18px; font-weight: 700; color: #ffffff; }
.score-subtext { font-size: 12px; color: #718096; font-weight: 500; }

.final-footer-right { display: flex; align-items: center; gap: 20px; }
.social-media-link { color: #cbd5e1; transition: color 0.2s, transform 0.15s; display: inline-flex; align-items: center; }
.social-media-link:hover { color: #ffffff; transform: scale(1.1); }

/* --- FAQ ACCORDION SECTION DESIGN SYSTEM --- */
.faq-section {
    max-width: 860px;
    margin: 0 auto;
    padding: 0 20px;
}

.faq-title { 
    font-size: 34px; 
    font-weight: 600; 
    color: var(--text-white); 
    text-align: center; 
    margin-bottom: 45px; 
    letter-spacing: -0.5px; 
}

.faq-accordion-group { 
    display: flex; 
    flex-direction: column; 
    gap: 16px; 
}

.faq-node-item {
    background: linear-gradient(135deg, rgba(8, 26, 54, 0.4) 0%, rgba(3, 13, 34, 0.6) 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    overflow: hidden;
    transition: border-color 0.2s;
}
.faq-node-item:hover { border-color: rgba(44, 102, 255, 0.3); }

.faq-node-item summary {
    padding: 22px 28px;
    font-size: 16px;
    font-weight: 600;
    color: #cbd5e1;
    cursor: pointer;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    user-select: none;
}
.faq-node-item summary::-webkit-details-marker { display: none; }

.faq-node-item summary::after {
    content: '+';
    font-size: 20px;
    font-weight: 400;
    color: var(--btn-blue);
    transition: transform 0.2s ease, color 0.2s;
}

.faq-node-item[open] summary { color: #ffffff; }
.faq-node-item[open] summary::after { transform: rotate(45deg); color: #e11d48; }

.faq-expanded-content {
    padding: 0 28px 24px 28px;
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-muted);
    border-top: 1px solid rgba(255, 255, 255, 0.03);
    padding-top: 18px;
}

.about-text-paragraph {
    font-size: 14px;
    line-height: 1.6;
    color: #cbd5e1;
    margin-bottom: 24px;
    text-align: left;
}

@media (max-width: 540px) {
    .faq-node-item summary { padding: 18px 20px; font-size: 15px; }
    .faq-expanded-content { padding: 0 20px 20px 20px; }
}

/* ==========================================================================
   PRIVATE PORTFOLIO DOMAINS GRID DESIGN SYSTEM (HIGH-TECH OVERHAUL)
   ========================================================================== */
.domains-section {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
}

.domains-header-container {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 36px;
    flex-wrap: wrap;
    gap: 20px;
}

.domains-super-tag {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #5a6e85;
    display: block;
    margin-bottom: 8px;
}

.domains-main-heading {
    font-size: 32px;
    font-weight: 700;
    color: var(--text-white);
    letter-spacing: -0.5px;
}

.domains-main-heading .counter-highlight {
    color: #4862f4;
}

.domains-filter-block {
    display: flex;
    gap: 12px;
}

.domains-filter-select {
    background-color: #0b1426;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #cbd5e1;
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    outline: none;
    cursor: pointer;
    min-width: 140px;
    transition: border-color 0.2s;
}

.domains-filter-select:focus {
    border-color: var(--btn-blue);
}

/* 4-Column Grid Array Layout */
.domains-portfolio-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

/* Technological Cyber Card Base Frame */
.domain-sale-card { 
    background: linear-gradient(135deg, #091324 0%, #040a17 100%); 
    border: 1px solid rgba(0, 242, 254, 0.15); 
    border-radius: 14px; 
    padding: 24px; 
    position: relative; 
    display: flex; 
    flex-direction: column; 
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4), inset 0 0 15px rgba(0, 242, 254, 0.02); 
    cursor: pointer;
    overflow: hidden;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), 
                box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1), 
                border-color 0.2s ease; 
}

/* Futuristic Tech-Line Accent at the Top Edge */
.domain-sale-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 32px;
    height: 2px;
    background: #00f2fe;
    box-shadow: 0 0 8px #00f2fe;
}

/* High-Tech Glowing Hover Effect */
.domain-sale-card:hover {
    transform: translateY(-6px);
    border-color: #00f2fe;
    box-shadow: 0 12px 24px rgba(0, 242, 254, 0.15), 
                0 0 20px rgba(0, 242, 254, 0.25);
}

.card-star-icon {
    position: absolute;
    top: 20px;
    right: 24px;
    color: var(--accent-gold);
    font-size: 18px;
    line-height: 1;
    z-index: 2;
}

/* Pushes subtitle to the top layout slot safely via CSS Flex Order */
.card-domain-sub {
    order: 1;
    font-size: 13px;
    color: #5a6e85;
    margin-bottom: 14px;
    text-transform: capitalize;
    letter-spacing: 0.5px;
}

/* Flat Horizontal Tech Ribbon Layout */
.card-domain-name {
    order: 2;
    font-size: 21px;
    font-weight: 700;
    color: var(--text-white);
    background: linear-gradient(90deg, rgba(0, 242, 254, 0) 0%, rgba(0, 242, 254, 0.08) 50%, rgba(0, 242, 254, 0) 100%);
    border-top: 1px solid rgba(0, 242, 254, 0.25);
    border-bottom: 1px solid rgba(0, 242, 254, 0.25);
    margin: 0 -24px 20px -24px;
    padding: 12px 24px;
    text-align: center;
    position: relative;
    letter-spacing: -0.3px;
}

/* Ribbon Geometric Tech Graphics (Left & Right Flanks) */
.card-domain-name::before {
    content: '►';
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 9px;
    color: rgba(0, 242, 254, 0.6);
}

.card-domain-name::after {
    content: '◄';
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 9px;
    color: rgba(0, 242, 254, 0.6);
}

.card-tags-row {
    order: 3;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 28px;
}

/* Transparent Neon Framework Tags */
.card-tag {
    font-size: 11px;
    font-weight: 600;
    background: transparent;
    padding: 5px 12px;
    border-radius: 6px;
    text-transform: capitalize;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

/* Unique Neon Color Rules Assigned Automatically by tag order positions */
.card-tag:nth-child(1) { border-color: rgba(168, 85, 247, 0.4); color: #c084fc; text-shadow: 0 0 4px rgba(168, 85, 247, 0.2); } /* Purple (Fintech) */
.card-tag:nth-child(2) { border-color: rgba(234, 179, 8, 0.4); color: #fde047; text-shadow: 0 0 4px rgba(234, 179, 8, 0.2); }  /* Gold (Premium) */
.card-tag:nth-child(3) { border-color: rgba(6, 182, 212, 0.4); color: #22d3ee; text-shadow: 0 0 4px rgba(6, 182, 212, 0.2); }  /* Cyan (Brandable) */
.card-tag:nth-child(4) { border-color: rgba(59, 130, 246, 0.4); color: #60a5fa; text-shadow: 0 0 4px rgba(59, 130, 246, 0.2); }  /* Blue (Asset) */

.card-meta-row {
    order: 4;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
}

/* Distinct High-Contrast Metallic/Silver Price Profile */
.card-price {
    font-size: 22px;
    font-weight: 700;
    color: #e2e8f0;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
}

/* Cyber-Styled Availability Badge Button */
.card-status-badge {
    font-size: 11px;
    font-weight: 700;
    color: #00f2fe;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid rgba(0, 242, 254, 0.3);
    background: rgba(0, 242, 254, 0.04);
    padding: 5px 14px;
    border-radius: 20px;
    box-shadow: inset 0 0 6px rgba(0, 242, 254, 0.1);
}

/* --- RESPONSIVE INVENTORY MEDIA BREAKPOINTS --- */
@media (max-width: 1200px) {
    .domains-portfolio-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
    .domains-portfolio-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .domains-header-container { flex-direction: column; align-items: flex-start; gap: 16px; }
    .domains-filter-block { width: 100%; }
    .domains-filter-select { flex: 1; }
}

@media (max-width: 540px) {
    .domains-portfolio-grid { grid-template-columns: 1fr; gap: 16px; }
    .domains-section { padding: 0 20px; }
    .card-domain-name { font-size: 19px; }
}

/* ==========================================================================
   MODULE STYLES: DOMAIN DETAIL WORKSPACE
   ========================================================================== */
.detail-main-wrapper {
    max-width: 1400px;
    margin: 40px auto 0 auto;
    padding: 0 40px;
    display: flex;
    gap: 48px;
    align-items: flex-start;
}

.detail-showcase-panel {
    flex: 1.3;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.detail-hero-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 70px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4);
}

.detail-domain-display {
    font-size: 54px;
    font-weight: 800;
    color: #030d22;
    letter-spacing: -1.5px;
    text-align: center;
    word-break: break-all;
}

.detail-badge-row {
    position: absolute;
    top: 20px;
    left: 20px;
    display: flex;
    gap: 10px;
}

.detail-premium-pill {
    background: rgba(44, 102, 255, 0.1);
    border: 1px solid rgba(44, 102, 255, 0.2);
    color: #2c66ff;
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-pitch-box {
    background: linear-gradient(135deg, rgba(8, 26, 54, 0.6) 0%, rgba(3, 13, 34, 0.8) 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    padding: 32px;
}

.pitch-title {
    font-size: 20px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 12px;
}

.pitch-desc {
    font-size: 15px;
    line-height: 1.6;
    color: #abb7c9;
    margin-bottom: 24px;
}

.value-bullets-list {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.value-bullet-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #cbd5e1;
    font-weight: 500;
}

.value-bullet-item span {
    color: #00e676;
    font-weight: bold;
}

/* Right Column Purchase Core Panel */
.detail-transaction-panel {
    flex: 1;
    background: #091324;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.3);
    position: sticky;
    top: 40px;
}

.tab-controls-header {
    display: flex;
    background: rgba(0, 0, 0, 0.2);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.tab-trigger-btn {
    flex: 1;
    padding: 18px;
    background: none;
    border: none;
    color: #5a6e85;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.tab-trigger-btn.active-tab {
    color: #ffffff;
    background: #091324;
    border-bottom: 2px solid var(--btn-blue);
}

.tab-body-viewport {
    padding: 32px;
}

.tab-pane-content {
    display: none;
}

.tab-pane-content.active-pane {
    display: block;
}

.price-headline-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 24px;
}

.price-label { font-size: 12px; color: #5a6e85; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }
.price-value-amount { font-size: 36px; font-weight: 800; color: #ffb800; }

.lease-calculator-card {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 28px;
}

.lease-title-line {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 6px;
}

.lease-install-value { color: #00e676; font-weight: 700; }
.lease-subtext { font-size: 12px; color: #5a6e85; }

.transaction-form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 20px;
}

.transaction-form-group label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    color: #5a6e85;
    letter-spacing: 0.5px;
}

.transaction-input-field {
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 14px 18px;
    border-radius: 8px;
    color: #ffffff;
    font-size: 15px;
    outline: none;
    transition: border-color 0.2s;
}
.transaction-input-field:focus { border-color: var(--btn-blue); }

.escrow-trust-footer-line {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #5a6e85;
    margin-top: 24px;
    font-weight: 600;
}

/* Responsive Handling Breaks */
@media (max-width: 992px) {
    .detail-main-wrapper { flex-direction: column; padding: 0 20px; gap: 32px; }
    .detail-transaction-panel { width: 100%; position: relative; top: 0; }
    .detail-showcase-panel { width: 100%; }
}

@media (max-width: 540px) {
    .detail-hero-card { padding: 40px 20px; }
    .detail-domain-display { font-size: 34px; }
    .value-bullets-list { grid-template-columns: 1fr; gap: 12px; }
    .tab-body-viewport { padding: 24px 20px; }
}

/* ==========================================================================
   MODULE STYLES: SCREENSHOT-MATCHING DOMAIN DETAIL SYSTEM
   ========================================================================== */
.detail-container-frame {
    max-width: 1400px;
    margin: 30px auto 0 auto;
    padding: 0 40px;
    display: flex;
    flex-direction: column;
}

.back-portfolio-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #abb7c9;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 24px;
    width: fit-content;
    transition: color 0.2s ease;
}
.back-portfolio-link:hover { color: #ffffff; }

.detail-split-layout {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    width: 100%;
}

/* Left Showcase Panel Configuration */
.asset-showcase-card {
    flex: 1.8;
    background: #061022;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 14px;
    padding: 48px;
    display: flex;
    flex-direction: column;
}

.asset-status-pill {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    color: #00e676;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    border: 1px solid rgba(0, 230, 118, 0.3);
    background: rgba(0, 230, 118, 0.06);
    padding: 6px 14px;
    border-radius: 20px;
    margin-bottom: 32px;
}

.asset-title-text {
    font-size: 48px;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.5px;
    margin-bottom: 12px;
}

.asset-subtitle-text {
    font-size: 16px;
    color: #abb7c9;
    margin-bottom: 24px;
}

.asset-tags-container {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.asset-pill-tag {
    font-size: 12px;
    font-weight: 600;
    color: #abb7c9;
    background: rgba(255, 255, 255, 0.05);
    padding: 6px 14px;
    border-radius: 6px;
}

.asset-pill-tag.tag-blue {
    background: rgba(44, 102, 255, 0.15);
    color: #6392ff;
}

.asset-divider-line {
    height: 1px;
    background: rgba(255, 255, 255, 0.06);
    margin: 40px 0;
    width: 100%;
}

.asset-section-title {
    font-size: 20px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 16px;
}

.asset-description-text {
    font-size: 16px;
    line-height: 1.6;
    color: #cbd5e1;
    margin-bottom: 40px;
}

/* 3-Column Bottom Modules */
.asset-trust-features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.trust-feature-item {
    background: rgba(255, 255, 255, 0.01);
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 12px;
    padding: 24px;
    display: flex;
    flex-direction: column;
}

.trust-feature-icon {
    margin-bottom: 16px;
    display: flex;
}

.trust-feature-title {
    font-size: 15px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 6px;
}

.trust-feature-desc {
    font-size: 13px;
    color: #718096;
    line-height: 1.4;
}

/* Right Checkout Inquiry Form Panel Configuration */
.transaction-hub-card {
    flex: 1;
    background: #061022;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 14px;
    padding: 40px 32px;
    display: flex;
    flex-direction: column;
}

.hub-price-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    color: #718096;
    letter-spacing: 0.8px;
    margin-bottom: 12px;
    display: block;
}

.hub-price-value {
    font-size: 40px;
    font-weight: 800;
    color: #6da2ff;
    letter-spacing: -0.5px;
    margin-bottom: 28px;
    line-height: 1;
}

.hub-action-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.hub-form-group {
    width: 100%;
}

.hub-select-menu {
    width: 100%;
    background: #091324;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 14px 18px;
    color: #cbd5e1;
    font-size: 15px;
    font-weight: 500;
    outline: none;
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23718096' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'></polyline></svg>");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 16px;
}
.hub-select-menu:focus { border-color: var(--btn-blue); }

.hub-input-element,
.hub-textarea-element {
    width: 100%;
    background: #091324;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    padding: 14px 18px;
    color: #ffffff;
    font-size: 14px;
    outline: none;
    transition: border-color 0.2s ease;
}
.hub-input-element::placeholder,
.hub-textarea-element::placeholder { color: #42526e; }
.hub-input-element:focus,
.hub-textarea-element:focus { border-color: var(--btn-blue); background: rgba(0,0,0,0.1); }

.hub-textarea-element { resize: none; }

.hub-submit-btn {
    width: 100%;
    background: #2c66ff;
    color: #ffffff;
    border: none;
    border-radius: 8px;
    padding: 16px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(44, 102, 255, 0.3);
    transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}
.hub-submit-btn:hover {
    transform: translateY(-2px);
    background-color: #3b71ff;
    box-shadow: 0 6px 20px rgba(44, 102, 255, 0.4);
}

/* ==========================================================================
   DETAIL SYSTEM RESPONSIVE VIEWPORT TRANSLATIONS
   ========================================================================== */
@media (max-width: 1024px) {
    .detail-split-layout { flex-direction: column; gap: 24px; }
    .asset-showcase-card, .transaction-hub-card { width: 100%; flex: none; }
}

@media (max-width: 768px) {
    .asset-trust-features-grid { grid-template-columns: 1fr; gap: 16px; }
    .asset-showcase-card { padding: 32px 24px; }
    .asset-title-text { font-size: 36px; }
    .detail-container-frame { padding: 0 20px; }
}

/* ==========================================================================
   MODULE STYLES: UNIVERSAL DYNAMIC CMS ENGINE SYSTEM
   ========================================================================== */
.cms-page-wrapper {
    max-width: 1400px;
    margin: 40px auto 0 auto;
    padding: 0 40px;
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.cms-hero-block {
    text-align: center;
    max-width: 850px;
    margin: 0 auto;
}

.cms-super-tag {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #4cd2ff;
    display: block;
    margin-bottom: 12px;
}

.cms-main-heading {
    font-size: 44px;
    font-weight: 700;
    color: var(--text-white);
    letter-spacing: -1px;
    margin-bottom: 20px;
    line-height: 1.2;
}

.cms-hero-subtitle {
    font-size: 18px;
    line-height: 1.6;
    color: var(--text-muted);
}

/* Reusable structural container matrix for flexible side-by-side or stacked layouts */
.cms-layout-grid {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

/* If the admin sets up a dual-column split row, just add this helper sub-class */
.cms-layout-grid.split-columns {
    flex-direction: row;
    align-items: stretch;
}

.cms-content-card {
    flex: 1;
    background: #061022;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 14px;
    padding: 48px;
}

/* ==========================================================================
   UNIVERSAL WYSIWYG RICH-TEXT STYLING MATRICES
   ========================================================================== */
.core-rich-text h2 {
    font-size: 24px;
    font-weight: 700;
    color: #ffffff;
    margin-top: 36px;
    margin-bottom: 18px;
    letter-spacing: -0.3px;
}
.core-rich-text h2:first-child { margin-top: 0; }

.core-rich-text h3 {
    font-size: 20px;
    font-weight: 700;
    color: #4cd2ff;
    margin-top: 28px;
    margin-bottom: 14px;
}

.core-rich-text p {
    font-size: 15px;
    line-height: 1.7;
    color: #cbd5e1;
    margin-bottom: 20px;
}
.core-rich-text p:last-child { margin-bottom: 0; }

.core-rich-text strong {
    color: #ffffff;
    font-weight: 600;
}

.core-rich-text a {
    color: var(--btn-blue);
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px dashed rgba(44, 102, 255, 0.4);
    transition: color 0.2s, border-color 0.2s;
}
.core-rich-text a:hover {
    color: #ffffff;
    border-bottom-color: #ffffff;
}

/* HTML Native Lists Setup */
.core-rich-text ul, 
.core-rich-text ol {
    margin-bottom: 24px;
    padding-left: 24px;
}

.core-rich-text li {
    font-size: 15px;
    line-height: 1.6;
    color: #cbd5e1;
    margin-bottom: 10px;
}
.core-rich-text li:last-child { margin-bottom: 0; }

/* Blockquote Setup */
.core-rich-text blockquote {
    background: rgba(255, 255, 255, 0.02);
    border-left: 3px solid var(--btn-blue);
    padding: 20px 24px;
    margin: 30px 0;
    border-radius: 0 8px 8px 0;
    font-style: italic;
    color: #ffffff;
}
.core-rich-text blockquote p {
    margin-bottom: 0;
}

/* ==========================================================================
   DYNAMIC MOBILE OVERRIDES
   ========================================================================== */
@media (max-width: 992px) {
    .cms-layout-grid.split-columns {
        flex-direction: column;
        gap: 24px;
    }
    .cms-content-card {
        width: 100%;
        padding: 36px 24px;
    }
    .cms-main-heading {
        font-size: 34px;
    }
    .cms-page-wrapper {
        padding: 0 20px;
    }
}

/* ==========================================================================
   UNIVERSAL MOBILE RESPONSIVE MATRIX DESIGN OVERHAUL (MAX-WIDTH: 768px)
   ========================================================================== */
@media (max-width: 768px) {
    
    /* --- RESPONSIVE INTERACTIVE HEADER TOGGLE FIX --- */
    .header {
        position: relative !important;
        padding: 16px 24px !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        z-index: 9999 !important;
    }

    /* Force button back into layout visibility with explicit mobile dimensional bounds */
    .menu-toggle {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        width: 26px !important;
        height: 18px !important;
        background: transparent !important;
        border: none !important;
        outline: none !important;
        cursor: pointer !important;
        z-index: 10000 !important;
        padding: 0 !important;
    }

    .menu-toggle span {
        display: block !important;
        width: 100% !important;
        height: 3px !important;
        background-color: #ffffff !important; /* Highly visible high-contrast pure white lines */
        transition: transform 0.3s ease, opacity 0.3s ease !important;
        border-radius: 2px !important;
        box-shadow: 0 0 4px rgba(0, 0, 0, 0.4) !important;
    }

    /* Transform hamburger into a crisp 'X' indicator when active class triggers */
    .menu-toggle.active span:nth-child(1) {
        transform: translateY(7px) rotate(45deg) !important;
    }

    .menu-toggle.active span:nth-child(2) {
        opacity: 0 !important;
    }

    .menu-toggle.active span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg) !important;
    }

    /* Hide desktop-exclusive elements wrapper panel */
    .header .header-actions {
        display: none !important;
    }

    /* Re-map navigation array into an absolute overlay drawer */
    .nav-links {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        background: linear-gradient(180deg, #061022 0%, #030d22 100%) !important;
        border-bottom: 1px solid rgba(44, 102, 255, 0.2) !important;
        padding: 30px !important;
        flex-direction: column !important;
        gap: 20px !important;
        align-items: flex-start !important;
        display: flex !important;
        visibility: hidden !important;
        opacity: 0 !important;
        transform: translateY(-10px) !important;
        transition: transform 0.3s ease, opacity 0.3s ease, visibility 0.3s ease !important;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.7) !important;
    }

    .nav-links.active {
        visibility: visible !important;
        opacity: 1 !important;
        transform: translateY(0) !important;
    }

    .nav-links a {
        font-size: 16px !important;
        width: 100% !important;
        padding: 6px 0 !important;
        color: #ffffff !important;
    }

    .nav-links .mobile-only-action {
        display: block !important;
        width: 100% !important;
        margin-top: 5px !important;
    }

    /* --- HERO DISPLAY ADAPTATIONS --- */
    .hero {
        margin: 30px auto 0 auto !important;
    }

    .hero h1 {
        font-size: 36px !important;
        letter-spacing: -0.8px !important;
        line-height: 1.2 !important;
    }

    .hero p.hero-subtitle {
        font-size: 15px !important;
        line-height: 1.5 !important;
        margin-bottom: 30px !important;
    }

    .ratings-container {
        gap: 12px !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .search-container {
        padding: 6px 6px 6px 16px !important;
        border-radius: 12px !important;
        flex-direction: row !important;
    }

    .search-input {
        font-size: 14px !important;
    }

    .btn-search {
        padding: 12px 20px !important;
        font-size: 14px !important;
    }

    /* --- DEVELOPER ARCHITECT BIO PROFILE OVERHAUL --- */
    .profile-card {
        flex-direction: column !important;
        padding: 30px 20px !important;
        gap: 35px !important;
    }

    .profile-left-col {
        border-right: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
        padding-right: 0 !important;
        padding-bottom: 35px !important;
        width: 100% !important;
    }

    .profile-stats-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }

    .profile-socials-row {
        justify-content: center !important;
    }

    .skills-header {
        text-align: center !important;
    }

    .skills-grid-matrix {
        justify-content: center !important;
    }

    /* --- ESCROW TRUST & SUPPORT OVERHAULS --- */
    .support-section {
        flex-direction: column !important;
        gap: 40px !important;
        padding: 0 20px !important;
    }

    .support-content {
        max-width: 100% !important;
        text-align: center !important;
    }

    .support-title {
        font-size: 30px !important;
    }

    .support-list {
        align-items: flex-start !important;
        text-align: left !important;
    }

    .support-graphic-side {
        min-height: auto !important;
    }

    /* --- INITIATIVE CORE & PLATFORM LOGOS --- */
    .initiative-top-block {
        flex-direction: column !important;
        gap: 30px !important;
        text-align: center !important;
    }

    .initiative-brand-box {
        max-width: 100% !important;
    }

    .initiative-logo {
        font-size: 36px !important;
    }

    .initiative-vertical-line {
        height: 1px !important;
        width: 100% !important;
    }

    .initiative-stats-panel {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 24px !important;
        width: 100% !important;
    }

    .initiative-logos-matrix {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 24px 16px !important;
    }

    .corp-logo-item.bordered-logo {
        border-left: none !important;
        padding-left: 0 !important;
    }

    /* --- TRANSACTION SECURITY FEATURES --- */
    .security-title {
        font-size: 24px !important;
        line-height: 1.3 !important;
    }

    .security-container {
        grid-template-columns: 1fr !important;
        padding: 30px 20px !important;
        gap: 30px !important;
    }

    .security-item-box {
        align-items: center !important;
    }

    /* --- SITEWIDE DIRECTORY MULTI-COLUMN FOOTER --- */
    .first-footer {
        grid-template-columns: repeat(2, 1fr) !important;
        padding: 0 24px 20px 24px !important;
        gap: 30px 20px !important;
    }

    .footer-sidebar-panel {
        grid-column: span 2 !important;
        padding-left: 0 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
        padding-top: 30px !important;
        align-items: center !important;
        text-align: center !important;
    }

    .sidebar-icon-row {
        justify-content: center !important;
    }

    .location-address-box {
        max-width: 100% !important;
        justify-content: center !important;
    }

    /* --- PLATFORM COMPLIANCE COMPONENT BAR --- */
    .final-footer {
        flex-direction: column !important;
        text-align: center !important;
        padding: 0 24px 40px 24px !important;
        gap: 30px !important;
    }

    .final-footer-center {
        flex-direction: column !important;
        gap: 16px !important;
    }

    .final-vertical-pipe {
        width: 40px !important;
        height: 1px !important;
    }

    /* --- DETAIL VIEW RESPONSIVE OVERRIDES --- */
    .detail-container-frame {
        padding: 20px 16px !important;
    }

    .detail-split-layout {
        display: flex !important;
        flex-direction: column !important;
        gap: 30px !important;
    }

    .asset-showcase-card {
        padding: 30px 20px !important;
    }

    /* Forces ultra-long domains to wrap elegantly on tight screens */
    .asset-title-text {
        font-size: 28px !important;
        line-height: 1.2 !important;
        margin: 15px 0 10px 0 !important;
        word-break: break-all !important;
        overflow-wrap: break-word !important;
        white-space: normal !important;
    }
    
    .asset-subtitle-text {
        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    .asset-trust-features-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

@media (max-width: 480px) {
    .initiative-stats-panel,
    .first-footer {
        grid-template-columns: 1fr !important;
    }
    
    .footer-sidebar-panel {
        grid-column: span 1 !important;
    }

    .initiative-logos-matrix {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .domains-portfolio-grid { 
        grid-template-columns: 1fr !important; 
        gap: 16px !important; 
    }

    .domains-section { 
        padding: 0 20px !important; 
    }

    .card-domain-name { 
        font-size: 19px !important; 
    }
}

/* ==========================================================================
   INQUIRY FORM FOOTER NOTICE CORRECTION (CENTERED, SMALL, DARK GREY)
   ========================================================================== */
.transaction-hub-card p:last-child,
.detail-transaction-panel p:last-child,
.hub-footer-notice-text {
    text-align: center !important;
    font-size: 12px !important;
    color: #5a6e85 !important;
    margin-top: 16px !important;
    display: block !important;
    width: 100% !important;
    font-weight: 500 !important;
}