:root{--page-title-display:none;}/* Start custom CSS *//* Website redesign page: hero redesign window (#rdh-*) and SEO migration diagram (#rdm-*). Atomic elements + this CSS, no script. */
.elementor-18400 [id^=rdh-], .elementor-18400 [id^=rdm-] { padding: 0; margin: 0; min-width: 0; box-sizing: border-box; }
/* ---------- hero window ---------- */
#rdh-stage { position: relative; margin-top: clamp(36px, 4.4vw, 64px); }
#rdh-win { border: 1px solid rgba(59,30,63,0.14); border-radius: 12px; overflow: hidden; background: var(--nivo-paper); box-shadow: 0 34px 60px -40px rgba(42,20,45,0.45); }
#rdh-bar { display: block; padding: 7px 12px; background: var(--nivo-neutral); font-family: var(--nivo-font-mono), monospace; font-size: 11px; line-height: 18px; color: rgba(30,27,26,0.6); white-space: nowrap; }
#rdh-bar b { color: rgba(59,30,63,0.25); letter-spacing: 3px; font-weight: 400; margin-right: 8px; }
#rdh-bar span { padding: 2px 12px; border-radius: 99px; background: #fff; }
#rdh-view { position: relative; height: clamp(230px, 29vw, 430px); overflow: hidden; }
#rdh-old, #rdh-new { position: absolute; inset: 0; }
#rdh-old > *, #rdh-new > *, #rdh-new > * > * { position: absolute; }
/* dated site */
#rdh-old { background: #E9E8E3; font-family: Georgia, 'Times New Roman', serif; }
#rdh-o-top { left: 0; right: 0; top: 0; height: 11%; background: linear-gradient(#3C5E93, #2C4A78); display: flex; align-items: center; padding: 0 3%;
  background-image: linear-gradient(#3C5E93, #2C4A78); }
#rdh-o-top::after { content: ''; position: absolute; right: 3%; top: 40%; width: 34%; height: 20%; background: repeating-linear-gradient(90deg, rgba(255,255,255,0.75) 0 11%, transparent 11% 14%); }
#rdh-o-logo { position: static; color: #fff; font-size: clamp(9px, 1vw, 15px); font-style: italic; letter-spacing: 0.02em; white-space: nowrap; }
#rdh-o-ban { left: 0; right: 0; top: 11%; height: 36%; background: linear-gradient(120deg, #8E9AA8, #C7CDD3 55%, #A3AEB9); display: flex; align-items: center; justify-content: center; }
#rdh-o-ban::before { content: ''; position: absolute; left: 6%; top: 18%; width: 20%; height: 64%; background: linear-gradient(160deg, #7B8794, #B4BCC4); border: 3px solid #fff; box-shadow: 2px 2px 0 rgba(0,0,0,0.25); }
#rdh-o-wel { position: relative; color: #fff; font-size: clamp(12px, 2vw, 30px); text-shadow: 2px 2px 0 rgba(0,0,0,0.35); white-space: nowrap; }
#rdh-o-c1, #rdh-o-c2, #rdh-o-c3 { top: 53%; height: 30%; width: 27%;
  background: linear-gradient(#4E5966, #4E5966) 0 0 / 62% 9% no-repeat, repeating-linear-gradient(to bottom, #A7ADB4 0 5%, transparent 5% 12%) 0 22% / 100% 78% no-repeat; }
#rdh-o-c1 { left: 5%; } #rdh-o-c2 { left: 36.5%; } #rdh-o-c3 { left: 68%; }
#rdh-o-btn { left: 5%; top: 86%; padding: 0.3em 0.9em; background: linear-gradient(#5A8BD6, #2F5DA8); border: 1px solid #23467F; border-radius: 3px; color: #fff; font-family: Verdana, sans-serif; font-size: clamp(7px, 0.8vw, 11px); }
#rdh-o-foot { left: 0; right: 0; bottom: 0; height: 4%; background: #2C4A78; }
#rdh-o-tag, #rdh-n-tag { right: 2.4%; top: 4.5%; padding: 4px 10px; border-radius: 99px; font-family: var(--nivo-font-mono), monospace; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; line-height: 1.3; }
#rdh-o-tag { top: 15%; background: rgba(30,27,26,0.72); color: #fff; }
#rdh-n-tag { top: 15%; background: var(--nivo-plum); color: #fff; }
/* new site */
#rdh-new { background: var(--nivo-paper); clip-path: inset(0 0 0 0); }
#rdh-n-nav { left: 0; right: 0; top: 0; height: 11%; background: #fff; border-bottom: 1px solid rgba(59,30,63,0.1);
  background-image: linear-gradient(var(--nivo-plum), var(--nivo-plum)), repeating-linear-gradient(90deg, rgba(30,27,26,0.55) 0 7%, transparent 7% 10%), linear-gradient(var(--nivo-plum), var(--nivo-plum));
  background-size: 11% 22%, 30% 12%, 11% 44%; background-position: 4% 50%, 52% 50%, 96% 50%; background-repeat: no-repeat; }
#rdh-n-h { left: 5%; top: 21%; width: 46%; height: 21%;
  background: linear-gradient(var(--nivo-ink), var(--nivo-ink)) 0 0 / 100% 38% no-repeat, linear-gradient(var(--nivo-plum), var(--nivo-plum)) 0 100% / 68% 38% no-repeat; border-radius: 2px; }
