/* Static legal/policy pages: cookie / terms / shipping / returns / privacy.
   Each page's wrapper carries .policy-page plus a per-page modifier
   (.policy-page--cookie / --shipping / --terms / --returns / --privacy). The
   pages differ in gutter/card padding, font and mobile rules, so each page's
   rules are scoped under its own modifier and only rules that are identical
   across pages are shared. Scoping every selector under its modifier keeps
   base and media-query rules at one specificity level so they resolve purely
   by source order.
   font-family is set explicitly on each text selector because the global body
   font is Orbitron; inheriting it would change the rendering.

   The privacy page keeps its own block at the foot of this file because its
   data-table styling (.policy-table) differs from the cookie page's
   (.cookie-table). */

/* ============================ desktop / base ============================ */

.policy-page--cookie,
.policy-page--shipping,
.policy-page--terms,
.policy-page--returns {
    max-width: 800px;
    margin: 0 auto;
}

.policy-page--cookie {
    padding: 0 15px;
    font-family: 'Montserrat', sans-serif;
}
.policy-page--shipping,
.policy-page--returns {
    padding: 0 20px;
    font-family: 'Montserrat', sans-serif;
}
.policy-page--terms {
    padding: 0 20px;
    font-family: Arial, sans-serif;
}

/* content card shell */
.policy-page--cookie .content-card,
.policy-page--shipping .content-card,
.policy-page--terms .content-card,
.policy-page--returns .content-card {
    background-color: rgba(40, 0, 40, 0.7);
    border-radius: 15px;
    box-shadow: 0 0 20px rgba(255, 0, 255, 0.3);
    margin-bottom: 40px;
}
.policy-page--cookie .content-card {
    padding: 25px;
    font-family: 'Montserrat', sans-serif;
}
.policy-page--shipping .content-card,
.policy-page--returns .content-card {
    padding: 30px;
    font-family: 'Montserrat', sans-serif;
}
.policy-page--terms .content-card {
    padding: 30px;
    font-family: Arial, sans-serif;
}

/* h2 */
.policy-page--cookie .content-card h2,
.policy-page--shipping .content-card h2,
.policy-page--terms .content-card h2,
.policy-page--returns .content-card h2 {
    color: #ff00ff;
    margin-bottom: 25px;
    text-shadow: 0 0 10px rgba(255, 0, 255, 0.5);
    font-weight: 700;
}
.policy-page--cookie .content-card h2,
.policy-page--shipping .content-card h2,
.policy-page--returns .content-card h2 {
    font-family: 'Montserrat', sans-serif;
}
.policy-page--terms .content-card h2 {
    font-family: Arial, sans-serif;
}

/* h3 */
.policy-page--cookie .content-card h3,
.policy-page--shipping .content-card h3,
.policy-page--terms .content-card h3,
.policy-page--returns .content-card h3 {
    color: #00ffff;
    margin: 30px 0 15px;
    font-size: 1.4rem;
    font-weight: 600;
}
.policy-page--cookie .content-card h3,
.policy-page--shipping .content-card h3,
.policy-page--returns .content-card h3 {
    font-family: 'Montserrat', sans-serif;
}
.policy-page--terms .content-card h3 {
    font-family: Arial, sans-serif;
}

/* h4 — only cookie and terms use it, with different size/margins */
.policy-page--cookie .content-card h4 {
    color: #e600e6;
    margin: 25px 0 15px;
    font-size: 1.2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
}
.policy-page--terms .content-card h4 {
    color: #e600e6;
    margin: 25px 0 12px;
    font-size: 1.15rem;
    font-family: Arial, sans-serif;
    font-weight: 600;
}

/* body text */
.policy-page--cookie .content-card p,
.policy-page--cookie .content-card li,
.policy-page--shipping .content-card p,
.policy-page--shipping .content-card li,
.policy-page--terms .content-card p,
.policy-page--terms .content-card li,
.policy-page--returns .content-card p,
.policy-page--returns .content-card li {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 15px;
    color: #ffffff;
}
.policy-page--cookie .content-card p,
.policy-page--cookie .content-card li,
.policy-page--shipping .content-card p,
.policy-page--shipping .content-card li,
.policy-page--returns .content-card p,
.policy-page--returns .content-card li {
    font-family: 'Montserrat', sans-serif;
}
.policy-page--terms .content-card p,
.policy-page--terms .content-card li {
    font-family: Arial, sans-serif;
}

