/**
 * lp-bs3-grid.css
 *
 * Bootstrap 3-compatible grid scoped under .lp-ghost-wrap and .lp-pub-wrap.
 * Overrides Bootstrap 5's flex-based grid so the LP layout
 * (float-based col-sm-* columns) renders correctly.
 *
 * Loaded on both the Ghostwriting LP page and the Publishing LP page.
 */

/* ── Reset row to float-based (override BS5 flex) ────────────── */
.lp-ghost-wrap .row,
.lp-pub-wrap .row {
    display:      block       !important;
    margin-left:  -15px       !important;
    margin-right: -15px       !important;
    margin-top:   0           !important;   /* reset BS5 gutter-y */
}
.lp-ghost-wrap .row::before,
.lp-ghost-wrap .row::after,
.lp-pub-wrap .row::before,
.lp-pub-wrap .row::after {
    content: "" !important;
    display: table !important;
    clear:   both  !important;
}

/* ── Base column styles ───────────────────────────────────────── */
.lp-ghost-wrap .col-12,
.lp-ghost-wrap .col-xs-1,  .lp-ghost-wrap .col-xs-2,  .lp-ghost-wrap .col-xs-3,
.lp-ghost-wrap .col-xs-4,  .lp-ghost-wrap .col-xs-5,  .lp-ghost-wrap .col-xs-6,
.lp-ghost-wrap .col-xs-7,  .lp-ghost-wrap .col-xs-8,  .lp-ghost-wrap .col-xs-9,
.lp-ghost-wrap .col-xs-10, .lp-ghost-wrap .col-xs-11, .lp-ghost-wrap .col-xs-12,
.lp-ghost-wrap .col-sm-1,  .lp-ghost-wrap .col-sm-2,  .lp-ghost-wrap .col-sm-3,
.lp-ghost-wrap .col-sm-4,  .lp-ghost-wrap .col-sm-5,  .lp-ghost-wrap .col-sm-6,
.lp-ghost-wrap .col-sm-7,  .lp-ghost-wrap .col-sm-8,  .lp-ghost-wrap .col-sm-9,
.lp-ghost-wrap .col-sm-10, .lp-ghost-wrap .col-sm-11, .lp-ghost-wrap .col-sm-12,
.lp-ghost-wrap .col-md-1,  .lp-ghost-wrap .col-md-2,  .lp-ghost-wrap .col-md-3,
.lp-ghost-wrap .col-md-4,  .lp-ghost-wrap .col-md-5,  .lp-ghost-wrap .col-md-6,
.lp-ghost-wrap .col-md-7,  .lp-ghost-wrap .col-md-8,  .lp-ghost-wrap .col-md-9,
.lp-ghost-wrap .col-md-10, .lp-ghost-wrap .col-md-11, .lp-ghost-wrap .col-md-12,
.lp-ghost-wrap .col-lg-1,  .lp-ghost-wrap .col-lg-2,  .lp-ghost-wrap .col-lg-3,
.lp-ghost-wrap .col-lg-4,  .lp-ghost-wrap .col-lg-5,  .lp-ghost-wrap .col-lg-6,
.lp-ghost-wrap .col-lg-7,  .lp-ghost-wrap .col-lg-8,  .lp-ghost-wrap .col-lg-9,
.lp-ghost-wrap .col-lg-10, .lp-ghost-wrap .col-lg-11, .lp-ghost-wrap .col-lg-12,
.lp-pub-wrap .col-12,
.lp-pub-wrap .col-xs-1,  .lp-pub-wrap .col-xs-2,  .lp-pub-wrap .col-xs-3,
.lp-pub-wrap .col-xs-4,  .lp-pub-wrap .col-xs-5,  .lp-pub-wrap .col-xs-6,
.lp-pub-wrap .col-xs-7,  .lp-pub-wrap .col-xs-8,  .lp-pub-wrap .col-xs-9,
.lp-pub-wrap .col-xs-10, .lp-pub-wrap .col-xs-11, .lp-pub-wrap .col-xs-12,
.lp-pub-wrap .col-sm-1,  .lp-pub-wrap .col-sm-2,  .lp-pub-wrap .col-sm-3,
.lp-pub-wrap .col-sm-4,  .lp-pub-wrap .col-sm-5,  .lp-pub-wrap .col-sm-6,
.lp-pub-wrap .col-sm-7,  .lp-pub-wrap .col-sm-8,  .lp-pub-wrap .col-sm-9,
.lp-pub-wrap .col-sm-10, .lp-pub-wrap .col-sm-11, .lp-pub-wrap .col-sm-12,
.lp-pub-wrap .col-md-1,  .lp-pub-wrap .col-md-2,  .lp-pub-wrap .col-md-3,
.lp-pub-wrap .col-md-4,  .lp-pub-wrap .col-md-5,  .lp-pub-wrap .col-md-6,
.lp-pub-wrap .col-md-7,  .lp-pub-wrap .col-md-8,  .lp-pub-wrap .col-md-9,
.lp-pub-wrap .col-md-10, .lp-pub-wrap .col-md-11, .lp-pub-wrap .col-md-12,
.lp-pub-wrap .col-lg-1,  .lp-pub-wrap .col-lg-2,  .lp-pub-wrap .col-lg-3,
.lp-pub-wrap .col-lg-4,  .lp-pub-wrap .col-lg-5,  .lp-pub-wrap .col-lg-6,
.lp-pub-wrap .col-lg-7,  .lp-pub-wrap .col-lg-8,  .lp-pub-wrap .col-lg-9,
.lp-pub-wrap .col-lg-10, .lp-pub-wrap .col-lg-11, .lp-pub-wrap .col-lg-12 {
    position:   relative    !important;
    float:      left        !important;
    min-height: 1px         !important;
    padding-left:  15px     !important;
    padding-right: 15px     !important;
    -webkit-box-sizing: border-box !important;
            box-sizing: border-box !important;
    flex: none              !important;
}

