/* ============================================================
   GDPRSOLUTIONS.NET(c)
   PAGE: ABOUT / TRANSPARENCY STYLESHEET
   Version 1.2 | Launch target: January 10, 2027

   Author: Raymond Brogan
   Company: The Raymond Brogan Corporation(R)
   Website: https://raymondbrogan.com
   Ownership: GDPRSolutions.net and GDPR Solutions Network
              are represented as a Raymond Brogan Corporation company.
   Brand: Privacy • Transparency • Control • Simplicity

   Copyright (c) 2026 The Raymond Brogan Corporation.
   Copyright (c) 2026 GDPR Solutions Network.
   All rights reserved.

   LEGAL NOTICE: Original site content, source code, graphics,
   design, and documentation are proprietary to their respective
   rights holders. No reproduction, redistribution, commercial
   exploitation, or derivative distribution is authorized without
   prior written permission, except as permitted by applicable law
   or an express license. Third-party libraries and assets retain
   their own licenses. No warranty or guarantee of legal compliance
   is made by this website or its demonstrations. Copyright notices
   do not establish trademark registration; (R) is reproduced as
   supplied by the owner and should only be displayed publicly as
   a registration claim if the relevant mark is registered.
   ============================================================ */

/* ============================================================
   ABOUT AND TRANSPARENCY CONTENT
   All new classes use the gds- prefix.
   ============================================================ */
.gds-page {
    color: #e8f6f5;
    padding: 56px 22px 100px;
}
.gds-wrap {
    max-width: 1120px;
    margin: 0 auto;
}
.gds-eyebrow {
    color: #64e7c7;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.gds-hero {
    text-align: center;
    padding: 45px 0 58px;
}
.gds-hero h1 {
    margin: 18px auto;
    max-width: 950px;
    font-size: clamp(2.5rem, 6vw, 4.8rem);
    line-height: 1.12;
}
.gds-hero h1 span,
.gds-section h2 span {
    color: #5fe5c1;
}
.gds-lead {
    max-width: 800px;
    margin: 0 auto;
    color: #b6cacc;
    font-size: 1.14rem;
    line-height: 1.85;
}
.gds-section {
    padding: 52px 0;
}
.gds-section h2 {
    font-size: clamp(1.8rem, 3.7vw, 2.8rem);
    margin: 0 0 22px;
}
.gds-section p,
.gds-card p {
    color: #bacdce;
    line-height: 1.8;
}
.gds-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}
.gds-card,
.gds-panel,
.gds-milestone {
    border: 1px solid rgba(105, 235, 205, .18);
    border-radius: 20px;
    background: rgba(10, 26, 35, .78);
    box-shadow: 0 20px 55px rgba(0, 0, 0, .13);
}
.gds-card {
    padding: 27px;
}
.gds-card h3 {
    margin: 0 0 12px;
    color: #e9fff9;
}
.gds-panel {
    padding: clamp(24px, 5vw, 48px);
}
.gds-image-placeholder {
    display: grid;
    place-content: center;
    min-height: 260px;
    margin: 22px 0;
    padding: 24px;
    border: 2px dashed rgba(105, 235, 205, .35);
    border-radius: 22px;
    background: radial-gradient(circle at center, rgba(18, 178, 164, .14), rgba(4, 14, 23, .75));
    text-align: center;
}
.gds-image-placeholder strong {
    color: #83f1d4;
    margin-bottom: 10px;
}
.gds-image-placeholder small {
    color: #b9cecf;
    line-height: 1.7;
}
.gds-cta {
    display: inline-block;
    margin-top: 20px;
    padding: 14px 22px;
    border: 1px solid #5fe5c1;
    border-radius: 12px;
    background: rgba(31, 180, 156, .14);
    color: #dffff5;
    font-weight: 800;
    text-decoration: none;
    transition: transform .25s ease, box-shadow .25s ease;
}
.gds-cta:hover,
.gds-cta:focus-visible {
    transform: translateY(-3px);
    box-shadow: 0 0 25px rgba(65, 224, 190, .2);
}
.gds-milestone {
    padding: 26px;
    margin-bottom: 16px;
}
.gds-milestone-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 12px;
}
.gds-status {
    display: inline-block;
    padding: 5px 11px;
    border-radius: 100px;
    border: 1px solid rgba(106, 230, 207, .35);
    color: #a3f2dc;
    font-size: .8rem;
}
.gds-meta {
    font-size: .85rem;
    color: #9eb9ba;
}
@media (max-width: 820px) {
    .gds-grid {
        grid-template-columns: 1fr;
    }
}
@media (prefers-reduced-motion: reduce) {
    .gds-cta {
        transition: none;
    }
}