#rdh-n-p { left: 5%; top: 48%; width: 40%; height: 11%; background: repeating-linear-gradient(to bottom, rgba(30,27,26,0.3) 0 18%, transparent 18% 41%); }
#rdh-n-b1 { left: 5%; top: 65%; width: 13%; height: 8.5%; background: var(--nivo-plum); }
#rdh-n-b2 { left: 19.5%; top: 65%; width: 13%; height: 8.5%; border: 1.5px solid rgba(30,27,26,0.25); }
#rdh-n-img { right: 5%; top: 19%; width: 39%; height: 56%; border-radius: 10px; overflow: hidden; background: var(--nivo-plum);
  background-image: linear-gradient(var(--nivo-paper), var(--nivo-paper)), linear-gradient(rgba(250,246,241,0.18), rgba(250,246,241,0.18)), linear-gradient(rgba(250,246,241,0.18), rgba(250,246,241,0.18));
  background-size: 46% 34%, 40% 7%, 28% 7%; background-position: 86% 78%, 10% 16%, 10% 30%; background-repeat: no-repeat; box-shadow: 0 24px 40px -26px rgba(42,20,45,0.6); }
#rdh-n-sun { position: absolute; left: 12%; bottom: 14%; width: 26%; aspect-ratio: 1; border-radius: 50%; background: var(--nivo-apricot); }
#rdh-n-cards { left: 5%; right: 5%; top: 82%; height: 26%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4%; }
#rdh-n-cards > * { position: static; background: #fff; border: 1px solid rgba(59,30,63,0.1); border-radius: 8px;
  background-image: linear-gradient(var(--nivo-apricot), var(--nivo-apricot)), linear-gradient(rgba(30,27,26,0.6), rgba(30,27,26,0.6));
  background-size: 9% 14%, 52% 10%; background-position: 8% 22%, 22% 22%; background-repeat: no-repeat; }
#rdh-scan { position: absolute; top: 0; bottom: 0; left: 0; width: 3px; margin-left: -1px; background: var(--nivo-apricot); box-shadow: 0 0 18px 4px rgba(240,163,94,0.55); opacity: 0; z-index: 3; }
#rdh-pill { position: absolute; right: clamp(14px, 3vw, 44px); bottom: clamp(-18px, -1.4vw, -14px); z-index: 4; display: inline-flex; align-items: center; gap: 10px;
  padding: 10px 18px 10px 12px; border-radius: 99px; background: var(--nivo-plum); color: #fff; font-family: var(--nivo-font-sans), sans-serif; font-size: 15px; font-weight: 600; line-height: 1.2; letter-spacing: -0.01em;
  box-shadow: 0 18px 30px -18px rgba(42,20,45,0.8); }