/* ── col-12 always full width (BS5 utility class) ───────────── */
.lp-ghost-wrap .col-12,
.lp-pub-wrap .col-12 { width: 100% !important; }

/* ── xs widths (always apply) ───────────────────────────────── */
.lp-ghost-wrap .col-xs-1,  .lp-pub-wrap .col-xs-1  { width:  8.33333% !important; }
.lp-ghost-wrap .col-xs-2,  .lp-pub-wrap .col-xs-2  { width: 16.66667% !important; }
.lp-ghost-wrap .col-xs-3,  .lp-pub-wrap .col-xs-3  { width: 25%       !important; }
.lp-ghost-wrap .col-xs-4,  .lp-pub-wrap .col-xs-4  { width: 33.33333% !important; }
.lp-ghost-wrap .col-xs-5,  .lp-pub-wrap .col-xs-5  { width: 41.66667% !important; }
.lp-ghost-wrap .col-xs-6,  .lp-pub-wrap .col-xs-6  { width: 50%       !important; }
.lp-ghost-wrap .col-xs-7,  .lp-pub-wrap .col-xs-7  { width: 58.33333% !important; }
.lp-ghost-wrap .col-xs-8,  .lp-pub-wrap .col-xs-8  { width: 66.66667% !important; }
.lp-ghost-wrap .col-xs-9,  .lp-pub-wrap .col-xs-9  { width: 75%       !important; }
.lp-ghost-wrap .col-xs-10, .lp-pub-wrap .col-xs-10 { width: 83.33333% !important; }
.lp-ghost-wrap .col-xs-11, .lp-pub-wrap .col-xs-11 { width: 91.66667% !important; }
.lp-ghost-wrap .col-xs-12, .lp-pub-wrap .col-xs-12 { width: 100%      !important; }

