.guide-page { overflow: visible; }
.guide-hero { padding: 78px 0 42px; border-bottom: 1px solid rgba(96,159,211,.10); }
.guide-hero-inner { max-width: 980px; }
.guide-hero h1 { margin: 0; font-size: clamp(44px, 7vw, 76px); line-height: 1; letter-spacing: -.05em; }
.guide-subtitle { max-width: 860px; margin: 20px 0 0; color: #dbe8f5; font-size: clamp(19px, 2.4vw, 25px); line-height: 1.5; font-weight: 650; }
.guide-intro { max-width: 880px; margin-top: 24px; color: var(--muted); font-size: 17px; line-height: 1.72; }
.guide-intro p { margin: 0 0 12px; }
.guide-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 24px; }
.guide-toc { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 30px; }
.guide-toc a { padding: 9px 12px; border-radius: 999px; border: 1px solid rgba(55,130,190,.36); background: rgba(6,18,31,.42); color: #aecdE8; font-size: 12px; font-weight: 750; }
.guide-toc a:hover, .guide-toc a:focus-visible { color: #fff; border-color: rgba(74,174,255,.85); outline: none; }
.guide-content { padding-bottom: 100px; }
.guide-section { scroll-margin-top: 94px; padding: 72px 0; border-bottom: 1px solid rgba(96,159,211,.09); }
.guide-section-heading { max-width: 800px; margin-bottom: 36px; }
.guide-section-heading h2, .guide-copy h2, .guide-cta h2 { margin: 0; font-size: clamp(32px, 4.6vw, 50px); line-height: 1.08; letter-spacing: -.04em; }
.guide-section-heading p { max-width: 760px; color: var(--muted); font-size: 17px; line-height: 1.7; }
.guide-row { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: clamp(34px, 6vw, 82px); align-items: center; margin-top: 56px; }
.guide-row:first-child { margin-top: 0; }
.guide-row.reverse { grid-template-columns: 330px minmax(0, 1fr); }
.guide-row.reverse .guide-copy { order: 2; }
.guide-row.reverse .guide-figure { order: 1; }
.guide-copy { min-width: 0; }
.guide-copy h3 { margin: 0 0 16px; font-size: clamp(26px, 3.3vw, 34px); letter-spacing: -.025em; }
.guide-copy p { margin: 0 0 15px; color: #b4c1cf; font-size: 16.5px; line-height: 1.72; }
.guide-copy .eyebrow { margin-bottom: 15px; }
.guide-figure { width: 100%; max-width: 330px; margin: 0; justify-self: center; }
.guide-shot { display: block; width: 100%; padding: 0; border: 0; border-radius: 28px; background: transparent; cursor: zoom-in; box-shadow: 0 28px 68px rgba(0,0,0,.38); }
.guide-shot img { width: 100%; height: auto; border-radius: 28px; border: 1px solid rgba(62,142,204,.42); }
.guide-shot:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }
.guide-figure figcaption { margin-top: 13px; color: #7f96ad; text-align: center; font-size: 12.5px; line-height: 1.5; }
.guide-defs { margin: 20px 0; display: grid; gap: 10px; }
.guide-defs div { display: grid; grid-template-columns: 74px 1fr; gap: 12px; padding: 13px 15px; border: 1px solid rgba(52,128,188,.30); border-radius: 15px; background: rgba(9,22,36,.65); }
.guide-defs dt { color: #4ca9ff; font-weight: 850; }
.guide-defs dd { margin: 0; color: var(--muted); }
.workflow { border-bottom: 0; }
.workflow-list { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; counter-reset: step; }
.workflow-list li { counter-increment: step; min-height: 114px; padding: 22px; border: 1px solid rgba(49,124,183,.36); border-radius: 20px; background: linear-gradient(180deg, rgba(16,34,56,.78), rgba(8,19,31,.9)); color: #c7d4e2; line-height: 1.5; }
.workflow-list li::before { content: counter(step); display: grid; place-items: center; width: 30px; height: 30px; margin-bottom: 14px; border-radius: 50%; background: #0e4f92; color: #8fd1ff; font-weight: 850; }
.guide-cta { margin-top: 14px; padding: 38px; border: 1px solid rgba(62,142,204,.42); border-radius: 28px; background: linear-gradient(135deg, rgba(17,38,62,.90), rgba(7,18,30,.96)); display: grid; grid-template-columns: 1fr auto; gap: 32px; align-items: center; }
.guide-cta p { max-width: 760px; margin: 14px 0 0; color: var(--muted); line-height: 1.65; }
.guide-cta-actions { display: flex; align-items: center; }
.guide-lightbox { width: min(94vw, 720px); max-height: 94vh; padding: 0; border: 1px solid rgba(74,174,255,.65); border-radius: 30px; background: #02070d; box-shadow: 0 40px 120px rgba(0,0,0,.75); overflow: visible; }
.guide-lightbox::backdrop { background: rgba(0,0,0,.84); backdrop-filter: blur(6px); }
.guide-lightbox img { display: block; max-width: 100%; max-height: 90vh; margin: auto; border-radius: 28px; }
.lightbox-close { position: absolute; right: -14px; top: -14px; width: 42px; height: 42px; border: 1px solid rgba(74,174,255,.75); border-radius: 50%; background: #0b1725; color: #fff; font-size: 27px; line-height: 1; cursor: pointer; z-index: 2; }
.lightbox-close:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
@media (max-width: 900px) {
  .guide-row, .guide-row.reverse { grid-template-columns: minmax(0,1fr) 285px; gap: 34px; }
  .guide-row.reverse { grid-template-columns: 285px minmax(0,1fr); }
  .workflow-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .guide-hero { padding: 52px 0 30px; }
  .guide-row, .guide-row.reverse { grid-template-columns: 1fr; gap: 26px; margin-top: 46px; }
  .guide-row.reverse .guide-copy, .guide-row.reverse .guide-figure { order: initial; }
  .guide-figure { max-width: 310px; }
  .guide-section { padding: 58px 0; }
  .guide-section-heading { margin-bottom: 26px; }
  .workflow-list { grid-template-columns: 1fr; }
  .guide-cta { grid-template-columns: 1fr; padding: 28px 24px; }
  .guide-cta-actions { justify-content: flex-start; }
}
@media (max-width: 420px) {
  .guide-hero h1 { font-size: 42px; }
  .guide-figure { max-width: 290px; }
  .guide-toc { gap: 7px; }
  .guide-toc a { font-size: 11px; padding: 8px 10px; }
}

@media (max-width: 520px) { .guide-hero-actions { gap: 12px; } }