/* MyClosingTimeline · Website 14 · PRO-matched centered canvas · 2026-10-28
   Corrects the earlier accidental edge-to-edge page layout.
   Only presentation: no changes to forms, calculations, routes or permissions.
   All visible photographic headlines share the precise left edge of the
   corresponding content panels at every viewport width. */

:root{--mct-approved-page-width:1420px;--mct-approved-page-gutter:20px}

/* 1. Consistent centered content panels on public header destinations. */
html body main.mct-home-final>section#home-essentials.mct-home-essentials,
html body main.mct-home-final>section#free-benefits.mct-home-free,
html body main.mct-home-final>section#pro-benefits.mct-home-pro,
html body.mct-layout-wide:not(.mct-layout-dashboard) main.workspace:not(.mct-home-final),
html body.mct-layout-pro main.mct-pro-registration-main,
html body.mct-layout-pricing main.workspace.mct-sales-page,
html body.mct-layout-reading main.workspace,
html body main.mpt-main,
html body main.mct-invite-page,
html body main.mct-privacy-workspace,
html body.mct-layout-dashboard main.workspace{
 box-sizing:border-box!important;
 width:calc(100% - 40px)!important;
 max-width:var(--mct-approved-page-width)!important;
 min-width:0!important;
 margin-left:auto!important;
 margin-right:auto!important;
}

/* Child sections should fill only their parent, never the viewport. */
html body.mct-layout-pro main.mct-pro-registration-main>.mct-pro-category-privacy-row,
html body.mct-layout-pro main.mct-pro-registration-main>.mct-first-free-banner-pro,
html body.mct-layout-pro main.mct-pro-registration-main>section.card,
html body.mct-layout-pricing main.workspace.mct-sales-page>section,
html body.mct-layout-reading main.workspace>.home-like-panel,
html body main.mpt-main>section,
html body.mct-layout-wide main.workspace>section#contract-deadline-planner.fc-simple-timeline{
 box-sizing:border-box!important;
 width:100%!important;
 max-width:none!important;
 min-width:0!important;
 margin-left:auto!important;
 margin-right:auto!important;
}

/* 2. Full-bleed photographic backdrop, CENTERED text container. */
html body section.intro.mct-photo-hero{
 box-sizing:border-box!important;
 width:100%!important;
 max-width:none!important;
 margin-left:0!important;
 margin-right:0!important;
 padding-left:0!important;
 padding-right:0!important;
 display:flex!important;
 justify-content:center!important;
 align-items:center!important;
}
html body section.intro.mct-photo-hero>.mct-photo-hero-content{
 box-sizing:border-box!important;
 flex:0 1 min(var(--mct-approved-page-width), calc(100% - 40px))!important;
 width:calc(100% - 40px)!important;
 max-width:var(--mct-approved-page-width)!important;
 min-width:0!important;
 margin:0 auto!important;
 padding:0!important;
 text-align:left!important;
}

/* 3. HOME uses a two-column photograph rather than .mct-photo-hero. */
html body main.mct-home-final>section.mct-home-opening{
 box-sizing:border-box!important;
 padding-left:max(20px,calc((100% - 1420px)/2))!important;
 padding-right:max(20px,calc((100% - 1420px)/2))!important;
}

/* 4. Other Projects uses a separate hero without a photo. */
html body section.mpt-hero{
 box-sizing:border-box!important;
 padding-left:max(20px,calc((100% - 1420px)/2))!important;
 padding-right:max(20px,calc((100% - 1420px)/2))!important;
}

/* 5. Admin Console: retain deliberate hidden public photograph. Align the
   actual private heading, practice notice and private navigation instead. */
html body.mct-layout-dashboard .mct-practice-banner,
html body .mct-admin-route{
 box-sizing:border-box!important;
 width:calc(100% - 40px)!important;
 max-width:var(--mct-approved-page-width)!important;
 margin-left:auto!important;
 margin-right:auto!important;
}
html body.mct-layout-dashboard main.workspace>section#mct-admin-quick-practice-links{
 box-sizing:border-box!important;
 width:100%!important;
 max-width:none!important;
 margin-left:0!important;
 margin-right:0!important;
}
html body.mct-layout-dashboard section.intro.mct-photo-hero{
 /* No display override: previous visibility decisions still control this. */
}