/* ── sm / md / lg widths (≥768 px) ──────────────────────────── */
@media (min-width: 768px) {
    .lp-ghost-wrap .col-sm-1,  .lp-pub-wrap .col-sm-1  { width:  8.33333% !important; }
    .lp-ghost-wrap .col-sm-2,  .lp-pub-wrap .col-sm-2  { width: 16.66667% !important; }
    .lp-ghost-wrap .col-sm-3,  .lp-pub-wrap .col-sm-3  { width: 25%       !important; }
    .lp-ghost-wrap .col-sm-4,  .lp-pub-wrap .col-sm-4  { width: 33.33333% !important; }
    .lp-ghost-wrap .col-sm-5,  .lp-pub-wrap .col-sm-5  { width: 41.66667% !important; }
    .lp-ghost-wrap .col-sm-6,  .lp-pub-wrap .col-sm-6  { width: 50%       !important; }
    .lp-ghost-wrap .col-sm-7,  .lp-pub-wrap .col-sm-7  { width: 58.33333% !important; }
    .lp-ghost-wrap .col-sm-8,  .lp-pub-wrap .col-sm-8  { width: 66.66667% !important; }
    .lp-ghost-wrap .col-sm-9,  .lp-pub-wrap .col-sm-9  { width: 75%       !important; }
    .lp-ghost-wrap .col-sm-10, .lp-pub-wrap .col-sm-10 { width: 83.33333% !important; }
    .lp-ghost-wrap .col-sm-11, .lp-pub-wrap .col-sm-11 { width: 91.66667% !important; }
    .lp-ghost-wrap .col-sm-12, .lp-pub-wrap .col-sm-12 { width: 100%      !important; }

    .lp-ghost-wrap .col-md-1,  .lp-pub-wrap .col-md-1  { width:  8.33333% !important; }
    .lp-ghost-wrap .col-md-2,  .lp-pub-wrap .col-md-2  { width: 16.66667% !important; }
    .lp-ghost-wrap .col-md-3,  .lp-pub-wrap .col-md-3  { width: 25%       !important; }
    .lp-ghost-wrap .col-md-4,  .lp-pub-wrap .col-md-4  { width: 33.33333% !important; }
    .lp-ghost-wrap .col-md-5,  .lp-pub-wrap .col-md-5  { width: 41.66667% !important; }
    .lp-ghost-wrap .col-md-6,  .lp-pub-wrap .col-md-6  { width: 50%       !important; }
    .lp-ghost-wrap .col-md-7,  .lp-pub-wrap .col-md-7  { width: 58.33333% !important; }
    .lp-ghost-wrap .col-md-8,  .lp-pub-wrap .col-md-8  { width: 66.66667% !important; }
    .lp-ghost-wrap .col-md-9,  .lp-pub-wrap .col-md-9  { width: 75%       !important; }
    .lp-ghost-wrap .col-md-10, .lp-pub-wrap .col-md-10 { width: 83.33333% !important; }
    .lp-ghost-wrap .col-md-11, .lp-pub-wrap .col-md-11 { width: 91.66667% !important; }
    .lp-ghost-wrap .col-md-12, .lp-pub-wrap .col-md-12 { width: 100%      !important; }

    .lp-ghost-wrap .col-lg-1,  .lp-pub-wrap .col-lg-1  { width:  8.33333% !important; }
    .lp-ghost-wrap .col-lg-2,  .lp-pub-wrap .col-lg-2  { width: 16.66667% !important; }
    .lp-ghost-wrap .col-lg-3,  .lp-pub-wrap .col-lg-3  { width: 25%       !important; }
    .lp-ghost-wrap .col-lg-4,  .lp-pub-wrap .col-lg-4  { width: 33.33333% !important; }
    .lp-ghost-wrap .col-lg-5,  .lp-pub-wrap .col-lg-5  { width: 41.66667% !important; }
    .lp-ghost-wrap .col-lg-6,  .lp-pub-wrap .col-lg-6  { width: 50%       !important; }
    .lp-ghost-wrap .col-lg-7,  .lp-pub-wrap .col-lg-7  { width: 58.33333% !important; }
    .lp-ghost-wrap .col-lg-8,  .lp-pub-wrap .col-lg-8  { width: 66.66667% !important; }
    .lp-ghost-wrap .col-lg-9,  .lp-pub-wrap .col-lg-9  { width: 75%       !important; }
    .lp-ghost-wrap .col-lg-10, .lp-pub-wrap .col-lg-10 { width: 83.33333% !important; }
    .lp-ghost-wrap .col-lg-11, .lp-pub-wrap .col-lg-11 { width: 91.66667% !important; }
    .lp-ghost-wrap .col-lg-12, .lp-pub-wrap .col-lg-12 { width: 100%      !important; }
}