/* list spacing — only the returns page uses <ol> */
.policy-page--cookie .content-card ul,
.policy-page--shipping .content-card ul,
.policy-page--terms .content-card ul,
.policy-page--returns .content-card ul,
.policy-page--returns .content-card ol {
    margin-bottom: 20px;
}

/* highlighted links */
.policy-page--cookie .text-highlight,
.policy-page--shipping .text-highlight,
.policy-page--terms .text-highlight,
.policy-page--returns .text-highlight {
    color: #ff00ff;
    text-decoration: none;
    transition: all 0.3s ease;
}
.policy-page--cookie .text-highlight,
.policy-page--shipping .text-highlight,
.policy-page--returns .text-highlight {
    font-family: 'Montserrat', sans-serif;
}
.policy-page--terms .text-highlight {
    font-family: Arial, sans-serif;
}
.policy-page--cookie .text-highlight:hover,
.policy-page--shipping .text-highlight:hover,
.policy-page--terms .text-highlight:hover,
.policy-page--returns .text-highlight:hover {
    color: #00ffff;
    text-shadow: 0 0 10px rgba(0, 255, 255, 0.5);
}

/* cookie consent tables — cookie page only */
.policy-page--cookie .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 20px;
}
.policy-page--cookie .cookie-table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 1rem;
    background-color: #212121;
    border-collapse: collapse;
    font-size: 0.9rem;
}
.policy-page--cookie .cookie-table th,
.policy-page--cookie .cookie-table td {
    padding: 10px;
    text-align: center;
    border: 1px solid #444;
    color: #fff;
    vertical-align: middle;
    word-wrap: break-word;
}
.policy-page--cookie .cookie-table th {
    background-color: #333;
    font-weight: 600;
    white-space: nowrap;
}
.policy-page--cookie .cookie-table td:nth-child(2) {
    color: #ccc;
}

/* ============================ tablet / mobile ============================ */
@media (max-width: 768px) {
    .policy-page--cookie,
    .policy-page--shipping,
    .policy-page--terms,
    .policy-page--returns {
        padding: 0 10px;
        max-width: 100%;
    }
    .policy-page--cookie .content-card,
    .policy-page--shipping .content-card,
    .policy-page--terms .content-card,
    .policy-page--returns .content-card {
        padding: 20px 15px;
        border-radius: 10px;
    }

    /* cookie tables shrink (cookie page only) */
    .policy-page--cookie .cookie-table {
        font-size: 0.85rem;
    }
    .policy-page--cookie .cookie-table th,
    .policy-page--cookie .cookie-table td {
        padding: 6px;
    }
    .policy-page--cookie .cookie-table th:nth-child(1),
    .policy-page--cookie .cookie-table td:nth-child(1) {
        width: 25%;
        min-width: 70px;
    }
    .policy-page--cookie .cookie-table th:nth-child(2),
    .policy-page--cookie .cookie-table td:nth-child(2) {
        width: 50%;
        min-width: 100px;
    }
    .policy-page--cookie .cookie-table th:nth-child(3),
    .policy-page--cookie .cookie-table td:nth-child(3) {
        width: 25%;
        min-width: 70px;
    }
    .policy-page--cookie .cookie-table td {
        word-break: break-word;
    }
}

