:root{
    --mint:#cfe7dc;
    --mint-deeper:#c6e1d5;
    --cream:#f7f5eb;
    --gold:#c6a66a;
    --ink:#1f2d28;
    --text:#3a4a44;
    --sub:#6b7480;
    --card:#ffffff;
    /* 0 10px 30px */
    --shadow:0 0.625em 1.875em rgba(20,60,40,.08);
}

.about-page{
    background:var(--cream);
    color:var(--text);
}

/* Slim sub-hero */
.about-hero{
    text-align:center;
    padding:2em 1.5em 1.5em;
    background:linear-gradient(180deg,#fff,#fbfaf6);
    border-bottom:0.0625em solid rgba(20,60,40,.06);
}

.about-hero h1{
    font-family:Cinzel,serif;
    color:var(--ink);
    margin:0;
    font-size:clamp(1.75em,3.5vw,2.375em); /* 28–38px */
}

.about-hero p{
    margin:0.375em auto 0;
    color:var(--sub);
    max-width:47.5em; /* 760px */
}

/* Story */
.about-story .wrap{
    max-width:60em; /* 960px */
    margin:0 auto;
    padding:3.5em 1.5em;
    text-align:center;
}

.about-story h2{
    font-family:Cinzel,serif;
    color:var(--ink);
    margin:0 0 0.75em;
    font-weight:700;
}

.about-story p{
    margin:0;
    line-height:1.85;
}

/* Team */
.about-team .wrap{
    max-width:68.75em; /* 1100px */
    margin:0 auto;
    padding:3.5em 1.5em;
}

.team-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1.5em;
}

@media (max-width:56.25em){ /* 900px */
    .team-grid{ grid-template-columns:1fr; }
}

.profile{
    background:var(--card);
    border:0.0625em solid rgba(20,60,40,.08);
    border-radius:1.125em; /* 18px */
    box-shadow:var(--shadow);
    padding:1.5em;
    display:grid;
    grid-template-columns:7.5em 1fr; /* 120px */
    gap:1.125em; /* 18px */
    align-items:center;
}

@media (max-width:38.75em){ /* 620px */
    .profile{
        grid-template-columns:1fr;
        text-align:center;
    }
}

.profile img{
    width:7.5em;
    height:7.5em;
    border-radius:50%;
    object-fit:cover;
}

.profile h3{
    margin:0;
    color:var(--ink);
    font-size:1.375em; /* 22px */
}

.role-pill{
    display:inline-block;
    margin-top:0.25em; /* 4px */
    font-size:0.75em;  /* 12px */
    font-weight:700;
    padding:0.375em 0.625em; /* 6px 10px */
    border-radius:999em;
    background:var(--pink-pill);
    color:var(--ink);
}

.profile p{
    margin:0.625em 0 0; /* 10px top */
}

/* Values block */
.about-values{
    background:linear-gradient(180deg,#fbfaf6,#fff);
    border-top:0.0625em solid rgba(20,60,40,.06);
    border-bottom:0.0625em solid rgba(20,60,40,.06);
}

.about-values .wrap{
    max-width:68.75em; /* 1100px */
    margin:0 auto;
    padding:4em 1.5em;
    text-align:center;
}

.values-title{
    font-family:Cinzel,serif;
    color:var(--ink);
    font-size:clamp(1.5em,2.2vw,2.25em); /* 24–36px */
    font-weight:700;
    margin:0 0 0.5em;
}

.values-intro{
    color:var(--sub);
    margin:0 auto 2.5em;
    max-width:43.75em; /* 700px */
    line-height:1.6;
}

/* 4-up desktop, 2-up tablet, 1-up mobile */
.values-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:1.25em; /* 20px */
    margin-bottom:1.75em; /* 28px */
}

@media (max-width:61.25em){ /* 980px */
    .values-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width:40em){ /* 640px */
    .values-grid{ grid-template-columns:1fr; }
}

.values-grid .value{
    background:var(--card,#fff);
    border:0.0625em solid rgba(20,60,40,.08);
    border-radius:1em; /* 16px */
    box-shadow:var(--shadow,0 0.625em 1.875em rgba(20,60,40,.08));
    padding:1.75em 1.25em 1.5em; /* 28 20 24px */
    text-align:center;
}

.val-icon{
    width:2.75em;  /* 44px */
    height:2.75em;
    margin:0 auto 0.75em; /* 12px */
    border-radius:0.75em; /* 12px */
    background:var(--pink-pill);
    display:flex;
    align-items:center;
    justify-content:center;
}

.val-icon svg{
    width:1.375em;  /* 22px */
    height:1.375em;
    stroke:var(--ink);
}

.value h4{
    margin:0 0 0.5em; /* 8px */
    font-family:Inter,sans-serif;
    font-weight:700;
    color:var(--ink);
    font-size:1.125em; /* 18px */
}

.value p{
    margin:0;
    font-size:0.9375em; /* 15px */
    line-height:1.7;
    color:var(--text);
}

.values-cta{
    margin:1.5em auto 0; /* 24px */
    font-weight:600;
    color:var(--ink);
    font-size:1em;
}

/* Standards (small text section) */
.about-standards .wrap{
    max-width:60em; /* 960px */
    margin:0 auto;
    padding:2.5em 1.5em; /* 40px 24px */
    text-align:center;
}

.about-standards h2{
    font-family:Cinzel,serif;
    color:var(--ink);
    margin:0 0 0.75em;
    font-weight:700;
}

.about-standards p{
    margin:0 auto 0.75em;
    line-height:1.8;
    max-width:78ch;
}

.standards-list{
    list-style:none;
    padding:0;
    margin:0.625em auto 0; /* 10px */
    max-width:45em;
    color:var(--text);
}

.standards-list li{
    margin:0.5em 0; /* 8px */
}

/* CTA footer */
.about-cta{
    text-align:center;
    padding:4em 1.5em; /* 64px 24px */
}

.about-cta h2{
    font-family:Cinzel,serif;
    color:var(--ink);
    margin:0 0 0.875em; /* 14px */
}

.btn-primary{
    display:inline-block;
    padding:0.75em 1.25em; /* 12px 20px */
    border-radius:999em;
    background:var(--ink);
    color:#fff;
    text-decoration:none;
    font-weight:700;
    letter-spacing:.02em;
    box-shadow:0 0.375em 1.125em rgba(31,45,40,.18); /* 6px 18px */
}

.btn-primary:hover{
    transform:translateY(-0.0625em);
}
