/* ==========================================================================
   MyDNABank brand overrides — The Page 2
   Loaded AFTER css/custom.css on every page.
   ========================================================================== */

/* Brand colour palette */
:root {
    --mydna-deep: #013A59;
    --mydna-mid:  #116DAD;
    --mydna-cyan: #13E0B9;
    --mydna-ink:  #0E1B2C;
    --mydna-soft: #F4F8FB;
}

/* Header brand tweaks */
.main-header .navbar-brand img {
    max-height: 56px;
    width: auto;
}

/* Footer brand tweaks */
.main-footer .footer-logo img {
    max-width: 180px;
    height: auto;
}

/* Gradient accent on primary CTAs */
.btn-default {
    background-image: linear-gradient(135deg, #013A59 0%, #116DAD 60%, #13E0B9 100%);
    background-size: 200% 100%;
    background-position: 0% 0%;
    transition: background-position 0.5s ease, transform 0.2s ease;
}
.btn-default:hover {
    background-position: 100% 0%;
}

/* Section title accent letter-spacing */
.section-title h1,
.section-title h2 {
    letter-spacing: -0.5px;
}

/* Hero "dual CTA" row used on Home + audience hero pages */
.mydna-hero-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 8px;
}
.mydna-hero-cta-row .btn-default {
    margin: 0;
}
.mydna-hero-cta-row .btn-secondary-outline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.35);
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}
.mydna-hero-cta-row .btn-secondary-outline:hover {
    background-color: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.6);
}

/* Pillar / pledge / rights cards used on Security + Home Privacy Guarantee */
.mydna-pillar-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 24px;
}
.mydna-pillar-card {
    background: #fff;
    border-radius: 20px;
    padding: 32px 28px;
    border: 1px solid rgba(17, 109, 173, 0.10);
    box-shadow: 0 12px 30px rgba(1, 58, 89, 0.06);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.mydna-pillar-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(1, 58, 89, 0.10);
}
.mydna-pillar-card .icon-box {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(1,58,89,0.08), rgba(19,224,185,0.18));
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    color: var(--mydna-deep);
    font-size: 22px;
}
.mydna-pillar-card h3 {
    margin: 0 0 10px;
    font-size: 22px;
    color: var(--mydna-ink);
}
.mydna-pillar-card p {
    margin: 0;
    color: #4a5b6c;
    line-height: 1.6;
}
.dark-section .mydna-pillar-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    color: #cfd8e2;
}
.dark-section .mydna-pillar-card h3 { color: #fff; }
.dark-section .mydna-pillar-card p { color: rgba(255,255,255,0.78); }

/* "We will never" pledge cards */
.mydna-pledge-card {
    border-left: 3px solid var(--mydna-cyan);
    padding-left: 20px;
    background: transparent;
}
.mydna-pledge-card h3 {
    color: var(--mydna-cyan);
    margin-bottom: 8px;
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Compliance badges (Security + Home Privacy band) */
.mydna-badge-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 18px;
}
.mydna-badge {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 16px;
    padding: 26px 22px;
    text-align: center;
    color: #fff;
}
.mydna-badge h4 {
    color: var(--mydna-cyan);
    margin: 0 0 6px;
    font-size: 18px;
    letter-spacing: 0.06em;
}
.mydna-badge p {
    margin: 0;
    font-size: 14px;
    color: rgba(255,255,255,0.78);
}

/* Data spec table (For Researchers / For Business) */
.mydna-spec-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 12px;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 12px 30px rgba(1, 58, 89, 0.06);
}
.mydna-spec-table th,
.mydna-spec-table td {
    padding: 16px 20px;
    text-align: left;
    border-bottom: 1px solid rgba(1,58,89,0.08);
    vertical-align: top;
}
.mydna-spec-table th {
    width: 32%;
    font-weight: 600;
    color: var(--mydna-deep);
    background: var(--mydna-soft);
}
.mydna-spec-table tr:last-child th,
.mydna-spec-table tr:last-child td {
    border-bottom: none;
}

/* Closing quote band */
.mydna-quote-band {
    background: linear-gradient(135deg, rgba(1,58,89,0.92) 0%, rgba(17,109,173,0.92) 100%);
    color: #fff;
    border-radius: 24px;
    padding: 48px 40px;
    text-align: center;
    position: relative;
}
.mydna-quote-band blockquote {
    margin: 0;
    font-size: 24px;
    line-height: 1.5;
    font-weight: 500;
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
}
.mydna-quote-band cite {
    display: block;
    margin-top: 16px;
    font-style: normal;
    font-size: 14px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mydna-cyan);
}