/* 6. Tablet and phone: identical 12px gutters, same left line in hero and body. */
@media(max-width:700px){
 html body main.mct-home-final>section#home-essentials.mct-home-essentials,
 html body main.mct-home-final>section#free-benefits.mct-home-free,
 html body main.mct-home-final>section#pro-benefits.mct-home-pro,
 html body.mct-layout-wide:not(.mct-layout-dashboard) main.workspace:not(.mct-home-final),
 html body.mct-layout-pro main.mct-pro-registration-main,
 html body.mct-layout-pricing main.workspace.mct-sales-page,
 html body.mct-layout-reading main.workspace,
 html body main.mpt-main,
 html body main.mct-invite-page,
 html body main.mct-privacy-workspace,
 html body.mct-layout-dashboard main.workspace,
 html body.mct-layout-dashboard .mct-practice-banner,
 html body .mct-admin-route{
  width:calc(100% - 24px)!important;
 }
 html body section.intro.mct-photo-hero>.mct-photo-hero-content{
  flex-basis:calc(100% - 24px)!important;
  width:calc(100% - 24px)!important;
  max-width:none!important;
  padding:0!important;
 }
 html body main.mct-home-final>section.mct-home-opening,
 html body section.mpt-hero{
  padding-left:12px!important;
  padding-right:12px!important;
 }
}

/* 7. Prevent horizontal spreading of the HOME lower sections at desktop widths.
   1420px matches the approved PRO category/Privacy cards shown in the reference.
   Keep every HOME section centered on the same shared left boundary. */
html body main.mct-home-final>section.mct-home-why,
html body main.mct-home-final>section.mct-home-next,
html body main.mct-home-final>p.mct-home-caveat{
 box-sizing:border-box!important;
 width:calc(100% - 40px)!important;
 max-width:var(--mct-approved-page-width)!important;
 margin-left:auto!important;
 margin-right:auto!important;
}
@media(max-width:700px){
 html body main.mct-home-final>section.mct-home-why,
 html body main.mct-home-final>section.mct-home-next,
 html body main.mct-home-final>p.mct-home-caveat{width:calc(100% - 24px)!important}
}
/* 8. Maintain the reference PRO category/Privacy row as a contained pair,
   avoiding the earlier third-column/invitation collision. */
html body.mct-layout-pro main.mct-pro-registration-main>.mct-pro-category-privacy-row{
 grid-template-columns:minmax(0,1fr) minmax(300px,312px)!important;
 gap:15px!important;
 align-items:stretch!important;
}
@media(max-width:900px){
 html body.mct-layout-pro main.mct-pro-registration-main>.mct-pro-category-privacy-row{
  grid-template-columns:minmax(0,1fr)!important;
 }
}

/* 9. Final specificity protection. Some old PHOTO styles use three/four
   classes and had been defeating the later, generic alignment rule.
   These explicit public-page selectors win without stretching the background
   or changing any contractual form. The headline and its body panel use the
   same 1420px centered canvas, measured from the viewport. */
html body.mct-layout-wide section.intro.mct-photo-hero,
html body.mct-layout-pro section.intro.mct-photo-hero.mct-pro-photo-hero{
 box-sizing:border-box!important;
 width:100%!important;
 max-width:none!important;
 margin-left:0!important;
 margin-right:0!important;
 padding-left:0!important;
 padding-right:0!important;
 display:flex!important;
 justify-content:center!important;
 align-items:center!important;
}
html body.mct-layout-wide section.intro.mct-photo-hero>.mct-photo-hero-content,
html body.mct-layout-pro section.intro.mct-photo-hero.mct-pro-photo-hero>.mct-photo-hero-content{
 box-sizing:border-box!important;
 flex:0 1 min(var(--mct-approved-page-width),calc(100% - 40px))!important;
 width:calc(100% - 40px)!important;
 max-width:var(--mct-approved-page-width)!important;
 min-width:0!important;
 margin:0 auto!important;
 padding:0!important;
 text-align:left!important;
}
@media(max-width:700px){
 html body.mct-layout-wide section.intro.mct-photo-hero>.mct-photo-hero-content,
 html body.mct-layout-pro section.intro.mct-photo-hero.mct-pro-photo-hero>.mct-photo-hero-content{
  flex:0 1 calc(100% - 24px)!important;
  width:calc(100% - 24px)!important;
  max-width:none!important;
  margin:0 auto!important;
  padding:0!important;
 }
}
/* 10. HOME's banner title must use that same edge as the three overview
   cards, even when earlier hero-specific CSS sets a different padding. */
