/* ============================================================================
   Ink Modernist: Architect product page (/ink/architect/)
   Page-only additions on top of /css/ink.css.
   ========================================================================== */

/* Product sub-nav row (candidate for shared: Director needs the same) */
.arch-psub {
    position: sticky;
    top: var(--ink-nav-h);
    z-index: 40;
    background: var(--paper);
    display: flex;
    align-items: center;
    gap: 28px;
    height: 52px;
    padding: 0 var(--pad);
    border-bottom: var(--rule) solid var(--ink);
}
.arch-psub .ink-label { margin-right: 8px; }
.arch-psub > a:not(.ink-link) {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
}
.arch-psub > a:not(.ink-link):hover { color: var(--red-text); }
.arch-psub__cta { margin-left: auto; }

/* Section number in labels (01, 02 ...) */
.arch-num {
    margin-right: 14px;
    color: var(--red-text);
    font-weight: 600;
}

/* Hero: second line of the title in light red, as on the homepage */
.arch-hero__title .ink-red {
    display: block;
    font-weight: 400;
    font-stretch: 106%;
    letter-spacing: 0;
}
.arch-hero .ink-actions { margin-top: 28px; }

/* Stats */
.arch-stats .ink-cell { padding-top: 26px; padding-bottom: 28px; }

/* How it works: step rows */
.arch-step__body { margin-top: 20px; }
.ink-detail .arch-bullets li {
    display: block;
    position: relative;
    padding-left: 24px;
}
.ink-detail .arch-bullets li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 23px;
    width: 8px;
    height: 8px;
    background: var(--red);
}

/* Before / after */
.arch-compare .ink-h3 + .ink-checks { margin-top: 20px; }
.arch-compare .ink-cell { padding-bottom: 36px; }
.arch-checks--muted li::before { background: var(--grey-500); }
.arch-compare .ink-band--ink .ink-checks li { color: var(--paper); }

/* Field notes: the section head row carries the label, so the lead starts with the quote */
.arch-notes .ink-notes__lead { padding-top: 30px; }
.arch-notes .ink-notes__lead blockquote { margin-top: 0; }

/* Pipeline cross-link */
.arch-pipeline__lede { margin-top: 17px; }
.arch-here { display: inline-block; margin-top: 19px; }
.ink a.ink-cardlink .arch-cardlink__cta { align-self: flex-start; }

/* Integrations: five engine cells */
.arch-tools { grid-template-columns: repeat(5, 1fr); }
.arch-tool { padding: 30px var(--pad) 28px; }
.arch-tool__mark {
    display: block;
    width: 40px;
    height: 40px;
    object-fit: contain;
    color: var(--ink);
}
.arch-tool__mark--logo {             /* white source logos drawn in ink */
    width: auto;
    max-width: 100%;
    filter: brightness(0);
}
.arch-tool .ink-h4 { display: block; margin-top: 18px; }

/* Positioning statement */
.arch-statement {
    padding: 44px var(--pad) 46px;
    border-bottom: var(--rule) solid var(--ink);
}
.arch-statement p {
    max-width: 34em;
    font-size: 2.2vw;
    line-height: 1.25;
    font-stretch: 104%;
}
.arch-statement strong { color: var(--red-text); }

/* Pricing */
.arch-pricing .ink-cell { padding-top: 32px; padding-bottom: 34px; }
.arch-price {
    margin-top: 10px;
    font-size: 5.4vw;
    line-height: 0.94;
    color: var(--red-text);
}
.arch-pricing .ink-actions { margin-top: 28px; }
.arch-price__note {
    margin-top: 24px;
    padding-top: 18px;
    border-top: var(--rule) solid var(--ink);
}
.arch-price__note .ink-body { margin-top: 6px; }

/* Closing CTA: title left, copy and buttons right */
.arch-cta > .ink-cell:last-child { padding-top: 38px; padding-bottom: 39px; }
.arch-cta.ink-cta p:not(.ink-label) { margin-top: 0; }
.arch-cta .ink-actions { margin-top: 24px; }
.arch-underline {
    text-decoration: underline;
    text-decoration-color: var(--red);
    text-decoration-thickness: 0.09em;
    text-underline-offset: 0.12em;
}

/* FAQ: question rules run edge to edge inside the right two thirds */
.arch-faq .ink-faq { border-bottom: 0; }
.arch-faq .ink-faq details:first-child { border-top: 0; }
.arch-faq .ink-faq summary { padding: 20px var(--pad); }
.arch-faq .ink-faq__answer { padding: 0 var(--pad) 24px; }

/* Build record */
.arch-record__link { margin-top: 22px; }

/* ---------------------------------------------------------------------------
   Smaller screens
   ------------------------------------------------------------------------- */

@media (max-width: 860px) {
    .arch-psub {
        height: auto;
        flex-wrap: wrap;
        gap: 10px 20px;
        padding-top: 14px;
        padding-bottom: 14px;
    }
    .arch-psub .ink-label { width: 100%; margin-right: 0; }
    .arch-psub__cta { margin-left: 0; }

    .arch-stats { grid-template-columns: 1fr 1fr; }

    .arch-tools { grid-template-columns: 1fr 1fr; }
    .arch-tools > :last-child { grid-column: 1 / -1; }

    .arch-statement p { font-size: 24px; line-height: 1.3; }
    .arch-price { font-size: 64px; }
    .arch-cta > .ink-cell:first-child { padding-bottom: 30px; }
    .arch-cta > .ink-cell:last-child { padding-top: 30px; }
}

/* Feature grid: six cards, three per row */
.arch-features { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 860px) { .arch-features { grid-template-columns: 1fr; } }

/* Pricing strip: tier summary list */
.arch-price__from { margin-top: 10px; color: var(--grey-700); }
.arch-pricing .ink-checks li { font-size: 15px; line-height: 22px; }