/* ============================================================
   subscribe.css — 1:1 with Figma 6003:4623.
   Centered, vertical stack: H3 title + p-L subtitle + rounded button.
   ============================================================ */

.darom-subscribe {
    padding: 64px 0;
    background: transparent;       /* show .darom-page gray (#f4f5f4) */
    border-top: 1px solid var(--c-line);
}
.darom-subscribe-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    text-align: center;
}
.darom-subscribe-title {
    margin: 0;
    font-size: var(--t-h3);            /* 43px Medium */
    line-height: var(--t-h3-lh);
    font-weight: 500;
    color: var(--c-ink-soft);
    letter-spacing: -1px;
}
.darom-subscribe-sub {
    margin: 0;
    font-size: var(--t-pL);
    line-height: var(--t-pL-lh);
    color: var(--c-ink-soft);
}
.darom-subscribe-cta {
    display: flex;
    /* Markup is [svg, span] — row-reverse + RTL parent puts the svg arrow
       on the visual LEFT and the text on the visual RIGHT (start edge). */
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%;
    padding: 16px 64px 16px 54px;
    border: 1px solid var(--c-line);
    border-radius: 9999px;
    background: var(--c-white);
    color: var(--c-ink);
    font-size: var(--t-pL);
    font-weight: 700;
    letter-spacing: -1px;
    line-height: 1;
    height: 56px;
    text-decoration: none;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.darom-subscribe-cta:hover {
    background: var(--c-ink);
    color: var(--c-white);
    border-color: var(--c-ink);
}
.darom-subscribe-cta svg { flex-shrink: 0; }

.darom-subscribe-follow {
    margin: 0;
    font-size: var(--t-pL);
    line-height: var(--t-pL-lh);
    color: var(--c-ink-soft);
}

.darom-subscribe-social {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
}
.darom-subscribe-social li {
    display: inline-flex;
}
.darom-subscribe-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: var(--c-ink-soft);
    transition: opacity .15s ease;
}
.darom-subscribe-social-link:hover { opacity: .7; }
.darom-subscribe-social-link svg { width: 24px; height: 24px; display: block; }

@media (max-width: 760px) {
    .darom-subscribe { padding: 36px 0; }
    .darom-subscribe-inner { gap: 20px; }
    .darom-subscribe-title { font-size: 18px; line-height: 22px; }
    .darom-subscribe-sub { font-size: 14px; line-height: 22px; }
    .darom-subscribe-cta { padding: 14px 24px; font-size: 13px; height: 48px; gap: 10px; }
    .darom-subscribe-follow { font-size: 14px; line-height: 22px; }
    .darom-subscribe-social { gap: 14px; }
}