html body main.workspace.mct-home-final>section.mct-home-opening{
 box-sizing:border-box!important;
 padding-left:max(20px,calc((100% - var(--mct-approved-page-width))/2))!important;
 padding-right:max(20px,calc((100% - var(--mct-approved-page-width))/2))!important;
}
@media(max-width:700px){
 html body main.workspace.mct-home-final>section.mct-home-opening{
  padding-left:12px!important;
  padding-right:12px!important;
 }
}


/* Website 15 · 1420px unified desktop canvas. HOME INCLUDED.
   Photos retain their established backgrounds. Internal task columns,
   deadlines, storage, permissions and mobile layout are untouched. */
:root{--mct-approved-page-width:1420px;--mct-approved-page-gutter:20px}
html body.mct-layout-wide>main.mct-pro-registration-main,
html body.mct-layout-wide>main.mpt-main,
html body.mct-layout-wide>main.mct-invite-page,
html body.mct-layout-wide>main.mct-privacy-workspace,
html body.mct-layout-wide>main.workspace:not(.mct-home-final),
html body.mct-layout-wide.mct-layout-secondary>main:not(.workspace),
html body.mct-layout-wide.mct-layout-compact>main,
html body.mct-layout-wide.mct-layout-reading>main,
html body.mct-layout-wide.mct-layout-pricing>main{
 box-sizing:border-box!important;
 width:calc(100% - 40px)!important;
 max-width:var(--mct-approved-page-width)!important;
 margin-left:auto!important;margin-right:auto!important;
 padding-left:0!important;padding-right:0!important;min-width:0!important;
}
/* HOME itself keeps the established background composition. The overview
   cards, guidance and headings expand together instead of staying narrow. */
html body main.mct-home-final>section#home-essentials.mct-home-essentials,
html body main.mct-home-final>section#free-benefits.mct-home-free,
html body main.mct-home-final>section#pro-benefits.mct-home-pro,
html body main.mct-home-final>section.mct-home-why,
html body main.mct-home-final>section.mct-home-next,
html body main.mct-home-final>p.mct-home-caveat{
 box-sizing:border-box!important;
 width:calc(100% - 40px)!important;
 max-width:var(--mct-approved-page-width)!important;
 min-width:0!important;
 margin-left:auto!important;margin-right:auto!important;
}
/* Override outdated narrow PRO section cap while preserving form columns. */
html body.mct-layout-pro main.mct-pro-registration-main>section.card{
 box-sizing:border-box!important;width:100%!important;max-width:100%!important;
 margin-left:auto!important;margin-right:auto!important;
}
html body.mct-layout-pricing main.workspace.mct-sales-page>section,
html body.mct-layout-reading main.workspace>.home-like-panel,
html body main.mpt-main>section{max-width:100%!important}
/* Photo heading starts on same left edge as its body panel. */
html body main.workspace.mct-home-final>section.mct-home-opening,
html body section.mpt-hero{
 padding-left:max(20px,calc((100% - var(--mct-approved-page-width))/2))!important;
 padding-right:max(20px,calc((100% - var(--mct-approved-page-width))/2))!important;
}
@media(max-width:700px){
 html body.mct-layout-wide>main.mct-pro-registration-main,
 html body.mct-layout-wide>main.mpt-main,
 html body.mct-layout-wide>main.mct-invite-page,
 html body.mct-layout-wide>main.mct-privacy-workspace,
 html body.mct-layout-wide>main.workspace:not(.mct-home-final),
 html body.mct-layout-wide.mct-layout-secondary>main:not(.workspace),
 html body.mct-layout-wide.mct-layout-compact>main,
 html body.mct-layout-wide.mct-layout-reading>main,
 html body.mct-layout-wide.mct-layout-pricing>main,
 html body main.mct-home-final>section#home-essentials.mct-home-essentials,
 html body main.mct-home-final>section#free-benefits.mct-home-free,
 html body main.mct-home-final>section#pro-benefits.mct-home-pro,
 html body main.mct-home-final>section.mct-home-why,
 html body main.mct-home-final>section.mct-home-next,
 html body main.mct-home-final>p.mct-home-caveat{
  width:calc(100% - 24px)!important;
 }
 html body main.workspace.mct-home-final>section.mct-home-opening,
 html body section.mpt-hero{
  padding-left:12px!important;padding-right:12px!important;
 }
}


