/* v517C — Useful Guide layout alignment cleanup.
   Scope: Useful Guide hub and guide article pages only.
   Fixes: remove visible breadcrumb bar, restore dark hero style, center the guide rail like other subpages. */

/* The JSON-LD breadcrumb remains in the source for SEO, but the extra visible bar is removed
   because other public subpages do not show this style of Home > Useful Guide header. */
body.useful-guide-page .guide-breadcrumb-v514G,
body.useful-article-page .guide-breadcrumb-v514G,
body .guide-breadcrumb-v514G{
  display:none !important;
}

/* Keep Useful Guide on the same centered physical rail as the newer public subpages. */
body.useful-guide-page,
body.useful-article-page{
  --guide-rail-v517C: 1368px;
  --guide-gutter-v517C: clamp(28px, 4.2vw, 72px);
}

body.useful-guide-page .guide-hero > .container,
body.useful-article-page .guide-hero > .container,
body.useful-guide-page .guide-shell,
body.useful-article-page .guide-article,
body.useful-guide-page footer > .container,
body.useful-article-page footer > .container{
  width:min(calc(100% - (var(--guide-gutter-v517C) * 2)), var(--guide-rail-v517C)) !important;
  max-width:var(--guide-rail-v517C) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

body.useful-article-page .guide-article{
  --guide-rail-v517C: 1120px;
}

/* Restore the darker premium hero used across the service pages. v513G had made the hub hero
   too pale while the text was still white, which caused the headline to nearly disappear. */
body.useful-guide-page .guide-hero,
body.useful-article-page .guide-hero{
  background:
    radial-gradient(circle at 14% 18%, rgba(59,130,246,.28), rgba(59,130,246,0) 32%),
    radial-gradient(circle at 86% 8%, rgba(14,165,233,.18), rgba(14,165,233,0) 34%),
    linear-gradient(135deg,#071832 0%,#123a65 55%,#174d73 100%) !important;
  color:#fff !important;
  padding:clamp(54px,6vw,88px) 0 !important;
  border-bottom:0 !important;
}

body.useful-guide-page .guide-hero::before,
body.useful-article-page .guide-hero::before{
  opacity:.18 !important;
}

body.useful-guide-page .guide-hero .eyebrow,
body.useful-article-page .guide-hero .eyebrow{
  color:#bfdbfe !important;
}

body.useful-guide-page .guide-hero h1,
body.useful-article-page .guide-hero h1,
body.useful-guide-page .guide-hero-copy h1,
body.useful-article-page .guide-hero-copy h1{
  color:#fff !important;
  text-shadow:0 2px 20px rgba(2,6,23,.22) !important;
}

body.useful-guide-page .guide-hero p,
body.useful-article-page .guide-hero p,
body.useful-guide-page .guide-hero-copy p,
body.useful-article-page .guide-hero-copy p{
  color:#dbeafe !important;
  opacity:1 !important;
}

body.useful-guide-page .guide-hero-grid,
body.useful-article-page .guide-hero-grid{
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr) !important;
  gap:clamp(26px,3.4vw,50px) !important;
  align-items:center !important;
}

body.useful-guide-page .guide-visual-card,
body.useful-article-page .guide-visual-card{
  border-color:rgba(255,255,255,.22) !important;
  background:rgba(255,255,255,.09) !important;
  box-shadow:0 26px 70px rgba(2,6,23,.32) !important;
}

body.useful-guide-page .guide-visual-card::before,
body.useful-article-page .guide-visual-card::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  background:linear-gradient(90deg,rgba(7,24,50,.08),rgba(7,24,50,0) 45%) !important;
  pointer-events:none !important;
}

body.useful-guide-page .guide-visual-caption,
body.useful-article-page .guide-visual-caption{
  z-index:3 !important;
}

/* Content area alignment: avoid wide blocks drifting left after mixed legacy rail classes. */
body.useful-guide-page main .section,
body.useful-article-page main .section{
  padding-left:0 !important;
  padding-right:0 !important;
}

body.useful-guide-page .guide-shell,
body.useful-article-page .guide-article{
  display:block !important;
}

body.useful-guide-page .guide-category-section-v513G,
body.useful-guide-page .guide-hub-intro-v513G,
body.useful-guide-page .guide-us-canada-v513G,
body.useful-guide-page .guide-cta-panel-v513G,
body.useful-article-page .article-card{
  box-sizing:border-box !important;
}

@media (max-width: 1100px){
  body.useful-guide-page .guide-hero-grid,
  body.useful-article-page .guide-hero-grid{
    grid-template-columns:1fr !important;
  }
}

@media (max-width: 760px){
  body.useful-guide-page,
  body.useful-article-page{
    --guide-gutter-v517C: 16px;
  }

  body.useful-guide-page .guide-hero,
  body.useful-article-page .guide-hero{
    padding:38px 0 !important;
  }

  body.useful-guide-page .guide-hero h1,
  body.useful-article-page .guide-hero h1,
  body.useful-guide-page .guide-hero-copy h1,
  body.useful-article-page .guide-hero-copy h1{
    font-size:clamp(31px,8vw,42px) !important;
    line-height:1.08 !important;
  }
}