/* ── Container widths (BS3 breakpoints) ──────────────────────── */
.lp-ghost-wrap .container,
.lp-pub-wrap .container {
    padding-left:  15px !important;
    padding-right: 15px !important;
    margin-left:  auto  !important;
    margin-right: auto  !important;
    -webkit-box-sizing: border-box !important;
            box-sizing: border-box !important;
    max-width: none     !important;
}
@media (min-width: 768px)  {
    .lp-ghost-wrap .container, .lp-pub-wrap .container { width: 750px  !important; }
}
@media (min-width: 992px)  {
    .lp-ghost-wrap .container, .lp-pub-wrap .container { width: 970px  !important; }
}
@media (min-width: 1200px) {
    .lp-ghost-wrap .container, .lp-pub-wrap .container { width: 1170px !important; }
}

/* ── container-fluid (stays 100%) ───────────────────────────── */
.lp-ghost-wrap .container-fluid,
.lp-pub-wrap .container-fluid {
    padding-left:  15px  !important;
    padding-right: 15px  !important;
    margin-left:  auto   !important;
    margin-right: auto   !important;
    width: 100%          !important;
    max-width: none      !important;
}

/* ── BS5 gutter / flex reset inside LP ──────────────────────── */
/*
 * NOTE: we do NOT set width here.
 * Column width is controlled exclusively by the col-* rules above.
 * Removing width:auto here was critical — it was overriding every
 * specific col-* width rule because it came last with equal specificity.
 */
.lp-ghost-wrap .row > *,
.lp-pub-wrap .row > * {
    padding-left:  15px !important;
    padding-right: 15px !important;
    flex:          none !important;
    max-width:     none !important;
    margin-top:    0    !important;
}

/* ── Flex exceptions: rows the LP CSS intentionally makes flex ── */
/*
 * lp-ghostwriting-scoped.css / lp-publishing-scoped.css override certain rows
 * to flex for vertical alignment (head_top, new-call-to-action-sec,
 * .align-items-center, .align-items-end).  We must restore flex here so those
 * scoped rules take effect.  Column widths still apply inside flex
 * (width = flex-basis).
 */
.lp-ghost-wrap .head_top .row,
.lp-ghost-wrap .new-call-to-action-sec .row,
.lp-ghost-wrap .row.align-items-center,
.lp-ghost-wrap .row.align-items-end,
.lp-pub-wrap .head_top .row,
.lp-pub-wrap .new-call-to-action-sec .row,
.lp-pub-wrap .row.align-items-center,
.lp-pub-wrap .row.align-items-end {
    display:   flex      !important;
    flex-wrap: wrap      !important;
}

/* ── Text utilities carried over from BS3 ───────────────────── */
.lp-ghost-wrap .text-right,  .lp-pub-wrap .text-right  { text-align: right  !important; }
.lp-ghost-wrap .text-left,   .lp-pub-wrap .text-left   { text-align: left   !important; }
.lp-ghost-wrap .text-center, .lp-pub-wrap .text-center { text-align: center !important; }

/* ── Padding zero utility ─────────────────────────────────────── */
.lp-ghost-wrap .p0, .lp-pub-wrap .p0 { padding: 0 !important; }

/* ── d-block for inline elements used in LP ─────────────────── */
.lp-ghost-wrap .d-block, .lp-pub-wrap .d-block { display: block !important; }

/* ── my-auto / align-items-center helpers (BS5 utilities used in LP) ── */
.lp-ghost-wrap .my-auto,
.lp-pub-wrap .my-auto { margin-top: auto !important; margin-bottom: auto !important; }

/* ── Section-specific column padding exceptions ──────────────────────
 * The base col-* rule forces padding-left/right: 15px !important.
 * These overrides restore the original LP spacing for specific sections.
 * Higher specificity (4 classes + 1 element vs 2 classes) wins when
 * both declarations carry !important.
 * ──────────────────────────────────────────────────────────────────── */

/* Portfolio carousel: book-cover slides need tight 6px gutter (not 15px) */
.lp-ghost-wrap section.sec_portfolio .resume_inner .col-md-2,
.lp-pub-wrap section.sec_portfolio .resume_inner .col-md-2 {
    padding-left:  6px !important;
    padding-right: 6px !important;
}