/**
 * SphereNexus Editorial Pro v2.5.5
 * Light sports/technology treatment, compact trending ribbons and About page.
 */

.sn-sport-tech-section {
    padding: 48px 0 52px !important;
    background: linear-gradient(135deg, #f7fbfb 0%, #fff 48%, #f7f9fd 100%) !important;
    border-block: 1px solid #dbe7eb;
}

.sn-sport-tech-intro {
    border-bottom-color: #d5e2e7 !important;
}

.sn-sport-tech-intro span,
.sn-sport-tech-header > a,
.sn-sport-tech-stories .story-card__category,
.sn-sport-tech-stories .sn-read-more-link {
    color: #078f89 !important;
}

.sn-sport-tech-intro h2,
.sn-sport-tech-header h3,
.sn-sport-tech-stories .story-card__title,
.sn-sport-tech-stories .story-card__title a {
    color: #09223a !important;
}

.sn-sport-tech-lane + .sn-sport-tech-lane {
    border-left-color: #d5e2e7 !important;
}

.sn-sport-tech-header > div > span {
    color: var(--lane-accent) !important;
    background: color-mix(in srgb, var(--lane-accent) 10%, white) !important;
    border-color: color-mix(in srgb, var(--lane-accent) 28%, #d7e5e8) !important;
}

.sn-sport-tech-stories .story-card {
    border-bottom-color: #dce7eb !important;
}

.sn-sport-tech-stories .post-meta {
    color: #708093 !important;
}

.sn-sport-tech-stories .story-card__media {
    background: #eef4f5;
    box-shadow: 0 9px 24px rgba(9, 34, 58, .08);
}

/* Short category ribbons inside Trending Now cards. */
.trending-section .story-card__category {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    min-height: 25px;
    margin: 0 0 9px !important;
    padding: 5px 20px 5px 10px !important;
    color: #fff !important;
    background: #078f89 !important;
    clip-path: polygon(0 0, 92% 0, 100% 50%, 92% 100%, 0 100%, 6px 50%);
    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 1.15;
    letter-spacing: .07em;
    text-transform: uppercase;
}

/* Professional About page. */
.sn-about-page {
    padding: 28px 0 70px;
    background: linear-gradient(180deg, #fff 0%, #f7fbfb 100%);
}

.sn-about-page .breadcrumbs { margin-bottom: 22px; }

.sn-about-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
    gap: 36px;
    align-items: center;
    padding: clamp(34px, 5vw, 66px);
    border: 1px solid #d7e5e9;
    border-radius: 8px 34px 8px 34px;
    background: #fff;
    box-shadow: 0 24px 58px rgba(9, 34, 58, .08);
}

.sn-about-hero::after {
    content: '';
    position: absolute;
    right: -95px;
    top: -120px;
    width: 310px;
    height: 310px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(9, 160, 151, .17), rgba(9, 160, 151, 0) 70%);
}

.sn-about-kicker,
.sn-about-section-kicker {
    display: block;
    margin-bottom: 10px;
    color: #078f89;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.sn-about-hero h1 {
    max-width: 720px;
    margin: 0 0 17px;
    color: #09223a;
    font-size: clamp(36px, 5vw, 64px) !important;
    font-weight: 600 !important;
    line-height: 1.04;
}

.sn-about-hero p {
    max-width: 720px;
    margin: 0;
    color: #52657a;
    font-size: 17px;
    line-height: 1.75;
}

.sn-about-hero__mark {
    position: relative;
    z-index: 1;
    padding: 29px;
    border: 1px solid #cfe3e6;
    border-radius: 22px 6px 22px 6px;
    background: linear-gradient(145deg, #eaf7f6, #f6fafc);
}

.sn-about-hero__mark strong {
    display: block;
    margin-bottom: 9px;
    color: #09223a;
    font-size: 25px;
    font-weight: 600;
}

.sn-about-hero__mark span { color: #607387; line-height: 1.65; }

.sn-about-values {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin: 26px 0 64px;
}

.sn-about-value {
    padding: 25px;
    border: 1px solid #d8e5e9;
    border-radius: 6px 22px 6px 22px;
    background: #fff;
}

.sn-about-value b {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    margin-bottom: 18px;
    border-radius: 10px 3px 10px 3px;
    color: #078f89;
    background: #e8f7f5;
    font-size: 15px;
}

.sn-about-value h2,
.sn-about-split h2,
.sn-about-coverage h2,
.sn-about-standards h2,
.sn-about-cta h2 {
    margin: 0 0 10px;
    color: #09223a;
    font-size: 24px !important;
    font-weight: 600 !important;
}

.sn-about-value p,
.sn-about-split p,
.sn-about-coverage p,
.sn-about-standards p { margin: 0; color: #607387; line-height: 1.7; }

.sn-about-split {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 38px;
    align-items: center;
    margin-bottom: 64px;
    padding: 42px;
    border-radius: 28px 7px 28px 7px;
    color: #fff;
    background: #09223a;
}

.sn-about-split h2 { color: #fff; font-size: 30px !important; }
.sn-about-split p { color: #c8d5df; }
.sn-about-process { display: grid; gap: 12px; }
.sn-about-step { display: grid; grid-template-columns: 37px 1fr; gap: 14px; align-items: start; padding: 16px; border: 1px solid rgba(255,255,255,.13); border-radius: 14px 4px 14px 4px; background: rgba(255,255,255,.05); }
.sn-about-step b { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; color: #09223a; background: #74d8d0; font-size: 11px; }
.sn-about-step strong { display: block; margin-bottom: 3px; font-weight: 600; }
.sn-about-step span { color: #b7c8d5; font-size: 13px; line-height: 1.5; }

.sn-about-coverage { margin-bottom: 64px; text-align: center; }
.sn-about-topic-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-top: 26px; }
.sn-about-topic { display: flex; align-items: center; gap: 11px; padding: 17px; border: 1px solid #d9e6e9; border-radius: 5px 16px 5px 16px; color: #17334c; background: #fff; font-size: 13px; font-weight: 500; text-align: left; }
.sn-about-topic span { color: #078f89; }

.sn-about-standards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 38px;
    align-items: center;
    margin-bottom: 64px;
    padding: 42px;
    border: 1px solid #d7e5e9;
    border-radius: 7px 28px 7px 28px;
    background: #fff;
}
.sn-about-checks { display: grid; gap: 10px; }
.sn-about-checks span { display: flex; gap: 10px; align-items: center; padding: 12px 14px; border-radius: 10px 3px 10px 3px; color: #29435b; background: #f1f8f8; font-size: 13px; }
.sn-about-checks b { color: #078f89; }

.sn-about-cta {
    padding: 40px;
    border-radius: 26px 7px 26px 7px;
    text-align: center;
    background: linear-gradient(135deg, #dff5f2, #eef4fc);
}
.sn-about-cta p { margin: 0 auto 20px; max-width: 670px; color: #52657a; }
.sn-about-cta a { display: inline-flex; padding: 12px 20px; border-radius: 10px 3px 10px 3px; color: #fff; background: #09223a; font-size: 12px; font-weight: 600; }

@media (max-width: 900px) {
    .sn-sport-tech-lane + .sn-sport-tech-lane { border-left: 0 !important; border-top-color: #d5e2e7 !important; }
    .sn-about-hero, .sn-about-split, .sn-about-standards { grid-template-columns: 1fr; }
    .sn-about-values { grid-template-columns: 1fr; }
    .sn-about-topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .sn-about-page { padding-top: 18px; }
    .sn-about-hero, .sn-about-split, .sn-about-standards, .sn-about-cta { padding: 26px 20px; }
    .sn-about-hero h1 { font-size: 38px !important; }
    .sn-about-topic-grid { grid-template-columns: 1fr; }
}