/* Website 15 · width correction v6 · PRO's 1420px reference.
   All major page content, including HOME, follows one centered canvas.
   Full-bleed photo backgrounds remain full-bleed; their text starts at
   the same x-position as the sections below. */
:root{--mct-approved-page-width:1420px;}
html body main.workspace.mct-home-final>section#home-essentials.mct-home-essentials,
html body main.workspace.mct-home-final>section#free-benefits.mct-home-free,
html body main.workspace.mct-home-final>section#pro-benefits.mct-home-pro,
html body main.workspace.mct-home-final>section.mct-home-why,
html body main.workspace.mct-home-final>section.mct-home-next,
html body main.workspace.mct-home-final>p.mct-home-caveat,
html body.mct-layout-wide main.workspace:not(.mct-home-final),
html body.mct-layout-wide main.mct-pro-registration-main,
html body.mct-layout-wide main.mpt-main,
html body.mct-layout-wide main.mct-privacy-workspace,
html body.mct-layout-wide main.mct-invite-page{
 box-sizing:border-box!important;
 width:calc(100% - 40px)!important;
 max-width:1420px!important;
 min-width:0!important;
 margin-left:auto!important;
 margin-right:auto!important;
}
/* Legacy PRO and HOME cards should not impose different outer widths.
   Preserve their internal grid columns and reading column widths. */
html body.mct-layout-pro main.mct-pro-registration-main>.mct-pro-category-privacy-row,
html body.mct-layout-pro main.mct-pro-registration-main>.mct-first-free-banner-pro,
html body.mct-layout-pro main.mct-pro-registration-main>section.card,
html body main.workspace.mct-home-final>section#home-essentials.mct-home-essentials,
html body main.workspace.mct-home-final>section#free-benefits.mct-home-free,
html body main.workspace.mct-home-final>section#pro-benefits.mct-home-pro {
 max-width:1420px!important;
}
/* Parallel photographic text and content gutters. */
html body main.workspace.mct-home-final>section.mct-home-opening,
html body section.mpt-hero {
 padding-left:max(20px,calc((100% - 1420px)/2))!important;
 padding-right:max(20px,calc((100% - 1420px)/2))!important;
}
@media(max-width:700px){
 html body main.workspace.mct-home-final>section#home-essentials.mct-home-essentials,
 html body main.workspace.mct-home-final>section#free-benefits.mct-home-free,
 html body main.workspace.mct-home-final>section#pro-benefits.mct-home-pro,
 html body main.workspace.mct-home-final>section.mct-home-why,
 html body main.workspace.mct-home-final>section.mct-home-next,
 html body main.workspace.mct-home-final>p.mct-home-caveat,
 html body.mct-layout-wide main.workspace:not(.mct-home-final),
 html body.mct-layout-wide main.mct-pro-registration-main,
 html body.mct-layout-wide main.mpt-main,
 html body.mct-layout-wide main.mct-privacy-workspace,
 html body.mct-layout-wide main.mct-invite-page {
  width:calc(100% - 24px)!important;
 }
 html body main.workspace.mct-home-final>section.mct-home-opening,
 html body section.mpt-hero {
  padding-left:12px!important;
  padding-right:12px!important;
 }
}


/* Auxiliary local-PDF test page: unlike the rest, it has no layout body
   class. Match the same 1420px canvas without expanding sign-in dialogs. */
html body:not(.mct-layout-wide)>main:not(.panel){
 box-sizing:border-box!important;
 width:calc(100% - 40px)!important;
 max-width:var(--mct-approved-page-width)!important;
 min-width:0!important;
 margin-left:auto!important;
 margin-right:auto!important;
}
@media(max-width:700px){
 html body:not(.mct-layout-wide)>main:not(.panel){
  width:calc(100% - 24px)!important;
 }
}
