/*
 * The homepage's ONE content column (Rorie, 2026-10-06, on alpha: "line up all the boxes of the main
 * content column" and "make the what's hot box sit in the left hand space with margin").
 *
 * Before this every section set its own width: the hero, the search card and Company Intelligence at
 * 900px, the Get Feedback / Create teaser tiles at 1100, the long sections at 1200 with their own padding
 * and inner boxes (1152, 1085, 880). At 1440 their left edges ran from 144 to 280px. Now every box shares
 * one centred column, --home-col, and its left edge is the same pixel in every section.
 *
 * The column is 1100px, or the window less 32px a side when narrower: the edges line up whether or not
 * anything sits beside it. Only where the What's Hot card is actually drawn (js/whats-hot.js sets
 * html.has-whats-hot after an explicit whatsHot: true) does it give up a gutter for the card: 240px with 24px
 * from the window and 24px clear of the column, 288px a side, from 1280 wide up; 200px (248 a side) from 1024;
 * below that the card is the pill and the column is unchanged. So while the card is dark (prod), the only change is the alignment.
 * A phone keeps its own layout. The embedded investor-matching page (body.embed-mode) is not the homepage.
 */
:root { --home-col: min(1100px, calc(100vw - 64px)); }
@media (min-width: 1280px) { html.has-whats-hot { --home-col: min(1100px, calc(100vw - 576px)); } }
/* A desktop window under 1280 keeps the card open at 200px: 24 + 200 + 24 a side (Rorie, 2026-10-06: the pill
   only where there is genuinely no room). Under 1024 the card is the pill and the column is not narrowed. */
@media (min-width: 1024px) and (max-width: 1279px) { html.has-whats-hot { --home-col: min(1100px, calc(100vw - 496px)); } }

@media (min-width: 769px) {
    body:not(.embed-mode) .dealos-hero,
    body:not(.embed-mode) #investor-matching .intel-chat-window,
    body:not(.embed-mode) #pilotLoop,
    body:not(.embed-mode) #pilotSamples,
    body:not(.embed-mode) .ci2,
    body:not(.embed-mode) .intel-cta-cards,
    body:not(.embed-mode) #company-intelligence .ci-layout,
    body:not(.embed-mode) .section,
    body:not(.embed-mode) .testimonial,
    body:not(.embed-mode) .footer {
        box-sizing: border-box;
        width: var(--home-col);
        max-width: var(--home-col);
        margin-left: auto;
        margin-right: auto;
        padding-left: 0;
        padding-right: 0;
    }
    /* The boxes inside a section fill the column instead of setting their own width. */
    body:not(.embed-mode) .ir-inner,
    body:not(.embed-mode) .changelog .changelog-inner,
    body:not(.embed-mode) .trust-grid,
    body:not(.embed-mode) .faq,
    body:not(.embed-mode) #company-intelligence .intel-chat-window,
    body:not(.embed-mode) .bento {
        max-width: none;
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
    }
    /* Company Intelligence's grid IS the column (its search, and the recent-searches rail beside it when
       there is one), not a 900px track centred inside it. */
    body:not(.embed-mode) #company-intelligence .ci-layout { grid-template-columns: minmax(0, 1fr); justify-content: stretch; }
    body:not(.embed-mode) #company-intelligence .ci-layout.has-recent { grid-template-columns: 210px minmax(0, 1fr); }
    /* The live Deal Pilot on the homepage was the one box wider than the rest (Rorie, 2026-10-06: "deal pilot is
       wider than the other page sections"): its mount carries an inline 900px, so the column has to say so. */
    body:not(.embed-mode) #dealPilotIntelMount {
        box-sizing: border-box;
        width: var(--home-col) !important;
        max-width: var(--home-col) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    body:not(.embed-mode) #dealPilotIntelMount > * { max-width: none; }
    /* The closing call to action is a full-width band; what is IN it keeps to the column. */
    body:not(.embed-mode) .cta-section > * {
        box-sizing: border-box;
        max-width: var(--home-col);
        margin-left: auto;
        margin-right: auto;
    }
    /* Boxes that set their own width inside a section (the titles at 800px, Company Intelligence's source pills,
       the footer's link row) never run past the column when it is narrow (704px at 1280 beside the card). */
    body:not(.embed-mode) .section-title { max-width: min(800px, var(--home-col)); }
    body:not(.embed-mode) #companyIntelSourcePills { max-width: min(760px, var(--home-col)); }
    body:not(.embed-mode) .footer-links { max-width: min(800px, var(--home-col)); }
}