body.admin-bar .nav { top: 32px; }
.nav-cta { white-space: nowrap; }
.device img,
.feature-image img,
.touch-device img,
.open-image img { height: auto; }
.sticky-visual { margin-top: calc(-100vh + 58px); }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 1000; padding: 10px 14px; border-radius: 8px; background: #f5f5f7; color: #050506; font-weight: 700; transform: translateY(-150%); transition: transform .2s ease; }
.skip-link:focus { transform: translateY(0); }
.wp-content,
.not-found { min-height: calc(100vh - 150px); padding-top: 150px; }
.wp-content article { max-width: 880px; margin: 0 auto; color: #c5c6ca; line-height: 1.75; }
.wp-content h1,
.not-found h1 { color: #f5f5f7; font-size: clamp(44px, 7vw, 88px); line-height: 1; letter-spacing: -.05em; }
.not-found { text-align: center; }
.not-found > p:not(.eyebrow) { color: #92939a; margin-bottom: 32px; }
@media (max-width: 782px) { body.admin-bar .nav { top: 46px; } }

/* Exact Kolora logo mark from the supplied loading-screen artwork. */
.brand-logo {
  --logo-size: 30px;
  position: relative;
  display: inline-block;
  flex: 0 0 var(--logo-size);
  width: var(--logo-size);
  height: var(--logo-size);
  overflow: hidden;
  background: #050506;
}
.brand-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.brand-logo.large { --logo-size: 82px; }
.final-mark { margin-bottom: 8px; }

/* Shared footer links */
.footer-links { display: flex; align-items: center; gap: 20px; }
.footer-links a { color: #8f9097; transition: color .2s ease; }
.footer-links a:hover { color: #f5f5f7; }

/* Homepage privacy promise */
.privacy-promise { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; align-items: center; background: radial-gradient(circle at 12% 52%, rgba(95,61,160,.18), transparent 36%); }
.privacy-promise h2,
.faq h2 { margin: 20px 0 30px; font-size: clamp(48px, 6.5vw, 92px); line-height: .93; letter-spacing: -.055em; }
.privacy-promise-copy > p:not(.eyebrow) { max-width: 520px; color: #9a9ba1; font-size: 17px; line-height: 1.7; }
.privacy-promise-copy > a { display: inline-flex; gap: 10px; margin-top: 18px; color: #f5f5f7; font-size: 14px; font-weight: 600; }
.privacy-promise-copy > a span { color: #45c9ec; }
.privacy-points { border-top: 1px solid #24262b; }
.privacy-points > div { display: grid; grid-template-columns: 44px 1fr; column-gap: 18px; padding: 30px 0; border-bottom: 1px solid #24262b; }
.privacy-points span { grid-row: 1 / 3; color: #55575e; font-size: 12px; }
.privacy-points strong { margin-bottom: 8px; font-size: 20px; }
.privacy-points p { margin: 0; color: #888a91; line-height: 1.6; }

/* Homepage FAQ */
.faq { display: grid; grid-template-columns: .75fr 1.25fr; gap: 90px; align-items: start; }
.faq-heading { position: sticky; top: 130px; }
.faq-list { border-top: 1px solid #2a2b30; }
.faq-list details { border-bottom: 1px solid #2a2b30; }
.faq-list summary { position: relative; padding: 28px 48px 28px 0; cursor: pointer; list-style: none; color: #f1f1f3; font-size: 19px; font-weight: 600; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: '+'; position: absolute; right: 4px; top: 23px; color: #7c7e85; font-size: 27px; font-weight: 400; transition: transform .25s ease; }
.faq-list details[open] summary::after { transform: rotate(45deg); }
.faq-list details p { margin: -5px 60px 28px 0; color: #96979d; line-height: 1.7; }
.faq-list code { padding: 2px 6px; border-radius: 5px; background: #17181c; color: #c9cad0; }
.faq-list a { color: #55cff2; }

/* Kolora-native feature visuals */
.kolora-scope,
.rgb-panel-art { margin-top: 40px; height: 310px; border: 1px solid #25272c; border-radius: 13px; overflow: hidden; background: #07080a; box-shadow: 0 25px 65px rgba(0,0,0,.38); }
.scope-header { height: 48px; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #202227; color: #e6e7e9; font-size: 12px; }
.scope-header strong { letter-spacing: .03em; }
.scope-header span { color: #24c9ee; font-size: 14px; }
.kolora-scope svg { display: block; width: 100%; height: 262px; }
.rgb-panel-art { display: grid; place-items: center; background: radial-gradient(circle at 50% 45%, #15171c, #08090b 70%); }
.rgb-panel-art img { display: block; width: auto; height: 292px; border: 1px solid #25272c; box-shadow: 0 18px 48px #000; }
.kolora-scope + h3,
.rgb-panel-art + h3 { margin-top: 34px; }

/* Privacy policy */
.privacy-page { padding: 150px 24px 120px; }
.privacy-header,
.privacy-content { width: min(100%, 860px); margin-inline: auto; }
.privacy-header { padding-bottom: 64px; border-bottom: 1px solid #24262b; }
.privacy-header h1 { margin: 20px 0 22px; font-size: clamp(52px, 8vw, 100px); line-height: .95; letter-spacing: -.06em; }
.privacy-updated { margin: 0; color: #92939a; font-size: 15px; }
.privacy-content { padding-top: 56px; color: #c4c5ca; font-size: 16px; line-height: 1.8; }
.privacy-content h2 { margin: 72px 0 20px; color: #f5f5f7; font-size: clamp(27px, 4vw, 38px); line-height: 1.15; letter-spacing: -.035em; }
.privacy-content h2:first-of-type { margin-top: 0; }
.privacy-content p { margin: 0 0 22px; }
.privacy-content ul { margin: 0 0 26px; padding-left: 24px; }
.privacy-content li { margin: 0 0 11px; padding-left: 5px; }
.privacy-content blockquote { margin: 0 0 48px; padding: 20px 24px; border-left: 2px solid #8c54ff; border-radius: 0 12px 12px 0; background: #0d0e11; color: #a9aab0; }
.privacy-content a { color: #55cff2; text-decoration: underline; text-decoration-color: rgba(85,207,242,.38); text-underline-offset: 4px; }
.privacy-content a:hover { color: #9ae7ff; }
.privacy-contact { margin-top: 74px; padding: 30px; border: 1px solid #24262b; border-radius: 18px; background: #0b0c0e; }
.privacy-contact h2 { margin-top: 0; }
.privacy-contact address { font-style: normal; }

/* Support */
.support-intro { max-width: 680px; margin-top: 28px; color: #a5a6ac; font-size: 18px; line-height: 1.7; }
.support-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 48px 0 72px; }
.support-card { padding: 25px; border: 1px solid #24262b; border-radius: 17px; background: #0b0c0e; }
.support-card span { display: block; margin-bottom: 24px; color: #55575e; font-size: 12px; }
.support-card strong { display: block; margin-bottom: 9px; color: #f5f5f7; }
.support-card p { margin: 0; color: #898a91; font-size: 14px; line-height: 1.55; }
.support-card code,
.support-page code { padding: 2px 6px; border-radius: 5px; background: #17181c; color: #d1d2d6; }
.support-steps { counter-reset: support-step; list-style: none; padding-left: 0 !important; }
.support-steps li { position: relative; padding: 0 0 22px 52px !important; counter-increment: support-step; }
.support-steps li::before { content: counter(support-step); position: absolute; left: 0; top: 1px; display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #34363c; border-radius: 50%; color: #f5f5f7; font-size: 12px; }
.support-action { margin: 55px 0; padding: 34px; border: 1px solid #31333a; border-radius: 20px; background: linear-gradient(145deg, rgba(80,57,138,.24), #0b0c0e); }
.support-action h2 { margin-top: 0; }

@media (max-width: 850px) {
  .sticky-visual { margin-top: 0; }
  .privacy-promise,
  .faq { grid-template-columns: 1fr; gap: 55px; }
  .faq-heading { position: static; }
  .support-grid { grid-template-columns: 1fr; }
  .kolora-scope,
  .rgb-panel-art { height: 280px; }
  .kolora-scope svg { height: 232px; }
  .rgb-panel-art img { height: 265px; }
  .privacy-page { padding-top: 120px; padding-bottom: 90px; }
  .privacy-header { padding-bottom: 44px; }
  .privacy-content { padding-top: 42px; }
  .privacy-content h2 { margin-top: 56px; }
  .footer-links { order: 3; }
}
