/* Comparison page (/compare/free-minecraft-server-hosting). Builds on landing-page.css and faq.css. */
.cmp-hero .hero-title {
    font-size: clamp(1.9rem, 4vw, 2.8rem);
}

.cmp-disclosure {
    max-width: 820px;
    margin: 0 auto 12px;
    font-size: 1.05rem;
    line-height: 1.6;
    color: #c9d1d9;
}

.cmp-correction-short a {
    color: #27b1d9;
    font-weight: 600;
    text-decoration: none;
}

.cmp-correction-short a:hover {
    text-decoration: underline;
}

.cmp-section {
    color: #c9d1d9;
}

.cmp-h3 {
    font-size: 1.2rem;
    font-weight: 700;
    color: #f0f6fc;
    margin-bottom: 10px;
}

.cmp-short-answer {
    max-width: 860px;
    margin: 0 auto;
    padding: 20px 24px;
    background: rgba(39, 177, 217, 0.08);
    border-left: 4px solid #27b1d9;
    border-radius: 10px;
}

.cmp-criteria {
    columns: 2 260px;
    column-gap: 32px;
    max-width: 860px;
    margin: 0 auto;
    padding-left: 1.2rem;
}

.cmp-criteria li {
    margin-bottom: 8px;
    break-inside: avoid;
}

.cmp-correction {
    margin: 0 0 24px;
    padding: 18px 22px;
    background: #161b22;
    border: 1px solid #30363d;
    border-radius: 12px;
    color: #c9d1d9;
}

.cmp-correction-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: #f0f6fc;
    margin-bottom: 8px;
}

.cmp-correction a {
    color: #27b1d9;
}

.cmp-last-verified {
    margin-bottom: 14px;
}

.cmp-table {
    font-size: 0.9rem;
}

.cmp-table thead th {
    vertical-align: bottom;
    min-width: 170px;
}

.cmp-table .cmp-row-head {
    min-width: 170px;
    position: sticky;
    left: 0;
    z-index: 1;
    background: #161b22;
    color: #f0f6fc;
    font-weight: 600;
}

.cmp-host-name {
    display: block;
    font-weight: 700;
    color: #f0f6fc;
}

.cmp-host-link {
    display: block;
    font-size: 0.8rem;
    font-weight: 400;
    color: #8b949e;
    text-transform: none;
}

.cmp-marker,
.cmp-footnote {
    margin-left: 2px;
    font-size: 0.7em;
}

.cmp-marker a,
.cmp-footnote a {
    color: #27b1d9;
    text-decoration: none;
}

.cmp-nv {
    color: #8b949e;
    font-style: italic;
}

.cmp-disputed {
    color: #d29922;
    font-style: italic;
}

.cmp-sep {
    color: #6e7681;
}

.cmp-paid-row td,
.cmp-paid-row th {
    border-top: 2px solid #30363d;
}

.cmp-paid-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 8px;
    border-radius: 50px;
    background: rgba(210, 153, 34, 0.15);
    color: #d29922;
    font-size: 0.75rem;
    font-weight: 600;
}

.cmp-notes,
.cmp-sources ul {
    list-style: none;
    padding-left: 0;
}

.cmp-notes li,
.cmp-sources li {
    margin-bottom: 8px;
    font-size: 0.9rem;
}

.cmp-source-group h4 {
    font-size: 0.95rem;
    font-weight: 700;
    color: #f0f6fc;
    margin: 12px 0 6px;
}

.cmp-source-num {
    display: inline-block;
    min-width: 1.8em;
    color: #8b949e;
}

.cmp-source-url {
    display: block;
    margin-left: 1.8em;
    font-size: 0.75rem;
    color: #6e7681;
    word-break: break-all;
}

.cmp-sources a {
    color: #27b1d9;
}

:target {
    scroll-margin-top: 90px;
}

/* FreeMcServer.net's own column (comparison table and homepage free-plan table): our logo, brand-colour header,
   tinted body, rounded accent border and a soft glow. Logos are for FreeMcServer only; no badge, rating or ranking.
   border-collapse: separate lets the column's corners round; row lines are drawn on the cells instead of the rows. */
.cmp-table,
.cmp-home-table {
    border-collapse: separate;
    border-spacing: 0;
}

.cmp-table > thead > tr > th.cmp-us,
.cmp-table > tbody > tr > td.cmp-us,
.cmp-home-table > thead > tr > th:nth-child(2),
.cmp-home-table > tbody > tr > td:nth-child(2) {
    background-image: linear-gradient(rgba(39, 177, 217, 0.1), rgba(39, 177, 217, 0.1));
    border-left: 2px solid #27b1d9;
    border-right: 2px solid #27b1d9;
    box-shadow: -8px 0 16px -10px rgba(39, 177, 217, 0.7), 8px 0 16px -10px rgba(39, 177, 217, 0.7);
}

.cmp-table > thead > tr > th.cmp-us,
.cmp-home-table > thead > tr > th:nth-child(2) {
    background-image: linear-gradient(180deg, rgba(39, 177, 217, 0.38) 0%, rgba(39, 177, 217, 0.14) 100%);
    border-top: 2px solid #27b1d9;
    border-top-left-radius: 14px;
    border-top-right-radius: 14px;
    box-shadow: 0 -8px 18px -10px rgba(39, 177, 217, 0.8);
    color: #f0f6fc !important; /* overrides .text-success on the homepage header for contrast on the tint */
    text-align: center;
}

.cmp-table > tbody > tr:last-child > td.cmp-us,
.cmp-home-table > tbody > tr:last-child > td:nth-child(2) {
    border-bottom: 2px solid #27b1d9;
    border-bottom-left-radius: 14px;
    border-bottom-right-radius: 14px;
    box-shadow: 0 8px 18px -10px rgba(39, 177, 217, 0.8);
}

.cmp-home-table > tbody > tr:not(:last-child) > td {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.cmp-us-logo {
    display: block;
    width: auto;
    max-width: 100%;
    height: 28px;
    margin: 0 auto 8px;
    filter: drop-shadow(0 2px 8px rgba(0, 174, 238, 0.4));
}

.cmp-table > thead > tr > th.cmp-us .cmp-host-link {
    color: #c9d1d9;
}

.cmp-us-cta {
    display: inline-block;
    margin-top: 8px;
    padding: 4px 12px;
    border-radius: 50px;
    background: #27b1d9;
    color: #0d1117;
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    white-space: normal;
}

.cmp-us-cta:hover,
.cmp-us-cta:focus {
    background: #5cc8e6;
    color: #0d1117;
    text-decoration: none;
}

.cmp-us-cta:focus-visible {
    outline: 2px solid #f0f6fc;
    outline-offset: 2px;
}

.cmp-home-table > thead > tr > th:nth-child(2) .cmp-us-cta {
    display: table;
    margin: 8px auto 0;
}

.cmp-home-table > thead > tr > th:not(:nth-child(2)) {
    border-bottom: 2px solid #30363d;
}

.cmp-table > thead > tr > th.cmp-us,
.cmp-home-table > thead > tr > th:nth-child(2) {
    border-bottom: 1px solid rgba(39, 177, 217, 0.4);
}