/* =========================================================
   THE AROMAVERSE
   CUSTOMER CARE
========================================================= */

.customer-care-hero{

    padding:180px 0 80px;

    text-align:center;

    position:relative;

    overflow:hidden;

}

.customer-care-hero::before{

    content:'';

    position:absolute;

    inset:0;

    background:
        radial-gradient(
            circle at top,
            rgba(200,176,139,.10),
            transparent 70%
        );

    pointer-events:none;

}

.customer-care-overline{

    display:inline-block;

    margin-bottom:1rem;

    color:var(--lux-gold);

    letter-spacing:.35em;

    text-transform:uppercase;

    font-size:.75rem;

}

.customer-care-title{

    font-size:clamp(2.8rem,6vw,5rem);

    line-height:.95;

    margin-bottom:1.5rem;

}

.customer-care-description{

    max-width:700px;

    margin:0 auto;

    color:var(--text-secondary);

    line-height:1.9;

    font-size:1rem;

}

/* =========================================================
   GRID
========================================================= */

.customer-care-grid-section{

    padding:0 0 5rem;

}

.customer-care-grid{

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:1.5rem;

}

.care-card{

    display:flex;

    flex-direction:column;

    padding:2rem;

    border-radius:28px;

    text-decoration:none;

    background:
        linear-gradient(
            180deg,
            rgba(18,18,18,.98),
            rgba(8,8,8,1)
        );

    border:1px solid rgba(255,255,255,.08);

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;

}

.care-card:hover{

    transform:translateY(-8px);

    border-color:rgba(200,176,139,.35);

    box-shadow:
        0 25px 60px rgba(0,0,0,.45);

}

.care-icon{

    width:64px;

    height:64px;

    margin-bottom:1.5rem;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:1.6rem;

    background:
        rgba(200,176,139,.10);

    color:var(--lux-gold);

}

.care-card h3{

    margin-bottom:.75rem;

    font-size:1.5rem;

    color:var(--lux-cream);

}

.care-card p{

    color:var(--text-secondary);

    line-height:1.8;

}

/* =========================================================
   SUPPORT
========================================================= */

.customer-support-section{

    padding:0 0 6rem;

}

.support-card{

    padding:4rem;

    border-radius:36px;

    text-align:center;

    background:
        linear-gradient(
            180deg,
            rgba(18,18,18,.98),
            rgba(8,8,8,1)
        );

    border:1px solid rgba(200,176,139,.18);

}

.support-card h2{

    margin:1rem 0;

    font-size:clamp(2rem,5vw,3rem);

}

.support-card p{

    max-width:640px;

    margin:0 auto 2rem;

    color:var(--text-secondary);

    line-height:1.8;

}

.support-actions{

    display:flex;

    justify-content:center;

    gap:1rem;

    flex-wrap:wrap;

}

.support-actions .btn{

    min-width:220px;

}

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

@media (max-width:768px){

    .customer-care-hero{

        padding:150px 0 60px;

    }

    .customer-care-grid{

        grid-template-columns:1fr;

    }

    .care-card{

        padding:1.5rem;

    }

    .support-card{

        padding:2rem;

    }

    .support-actions{

        flex-direction:column;

    }

    .support-actions .btn{

        width:100%;

        min-width:0;

    }

}

/* =========================================================
   POLICY PAGES
========================================================= */

.policy-hero{

    padding:180px 0 70px;

    text-align:center;

}

.policy-title{

    font-size:clamp(2.5rem,6vw,4.5rem);

    line-height:1;

    margin-bottom:1rem;

}

.policy-description{

    max-width:700px;

    margin:0 auto;

    color:var(--text-secondary);

    line-height:1.8;

}

.policy-content{

    padding:0 0 5rem;

}

.policy-card{

    max-width:900px;

    margin:0 auto;

    padding:3rem;

    border-radius:32px;

    background:
        linear-gradient(
            180deg,
            rgba(18,18,18,.98),
            rgba(8,8,8,1)
        );

    border:1px solid rgba(255,255,255,.08);

}

.policy-card h2{

    margin-top:2.5rem;

    margin-bottom:1rem;

    color:var(--lux-gold);

    font-size:1.5rem;

}

.policy-card h2:first-child{

    margin-top:0;

}

.policy-card p{

    color:var(--text-secondary);

    line-height:1.9;

    margin-bottom:1rem;

}

.policy-card ul{

    margin:1rem 0 2rem 1.25rem;

}

.policy-card li{

    color:var(--text-secondary);

    margin-bottom:.75rem;

    line-height:1.8;

}

.policy-card strong{

    color:var(--lux-cream);

}

.policy-card hr{

    margin:3rem 0;

    border:none;

    border-top:1px solid rgba(255,255,255,.08);

}

.policy-help{

    padding-bottom:6rem;

}

@media (max-width:768px){

    .policy-hero{

        padding:150px 0 50px;

    }

    .policy-card{

        padding:1.5rem;

        border-radius:24px;

    }

}

.policy-card table{

    width:100%;

    border-collapse:collapse;

    margin:2rem 0;

}

.policy-card th,
.policy-card td{

    padding:1rem;

    text-align:left;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.policy-card th{

    color:var(--lux-gold);

    font-weight:600;

}

.policy-card tr:hover{

    background:rgba(255,255,255,.03);

}

@media (max-width:768px){

    .policy-card table{

        display:block;

        overflow-x:auto;

        white-space:nowrap;

    }

}