.cc-hero {
    color: #f6f3ea;
    background:
        radial-gradient(480px 300px at var(--mx, 78%) var(--my, 42%), rgba(244, 201, 45, .16), transparent 60%),
        #14110c;
}

.cc-hero .gw-kicker { color: #e4b423; }
.cc-hero .gw-lead { color: #e6dccb; }
.cc-hero h1 { max-width: 16ch; }

.cc-hero-grid {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 36px;
    align-items: center;
}

.cc-quad {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: 1px solid rgba(244, 201, 45, .7);
}

.cc-quad div {
    min-height: 120px;
    padding: 18px;
    border-right: 1px solid rgba(244, 201, 45, .4);
    border-bottom: 1px solid rgba(244, 201, 45, .4);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 28px;
}

.cc-quad div:nth-child(2n) { border-right: 0; }
.cc-quad div:nth-child(n + 3) { border-bottom: 0; }

.cc-quad b {
    display: block;
    margin-bottom: 8px;
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    letter-spacing: .16em;
    color: #e4b423;
    font-weight: 500;
}

.cc-four {
    background: #f6f1e4;
    color: #1b1712;
    padding: 88px 0 72px !important;
}

.cc-four .gw-kicker,
.cc-key .gw-kicker,
.cc-faq .gw-kicker { color: #8a6420; }

.cc-blocks {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    margin-top: 12px;
    border-top: 1px solid #1b1712;
    border-left: 1px solid #1b1712;
}

.cc-blocks article {
    padding: 22px 22px 18px;
    border-right: 1px solid #1b1712;
    border-bottom: 1px solid #1b1712;
    background: #fffdf8;
}

.cc-blocks article:nth-child(2),
.cc-blocks article:nth-child(3) { background: #1b1712; color: #f6f1e4; }

.cc-blocks span {
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #8a6420;
}

.cc-blocks article:nth-child(2) span,
.cc-blocks article:nth-child(3) span { color: #e4b423; }

.cc-four h2,
.cc-key h2,
.cc-faq h2 {
    margin: 8px 0 10px;
    font-size: clamp(28px, 3vw, 36px);
    font-weight: 500;
    line-height: 1.15;
}

.cc-blocks p,
.cc-key p { margin: 0; font-weight: 300; line-height: 1.65; }

.cc-key {
    background: #efe6d4;
    color: #1b1712;
    padding: 88px 0 72px !important;
}

.cc-key h2 { font-size: clamp(34px, 4vw, 48px); }

.cc-key-grid {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 28px;
    align-items: center;
}

.cc-compare {
    background: #fffdf8;
    padding: 8px 22px;
    box-shadow: 8px 8px 0 #1b1712;
}

.cc-compare p {
    padding: 16px 0;
    border-bottom: 1px solid rgba(27, 23, 18, .15);
    font-size: 20px !important;
}

.cc-compare p:last-child { border-bottom: 0; }
.cc-compare b { font-family: "Playfair Display", Georgia, serif; font-weight: 500; }

.cc-no {
    background: #14110c;
    color: #f6f3ea;
    padding: 80px 0 64px !important;
}

.cc-no .gw-kicker { color: #e4b423; }

.cc-list {
    list-style: none;
    margin: 8px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.cc-list li {
    padding: 18px 16px;
    border: 1px solid rgba(244, 201, 45, .4);
    font-size: 20px;
    line-height: 1.4;
}

.cc-faq {
    background: #f6f1e4;
    color: #1b1712;
    padding: 80px 0 64px !important;
}

.cc-faq h2 { font-size: clamp(32px, 4vw, 46px); max-width: 18ch; }

@media (max-width: 900px) {
    .cc-hero-grid,
    .cc-blocks,
    .cc-key-grid,
    .cc-list { grid-template-columns: 1fr; }
    .cc-compare { box-shadow: 6px 6px 0 #1b1712; }
}