/* ============================ small mobile ============================ */
@media (max-width: 430px) {
    /* all four narrow the page gutter */
    .policy-page--cookie,
    .policy-page--shipping,
    .policy-page--terms,
    .policy-page--returns {
        padding: 0 5px;
    }

    /* full-bleed family (cookie, terms): card breaks the gutter edge-to-edge */
    .policy-page--cookie,
    .policy-page--terms {
        width: 100%;
    }
    .policy-page--cookie .content-card,
    .policy-page--terms .content-card {
        padding: 15px 10px;
        margin: 0 -5px;
        width: calc(100% + 10px);
        border-radius: 8px;
    }

    /* shrink family (shipping, returns): smaller card and type, no full-bleed */
    .policy-page--shipping .content-card,
    .policy-page--returns .content-card {
        padding: 15px 12px;
        border-radius: 8px;
    }
    .policy-page--shipping .content-card h3,
    .policy-page--returns .content-card h3 {
        font-size: 1.2rem;
    }
    .policy-page--shipping .content-card p,
    .policy-page--shipping .content-card li,
    .policy-page--returns .content-card p,
    .policy-page--returns .content-card li {
        font-size: 0.9rem;
    }

    /* cookie tables shrink further (cookie page only) */
    .policy-page--cookie .cookie-table {
        font-size: 0.8rem;
    }
    .policy-page--cookie .cookie-table th,
    .policy-page--cookie .cookie-table td {
        padding: 3px;
    }
    .policy-page--cookie .cookie-table th:nth-child(1),
    .policy-page--cookie .cookie-table td:nth-child(1) {
        width: 25%;
        min-width: 65px;
    }
    .policy-page--cookie .cookie-table th:nth-child(2),
    .policy-page--cookie .cookie-table td:nth-child(2) {
        width: 50%;
        min-width: 100px;
    }
    .policy-page--cookie .cookie-table th:nth-child(3),
    .policy-page--cookie .cookie-table td:nth-child(3) {
        width: 25%;
        min-width: 65px;
    }
}

/* ============================ privacy ============================ */

.policy-page--privacy {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
    font-family: Arial, sans-serif;
}

.policy-page--privacy .content-card {
    background-color: rgba(40, 0, 40, 0.7);
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 0 20px rgba(255, 0, 255, 0.3);
    margin-bottom: 40px;
    font-family: Arial, sans-serif;
}

.policy-page--privacy .content-card h2 {
    color: #ff00ff;
    margin-bottom: 25px;
    text-shadow: 0 0 10px rgba(255, 0, 255, 0.5);
    font-family: Arial, sans-serif;
    font-weight: 700;
}

.policy-page--privacy .content-card h3 {
    color: #00ffff;
    margin: 30px 0 15px;
    font-size: 1.4rem;
    font-family: Arial, sans-serif;
    font-weight: 600;
}

.policy-page--privacy .content-card h4 {
    color: #e600e6;
    margin: 25px 0 12px;
    font-size: 1.15rem;
    font-family: Arial, sans-serif;
    font-weight: 600;
}

.policy-page--privacy .content-card p,
.policy-page--privacy .content-card li {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 15px;
    color: #ffffff;
    font-family: Arial, sans-serif;
}

.policy-page--privacy .content-card ul {
    margin-bottom: 20px;
}

.policy-page--privacy .text-highlight {
    color: #ff00ff;
    text-decoration: none;
    transition: all 0.3s ease;
    font-family: Arial, sans-serif;
}

.policy-page--privacy .text-highlight:hover {
    color: #00ffff;
    text-shadow: 0 0 10px rgba(0, 255, 255, 0.5);
}

/* data tables — privacy uses .policy-table (left-aligned, 2-col legal-basis) */
.policy-page--privacy .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 20px;
}

.policy-page--privacy .policy-table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 1rem;
    background-color: #212121;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.policy-page--privacy .policy-table th,
.policy-page--privacy .policy-table td {
    padding: 10px 12px;
    text-align: left;
    border: 1px solid #444;
    color: #fff;
    vertical-align: top;
    word-wrap: break-word;
}

.policy-page--privacy .policy-table th {
    background-color: #333;
    font-weight: 600;
    white-space: nowrap;
}

.policy-page--privacy .policy-table td:nth-child(2) {
    color: #ccc;
}

@media (max-width: 768px) {
    .policy-page--privacy {
        padding: 0 10px;
        max-width: 100%;
    }

    .policy-page--privacy .content-card {
        padding: 20px 15px;
        border-radius: 10px;
    }

    .policy-page--privacy .policy-table {
        font-size: 0.85rem;
    }

    .policy-page--privacy .policy-table th,
    .policy-page--privacy .policy-table td {
        padding: 6px 8px;
    }
}

@media (max-width: 430px) {
    .policy-page--privacy {
        padding: 0 5px;
        width: 100%;
    }

    .policy-page--privacy .content-card {
        padding: 15px 10px;
        margin: 0 -5px;
        width: calc(100% + 10px);
        border-radius: 8px;
    }

    .policy-page--privacy .policy-table {
        font-size: 0.8rem;
    }

    .policy-page--privacy .policy-table th,
    .policy-page--privacy .policy-table td {
        padding: 4px 6px;
    }
}