:root{--page-title-display:none;}/* Start custom CSS *//* Guides hub: topics bento, link rows and the six topic illustrations. Built from page elements; no script. */
@media (min-width: 1025px) { #gd-topics { grid-template-columns: repeat(12, minmax(0,1fr)); } #gd-t-1 { grid-column: 1 / span 7; } #gd-t-2 { grid-column: 8 / span 5; } #gd-t-3 { grid-column: 1 / span 5; } #gd-t-4 { grid-column: 6 / span 7; } #gd-t-5 { grid-column: 1 / span 6; } #gd-t-6 { grid-column: 7 / span 6; } #gd-w-1, #gd-w-4 { flex: 1 1 auto; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: stretch; } #gd-w-1 > :first-child, #gd-w-4 > :first-child { order: 2; height: auto; min-height: 300px; } #gd-w-1 > :last-child, #gd-w-4 > :last-child { height: 100%; } #gd-w-1 > :last-child > :last-child, #gd-w-4 > :last-child > :last-child { margin-top: auto; padding-top: 28px; } #gd-w-1 p a, #gd-w-4 p a { padding-block-start: 19px; padding-block-end: 19px; font-size: 18px; } #gd-w-5, #gd-w-6 { grid-template-columns: minmax(0,0.8fr) minmax(0,1.2fr); align-items: stretch; } #gd-w-5 > :first-child, #gd-w-6 > :first-child { height: auto; min-height: 170px; } }
@media (min-width: 768px) and (max-width: 1024px) { #gd-topics { grid-template-columns: minmax(0,1fr) minmax(0,1fr); } #gd-t-1, #gd-t-6 { grid-column: 1 / -1; } #gd-w-1 { grid-template-columns: minmax(0,1.1fr) minmax(0,0.9fr); align-items: center; } #gd-w-1 > :first-child { order: 2; height: 240px; } #gd-w-6 { grid-template-columns: minmax(0,0.9fr) minmax(0,1.1fr); align-items: center; } }
#gd-topics p a { position: relative; padding-inline-end: 34px; transition: color 0.2s ease, padding 0.2s ease; } #gd-topics p a::after { content: '→'; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); color: var(--nivo-apricot); transition: transform 0.2s ease; } #gd-topics p a:hover { padding-inline-start: 6px; } #gd-topics p a:hover::after { transform: translate(5px, -50%); } #gd-topics p a:focus-visible { outline: 2px solid var(--nivo-apricot); outline-offset: 2px; }
[id^=gd-il-] { background-repeat: no-repeat; } [id^=gd-il-]::before, [id^=gd-il-]::after { content: ''; position: absolute; display: block; top: auto; left: auto; }
#gd-il-1 { background-image: linear-gradient(rgba(250,246,241,0.14),rgba(250,246,241,0.14)), linear-gradient(rgba(250,246,241,0.92),rgba(250,246,241,0.92)), linear-gradient(rgba(250,246,241,0.2),rgba(250,246,241,0.2)), linear-gradient(rgba(250,246,241,0.2),rgba(250,246,241,0.2)), linear-gradient(rgba(250,246,241,0.2),rgba(250,246,241,0.2)); background-size: 100% 16px, 34% 9px, 26% 5px, 26% 34%, 26% 34%; background-position: 0px 0px, 10% 26%, 9% 38%, 9% 86%, 46% 86%; }
#gd-il-1::before { right: 8%; top: 24%; width: 28%; height: 62%; border-radius: 3px; background: var(--nivo-apricot); }
#gd-il-1::after { right: 8%; top: 24%; width: 28%; height: 62%; border: 2px dashed rgba(250,246,241,0.55); border-radius: 3px; box-sizing: border-box; }
#gd-il-2 { background-image: radial-gradient(circle closest-side, rgba(59,30,63,0.3) 0 92%, transparent 100%), radial-gradient(circle closest-side, rgba(59,30,63,0.3) 0 92%, transparent 100%), radial-gradient(circle closest-side, rgba(59,30,63,0.3) 0 92%, transparent 100%), linear-gradient(var(--nivo-paper),var(--nivo-paper)); background-size: 7px 7px, 7px 7px, 7px 7px, 100% 22px; background-position: 12px 8px, 24px 8px, 36px 8px, 0px 0px; background-color: var(--nivo-white); }
#gd-il-2::before { left: 10%; right: 10%; top: 34px; height: 180%; background-repeat: no-repeat; background-image: linear-gradient(rgba(59,30,63,0.88),rgba(59,30,63,0.88)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(var(--nivo-apricot),var(--nivo-apricot)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.88),rgba(59,30,63,0.88)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)); background-size: 46% 9px, 100% 5px, 86% 5px, 30% 14px, 100% 30%, 60% 5px, 100% 5px, 74% 5px; background-position: 0px 0px, 0px 9%, 0px 13%, 0px 20%, 0px 44%, 0px 68%, 0px 73%, 0px 78%; }
#gd-il-2::after { right: 12px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--nivo-apricot); }
#gd-il-3 { background-image: radial-gradient(circle closest-side, var(--nivo-apricot) 0 92%, transparent 100%), linear-gradient(var(--nivo-paper),var(--nivo-paper)), linear-gradient(rgba(59,30,63,0.3),rgba(59,30,63,0.3)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.3),rgba(59,30,63,0.3)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.3),rgba(59,30,63,0.3)); background-size: 12px 12px, 70% 18px, 62% 5px, 54% 5px, 58% 5px, 46% 5px, 50% 5px; background-position: calc(10% + 62%) 13%, 10% 12%, 14% 42%, 14% 50%, 14% 66%, 14% 74%, 14% 90%; background-color: var(--nivo-white); }
#gd-il-3::before { left: 6%; right: 6%; top: 34%; height: 22%; border-radius: 4px; background: rgba(244,162,97,0.22); border: 1.5px solid var(--nivo-apricot); box-sizing: border-box; }
#gd-il-3::after { right: 10%; top: 39%; width: 14px; height: 14px; border-radius: 50% 50% 50% 0px; transform: rotate(-45deg); background: rgba(59,30,63,0.88); }
#gd-il-4 { background-image: linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.3),rgba(59,30,63,0.3)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.3),rgba(59,30,63,0.3)), linear-gradient(rgba(59,30,63,0.3),rgba(59,30,63,0.3)); background-size: 12% 30%, 12% 44%, 12% 36%, 12% 54%, 84% 2px; background-position: 12% 78%, 31% 78%, 50% 78%, 69% 78%, 50% 80%; background-color: var(--nivo-white); }
#gd-il-4::before { right: 8%; bottom: 20%; width: 10%; height: 62%; background: var(--nivo-apricot); transform-origin: center bottom; }
#gd-il-4::after { left: 8%; bottom: 8%; width: 84%; height: 5px; border-radius: 3px; background: rgba(59,30,63,0.88); transform-origin: left center; }
#gd-il-5 { background-image: linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.3),rgba(59,30,63,0.3)), linear-gradient(rgba(59,30,63,0.88),rgba(59,30,63,0.88)); background-size: 72% 22%, 50% 22%, 28% 22%; background-position: 50% 12%, 50% 50%, 50% 88%; background-color: var(--nivo-white); }
#gd-il-5::before { left: calc(50% - 7px); top: 15%; width: 14px; height: 14px; border-radius: 50%; background: var(--nivo-apricot); box-shadow: 0px 0px 0px 4px rgba(244,162,97,0.3); }
#gd-il-5::after { left: calc(50% - 7px); top: 78%; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--nivo-apricot); box-sizing: border-box; }
#gd-il-6 { background-image: linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.16),rgba(59,30,63,0.16)), linear-gradient(rgba(59,30,63,0.88),rgba(59,30,63,0.88)); background-size: 40% 10px, 40% 10px, 40% 10px, 2px 46%; background-position: 14% 30%, 14% 50%, 14% 70%, 74% 80%; background-color: var(--nivo-white); }
#gd-il-6::before { left: calc(74% - 1px); top: 22%; width: 30px; height: 30px; border-radius: 0px 100% 0px 100%; background: var(--nivo-apricot); transform-origin: left bottom; }
#gd-il-6::after { left: 14%; top: calc(70% - 7px); width: 40%; height: 10px; background: var(--nivo-apricot); transform-origin: left center; transform: scaleX(0.35); }
@media (prefers-reduced-motion: no-preference) {
  @keyframes nivoGdDrop { 0%, 10% { transform: translate(-150%, -34%) rotate(-6deg); opacity: 0; } 22% { opacity: 1; } 55%, 90% { transform: translate(0%, 0%) rotate(0deg); opacity: 1; } 100% { transform: translate(-150%, -34%) rotate(-6deg); opacity: 0; } }
  #gd-il-1::before { animation: nivoGdDrop 5s cubic-bezier(0.3,0.9,0.3,1) infinite; }
  @keyframes nivoGdScroll { 0%, 14% { transform: translateY(0%); } 46%, 62% { transform: translateY(-38%); } 92%, 100% { transform: translateY(0%); } }
  @keyframes nivoGdBlink { 0%, 100% { opacity: 0.25; } 50% { opacity: 1; } }
  #gd-il-2::before { animation: nivoGdScroll 7s ease-in-out infinite; } #gd-il-2::after { animation: nivoGdBlink 2.4s ease-in-out infinite; }
  @keyframes nivoGdRank { 0%, 14% { top: 82%; } 36%, 44% { top: 58%; } 66%, 90% { top: 34%; } 100% { top: 82%; } }
  @keyframes nivoGdPin { 0%, 14% { top: 87%; } 36%, 44% { top: 63%; } 66%, 90% { top: 39%; } 100% { top: 87%; } }
  #gd-il-3::before { animation: nivoGdRank 6s ease-in-out infinite; } #gd-il-3::after { animation: nivoGdPin 6s ease-in-out infinite; }
  @keyframes nivoGdBar { 0%, 10% { transform: scaleY(0.18); } 55%, 88% { transform: scaleY(1); } 100% { transform: scaleY(0.18); } }
  @keyframes nivoGdLine { 0%, 20% { transform: scaleX(0.08); } 65%, 88% { transform: scaleX(1); } 100% { transform: scaleX(0.08); } }
  #gd-il-4::before { animation: nivoGdBar 5s ease-in-out infinite; } #gd-il-4::after { animation: nivoGdLine 5s ease-in-out infinite; }
  @keyframes nivoGdFunnel { 0%, 10% { top: 15%; } 40%, 48% { top: 46%; } 78%, 92% { top: 78%; } 100% { top: 15%; } }
  @keyframes nivoGdGoal { 0%, 70% { transform: scale(1); opacity: 0.5; } 82% { transform: scale(1.9); opacity: 1; } 92%, 100% { transform: scale(1); opacity: 0.5; } }
  #gd-il-5::before { animation: nivoGdFunnel 6s ease-in-out infinite; } #gd-il-5::after { animation: nivoGdGoal 6s ease-in-out infinite; }
  @keyframes nivoGdLeaf { 0%, 10% { transform: scale(0.25) rotate(-12deg); } 55%, 88% { transform: scale(1) rotate(0deg); } 100% { transform: scale(0.25) rotate(-12deg); } }
  @keyframes nivoGdEnergy { 0%, 10% { transform: scaleX(1); } 55%, 88% { transform: scaleX(0.35); } 100% { transform: scaleX(1); } }
  #gd-il-6::before { animation: nivoGdLeaf 6s ease-in-out infinite; } #gd-il-6::after { animation: nivoGdEnergy 6s ease-in-out infinite; }
}
/* Reduced motion: no scroll-in or hover movement on this page; all content stays visible. */
@media (prefers-reduced-motion: reduce) {
  .elementor-18516 [data-interaction-id]:not(.e-accordion-item-icon-base > *) { opacity: 1 !important; transform: none !important; }
  .elementor-18516 [data-interaction-id] { transition: none !important; }
  #gd-topics p a, #gd-topics p a::after { transition: none !important; }
}

/* Free tools line under "Guides by topic" (5 Nov 2026) */
#gd-tools{margin-block-start:clamp(28px,3vw,40px);padding-block-start:20px;border-top:1px solid rgba(59,30,63,.14);max-width:none}
#gd-tools b{font-weight:600;color:var(--nivo-ink)}
#gd-tools span{margin:0 6px;color:var(--nivo-apricot)}
#gd-tools a{color:var(--nivo-plum);font-weight:600;text-decoration:underline;text-decoration-color:var(--nivo-apricot);text-underline-offset:4px}/* End custom CSS */