/* ============================================================
   GDPRSOLUTIONS.NET
   CONNECTED COMPLIANCE ECOSYSTEM
   Horizontal Icon + Text Tile Layout

   Copyright (c) 2026
   The Raymond Brogan Corporation
   GDPR Solutions Network
   ============================================================ */


/* ============================================================
   ECOSYSTEM GRID
   3 Columns x 2 Rows
   ============================================================ */

.ecosystem-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 35px;
}


/* ============================================================
   INDIVIDUAL TILES
   ============================================================ */

.ecosystem-tile {
    display: flex;
    align-items: flex-start;
    gap: 16px;

    padding: 24px;

    background: rgba(10, 25, 35, 0.85);
    border: 1px solid rgba(0, 220, 200, 0.18);
    border-radius: 16px;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}

.ecosystem-tile:hover {
    transform: translateY(-5px);

    background: rgba(10, 35, 42, 0.95);
    border-color: rgba(0, 235, 200, 0.55);

    box-shadow:
        0 12px 35px rgba(0, 0, 0, 0.25),
        0 0 22px rgba(0, 220, 200, 0.12);
}


/* ============================================================
   ICONS
   ============================================================ */

.ecosystem-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 44px;

    width: 44px;
    height: 44px;

    color: #00f0d0;
    font-size: 24px;
    font-weight: 700;

    background: rgba(0, 220, 200, 0.09);
    border: 1px solid rgba(0, 220, 200, 0.3);
    border-radius: 12px;

    box-shadow: 0 0 15px rgba(0, 220, 200, 0.08);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.ecosystem-tile:hover .ecosystem-icon {
    transform: scale(1.08);

    box-shadow: 0 0 22px rgba(0, 220, 200, 0.24);
}


/* ============================================================
   TEXT CONTENT
   ============================================================ */

.ecosystem-text {
    flex: 1;
    min-width: 0;
}

.ecosystem-text h3 {
    margin: 0 0 8px;

    color: #ffffff;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.35;
}

.ecosystem-text p {
    margin: 0;

    color: #a8bdc5;
    font-size: 0.9rem;
    line-height: 1.65;
}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 950px) {

    .ecosystem-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 600px) {

    .ecosystem-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .ecosystem-tile {
        padding: 20px;
    }

    .ecosystem-icon {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
        font-size: 22px;
    }

}


/* ============================================================
   ACCESSIBILITY
   Respect reduced-motion preferences
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    .ecosystem-tile,
    .ecosystem-icon {
        transition: none;
    }

    .ecosystem-tile:hover,
    .ecosystem-tile:hover .ecosystem-icon {
        transform: none;
    }

}

/* ============================================================
   GDPRSOLUTIONS.NET ©
   GLOBAL IMAGE STYLING
   © 2026 The Raymond Brogan Corporation
   ============================================================ */

.gdpr-rounded-image {

    display: block;

    max-width: 100%;
    height: auto;

    border-radius: 18px;

    border:
        1px solid rgba(0, 220, 200, 0.25);

    box-shadow:
        0 10px 35px rgba(0, 0, 0, 0.35);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;

}

.gdpr-rounded-image:hover {

    transform: translateY(-4px);

    box-shadow:
        0 15px 45px rgba(0, 220, 200, 0.18);

}