/* Use-case grid (For Business) */
.mydna-usecase-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 22px;
}
.mydna-usecase-card {
    background: #fff;
    border-radius: 20px;
    padding: 28px;
    border: 1px solid rgba(1,58,89,0.08);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.mydna-usecase-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(1, 58, 89, 0.10);
}
.mydna-usecase-card h3 {
    color: var(--mydna-deep);
    font-size: 20px;
    margin-bottom: 10px;
}
.mydna-usecase-card p {
    color: #4a5b6c;
    margin: 0;
    line-height: 1.6;
}

/* Step number badges */
.mydna-step-num {
    display: inline-block;
    background: linear-gradient(135deg, var(--mydna-deep), var(--mydna-cyan));
    color: #fff;
    width: 44px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    border-radius: 50%;
    font-weight: 700;
    margin-bottom: 14px;
}

/* Token utility row */
.mydna-token-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 22px;
}

/* Comparison rows (100% Difference on Home) */
.mydna-compare {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    margin-top: 12px;
}
.mydna-compare-card {
    border-radius: 20px;
    padding: 28px;
    background: #fff;
    border: 1px solid rgba(1,58,89,0.08);
}
.mydna-compare-card.them {
    background: var(--mydna-soft);
}
.mydna-compare-card.us {
    background: linear-gradient(135deg, rgba(1,58,89,0.95) 0%, rgba(17,109,173,0.95) 100%);
    color: #fff;
    border-color: transparent;
}
.mydna-compare-card h3 {
    margin-top: 0;
    font-size: 20px;
}
.mydna-compare-card.us h3 { color: #fff; }
.mydna-compare-card .stat {
    font-size: 56px;
    font-weight: 800;
    line-height: 1;
    margin: 12px 0 8px;
    background: linear-gradient(135deg, var(--mydna-mid), var(--mydna-cyan));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.mydna-compare-card.us .stat {
    color: var(--mydna-cyan);
    background: none;
    -webkit-text-fill-color: var(--mydna-cyan);
}
@media (max-width: 768px) {
    .mydna-compare { grid-template-columns: 1fr; }
}

/* Marketplace flow band */
.mydna-flow-band {
    background: linear-gradient(135deg, var(--mydna-deep) 0%, var(--mydna-mid) 100%);
    color: #fff;
    border-radius: 24px;
    padding: 56px 40px;
}
.mydna-flow-band h2 { color: #fff; }
.mydna-flow-band p { color: rgba(255,255,255,0.85); }

/* Footer text colour normalisation */
.main-footer .footer-links h2 {
    color: #fff;
}
.main-footer .footer-links a,
.main-footer .footer-links li {
    color: rgba(255,255,255,0.78);
}
.main-footer .footer-links a:hover {
    color: var(--mydna-cyan);
}

/* "Get Started" pill button differs slightly from .btn-default's full pill */
.header-btn .btn-default {
    padding: 14px 26px;
}

/* Subtle highlight badge used in copy */
.mydna-inline-tag {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    background: rgba(19, 224, 185, 0.14);
    color: var(--mydna-deep);
    font-size: 13px;
    letter-spacing: 0.04em;
    font-weight: 600;
}

/* About — Why We Exist light-background text overrides */
#why-we-exist .apprach-body-item h3 {
    color: var(--primary-color) !important;
}
#why-we-exist .apprach-body-item p {
    color: var(--text-color) !important;
}
#why-we-exist .apprach-body-item ul li {
    color: var(--text-color) !important;
}

/* Security vault light-background text overrides */
#security-vault .apprach-body-item h3 {
    color: var(--primary-color) !important;
}
#security-vault .apprach-body-item p {
    color: var(--text-color) !important;
}
#security-vault .apprach-body-item ul li {
    color: var(--text-color) !important;
}

/* For-researchers steps light-background text overrides */
#researcher-steps .service-item-content h2 {
    color: var(--primary-color);
}
#researcher-steps .service-item-content p {
    color: var(--text-color);
}

/* Step 2 light-background text overrides */
#step-2 .apprach-body-item h3 {
    color: var(--primary-color);
}
#step-2 .apprach-body-item p {
    color: var(--text-color);
}
#step-2 .apprach-body-item ul li {
    color: var(--text-color);
}