#rdh-pill::before { content: '✓'; display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--nivo-apricot); color: var(--nivo-plum); font-size: 13px; font-weight: 700; }
@media (max-width: 767px) {
  #rdh-view { height: 240px; }
  #rdh-o-c3, #rdh-o-top::after { display: none; } #rdh-o-c1, #rdh-o-c2 { width: 41%; } #rdh-o-c2 { left: 54%; }
  #rdh-n-h { width: 88%; height: 16%; } #rdh-n-p { width: 70%; top: 44%; } #rdh-n-b1 { width: 26%; top: 62%; } #rdh-n-b2 { left: 34%; width: 26%; top: 62%; }
  #rdh-n-img { display: none; } #rdh-n-cards { top: 80%; }
  #rdh-pill { font-size: 13px; padding: 8px 14px 8px 10px; }
}
@media (prefers-reduced-motion: no-preference) {
  #rdh-new { animation: rdhReveal 10s cubic-bezier(.65,0,.35,1) infinite; }
  #rdh-scan { animation: rdhScan 10s cubic-bezier(.65,0,.35,1) infinite; }
  #rdh-pill { animation: rdhPill 10s ease-out infinite; }
}
@keyframes rdhReveal { 0%, 16% { clip-path: inset(0 100% 0 0); opacity: 1; } 46%, 90% { clip-path: inset(0 0 0 0); opacity: 1; } 96% { clip-path: inset(0 0 0 0); opacity: 0; } 97%, 100% { clip-path: inset(0 100% 0 0); opacity: 1; } }
@keyframes rdhScan { 0%, 15% { left: 0%; opacity: 0; } 17% { left: 0%; opacity: 1; } 46% { left: 100%; opacity: 1; } 49%, 100% { left: 100%; opacity: 0; } }
@keyframes rdhPill { 0%, 48% { opacity: 0; transform: translateY(10px); } 54%, 90% { opacity: 1; transform: translateY(0); } 96%, 100% { opacity: 0; transform: translateY(0); } }
/* ---------- migration diagram ---------- */
#rdm-wrap { margin-top: clamp(48px, 5vw, 88px); padding: clamp(20px, 2.8vw, 40px); border: 1px solid rgba(250,246,241,0.16); border-radius: 14px; background: rgba(250,246,241,0.035); color: var(--nivo-offwhite); }
#rdm-top { display: grid; grid-template-columns: 1fr 1.1fr 1fr; align-items: center; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid rgba(250,246,241,0.14); }
#rdm-lo, #rdm-ln, #rdm-vl { font-family: var(--nivo-font-mono), monospace; font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(250,246,241,0.62); line-height: 1.3; }
#rdm-ln { text-align: right; }
#rdm-cap { position: relative; height: 34px; }
#rdm-cap > * { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 10px; opacity: 0; font-family: var(--nivo-font-sans), sans-serif; font-size: clamp(14px, 1.2vw, 17px); font-weight: 600; color: #fff; white-space: nowrap; }
#rdm-cap b { display: inline-grid; place-items: center; min-width: 30px; height: 24px; padding: 0 6px; border-radius: 99px; background: var(--nivo-apricot); color: var(--nivo-plum); font-family: var(--nivo-font-mono), monospace; font-size: 11px; font-weight: 700; letter-spacing: 0.06em; }
#rdm-rows { display: grid; gap: 12px; padding: 22px 0; }
#rdm-rows > * { display: grid; grid-template-columns: 1fr 1.1fr 1fr; align-items: center; gap: 16px; }
#rdm-rows p { font-family: var(--nivo-font-mono), monospace; font-size: clamp(10.5px, 0.95vw, 13px); line-height: 1.2; padding: 10px 14px; border-radius: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[id^=rdm-o] { position: relative; background: rgba(250,246,241,0.07); border: 1px solid rgba(250,246,241,0.16); color: rgba(250,246,241,0.86); padding-left: 30px !important; }
[id^=rdm-o]::before { content: ''; position: absolute; left: 12px; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--nivo-apricot); box-shadow: 0 0 0 4px rgba(240,163,94,0.22); }
[id^=rdm-n] { background: var(--nivo-offwhite); color: var(--nivo-plum); font-weight: 700; text-align: right; }
[id^=rdm-k] { position: relative; height: 26px; }
[id^=rdm-k]::before { content: ''; position: absolute; left: 0; right: 8px; top: 50%; height: 2px; margin-top: -1px; background: linear-gradient(90deg, rgba(240,163,94,0.35), var(--nivo-apricot)); transform-origin: left center; }
[id^=rdm-k]::after { content: ''; position: absolute; right: 0; top: 50%; width: 0; height: 0; margin-top: -6px; border-left: 9px solid var(--nivo-apricot); border-top: 6px solid transparent; border-bottom: 6px solid transparent; }
#rdm-rows [id^=rdm-b] { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); padding: 3px 9px; border-radius: 99px; background: var(--nivo-plum); border: 1px solid var(--nivo-apricot); color: var(--nivo-apricot); font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; }
#rdm-vis { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 20px; padding-top: 18px; border-top: 1px solid rgba(250,246,241,0.14); }
#rdm-g { position: relative; height: 64px; }
#rdm-gl { position: absolute; inset: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 60' preserveAspectRatio='none'%3E%3Cpath d='M0 34 L30 31 L60 33 L90 29 L120 30 L150 27 L180 29 L210 26 L240 27 L270 24 L300 25 L330 22 L360 23 L400 20' fill='none' stroke='%23F0A35E' stroke-width='3' vector-effect='non-scaling-stroke'/%3E%3Cpath d='M0 34 L30 31 L60 33 L90 29 L120 30 L150 27 L180 29 L210 26 L240 27 L270 24 L300 25 L330 22 L360 23 L400 20 L400 60 L0 60 Z' fill='%23F0A35E' fill-opacity='0.22'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
#rdm-gm { position: absolute; left: 66%; top: -4px; bottom: -4px; width: 0; border-left: 1.5px dashed rgba(250,246,241,0.55); }
#rdm-gt { position: absolute; left: 8px; top: -2px; font-family: var(--nivo-font-mono), monospace; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(250,246,241,0.7); line-height: 1.3; }
@media (max-width: 767px) {
  #rdm-top { grid-template-columns: 1fr 1fr; } #rdm-cap { grid-column: 1 / -1; grid-row: 1; } #rdm-ln { grid-row: 2; grid-column: 2; } #rdm-lo { grid-row: 2; }
  #rdm-rows > * { grid-template-columns: 1fr 34px 1fr; gap: 8px; }
  #rdm-rows p { font-size: 10px; padding: 8px 8px; }
  [id^=rdm-o] { padding-left: 20px !important; } [id^=rdm-o]::before { left: 7px; width: 6px; height: 6px; margin-top: -3px; }
  #rdm-rows [id^=rdm-b] { display: none; }
  #rdm-vis { grid-template-columns: 1fr; gap: 10px; }
}
/* static (reduced motion) state = finished diagram, caption shows stage 4 */
#rdm-c4 { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
  #rdm-c1 { animation: rdmCap1 16s infinite; } #rdm-c2 { animation: rdmCap2 16s infinite; } #rdm-c3 { animation: rdmCap3 16s infinite; } #rdm-c4 { animation: rdmCap4 16s infinite; }
  [id^=rdm-o]::before { animation: rdmPulse 16s infinite; }
  #rdm-r1 [id^=rdm-k]::before { animation: rdmDraw1 16s infinite; } #rdm-r2 [id^=rdm-k]::before { animation: rdmDraw2 16s infinite; }
  #rdm-r3 [id^=rdm-k]::before { animation: rdmDraw3 16s infinite; } #rdm-r4 [id^=rdm-k]::before { animation: rdmDraw4 16s infinite; }
  [id^=rdm-k]::after { animation: rdmHead 16s infinite; }
  [id^=rdm-n] { animation: rdmNew 16s infinite; } #rdm-n2 { animation-delay: 0.25s; } #rdm-n3 { animation-delay: 0.5s; } #rdm-n4 { animation-delay: 0.75s; }
  #rdm-rows [id^=rdm-b] { animation: rdm301 16s infinite; }
  #rdm-gl { animation: rdmLine 16s linear infinite; }
  .elementor-18400 .elementor-element-617ec1cf::before { animation: rdmDot1 16s infinite; }
  .elementor-18400 .elementor-element-32642a27::before { animation: rdmDot2 16s infinite; }
  .elementor-18400 .elementor-element-d0b9d77::before { animation: rdmDot3 16s infinite; }
  .elementor-18400 .elementor-element-49d972c4::before { animation: rdmDot4 16s infinite; }
}
@keyframes rdmCap1 { 0%, 1% { opacity: 0; } 3%, 23% { opacity: 1; } 25%, 100% { opacity: 0; } }
@keyframes rdmCap2 { 0%, 25% { opacity: 0; } 27%, 48% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes rdmCap3 { 0%, 50% { opacity: 0; } 52%, 73% { opacity: 1; } 75%, 100% { opacity: 0; } }
@keyframes rdmCap4 { 0%, 75% { opacity: 0; } 77%, 96% { opacity: 1; } 99%, 100% { opacity: 0; } }
@keyframes rdmPulse { 0% { transform: scale(0); } 6%, 12% { transform: scale(1.35); } 18%, 96% { transform: scale(1); } 100% { transform: scale(0); } }
@keyframes rdmDraw1 { 0%, 27% { transform: scaleX(0); } 33%, 97% { transform: scaleX(1); } 100% { transform: scaleX(0); } }
@keyframes rdmDraw2 { 0%, 31% { transform: scaleX(0); } 37%, 97% { transform: scaleX(1); } 100% { transform: scaleX(0); } }
@keyframes rdmDraw3 { 0%, 35% { transform: scaleX(0); } 41%, 97% { transform: scaleX(1); } 100% { transform: scaleX(0); } }
@keyframes rdmDraw4 { 0%, 39% { transform: scaleX(0); } 45%, 97% { transform: scaleX(1); } 100% { transform: scaleX(0); } }
@keyframes rdmHead { 0%, 44% { opacity: 0; } 47%, 97% { opacity: 1; } 100% { opacity: 0; } }
@keyframes rdmNew { 0%, 52% { opacity: 0; transform: translateX(-10px); } 58%, 97% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(0); } }
@keyframes rdm301 { 0%, 76% { opacity: 0; transform: translate(-50%, -50%) scale(0.6); } 80%, 97% { opacity: 1; transform: translate(-50%, -50%) scale(1); } 100% { opacity: 0; transform: translate(-50%, -50%) scale(1); } }
@keyframes rdmLine { 0%, 2% { clip-path: inset(0 100% 0 0); } 96% { clip-path: inset(0 0 0 0); } 100% { clip-path: inset(0 0 0 0); opacity: 0.2; } }
@keyframes rdmDot1 { 0%, 1%, 25%, 100% { background-color: var(--nivo-offwhite); box-shadow: none; } 3%, 23% { background-color: var(--nivo-apricot); box-shadow: 0 0 0 6px rgba(240,163,94,0.25); } }
@keyframes rdmDot2 { 0%, 26%, 50%, 100% { background-color: var(--nivo-offwhite); box-shadow: none; } 28%, 48% { background-color: var(--nivo-apricot); box-shadow: 0 0 0 6px rgba(240,163,94,0.25); } }
@keyframes rdmDot3 { 0%, 51%, 75%, 100% { background-color: var(--nivo-offwhite); box-shadow: none; } 53%, 73% { background-color: var(--nivo-apricot); box-shadow: 0 0 0 6px rgba(240,163,94,0.25); } }
@keyframes rdmDot4 { 0%, 76%, 100% { background-color: var(--nivo-apricot); box-shadow: none; } 78%, 96% { background-color: var(--nivo-apricot); box-shadow: 0 0 0 6px rgba(240,163,94,0.25); } }/* End custom CSS */