/* Colourful document workspace: shared across every public page. */
:root {
  --blue-600: #6542ba; --blue-500: #7652ce;
  --blue-100: #e7dffc; --blue-50: #f3effe;
  --navy-900: #25213e; --navy-800: #343052;
  --page: #fcfbff; --line-200: #e9e4f1;
  --r-lg: 20px; --r-xl: 26px;
}
body { background: #fcfbff; }
.site-header { background: rgba(255,255,255,.96); border-bottom: 1px solid #e9e4f1; }
.site-header::before { content: ''; display: block; height: 3px; background: linear-gradient(90deg,#8b5cf6,#56c6b2,#ffbc88); }
.hero { background: radial-gradient(ellipse at 5% 10%,#eee6ff,transparent 52%), radial-gradient(ellipse at 98% 85%,#dff7ee,transparent 48%),#faf8ff; border-bottom: 1px solid #e9e4f1; }
.hero h1 { letter-spacing: -.045em; }
.eyebrow { color: #6741af; }
.hero .eyebrow { display: inline-block; background: #ece4fc; border: 1px solid #ded1f6; padding: .35rem .75rem; border-radius: 99px; font-size: .72rem; }
.btn { border-radius: 12px; }
.btn--primary { background: #6542ba; box-shadow: 0 5px 13px #6542ba22; }
.btn--primary:hover { background: #523299; }
.hero .btn--ghost { background: #fff; color: #56359d; border-color: #d9cdef; }
.hero-tool, .tool-app { border-color: #e1d8f0; box-shadow: 0 18px 50px #47316e0d; }
.hero-tool__tabs { background: #f5f1fc; border-radius: 14px; }
.hero-tab.is-active { background: white; color: #6542ba; }
.dropzone { background: linear-gradient(135deg,#faf7ff,#f0fbf7); border-color: #b7a0dc; border-radius: 18px; }
.dropzone__icon { color: #7652ce; }
.dropzone__btn { background: #6542ba; border-radius: 10px; }
.hero-badges .icon { color: #0f887b; }
.section--alt { background: #f5f2fb; }
.section-head h2 { letter-spacing: -.035em; }
.tool-card { border-top: 3px solid var(--card-accent,#9a78db); background: linear-gradient(155deg,var(--card-tint,#f7f2ff),#fff 62%); box-shadow: 0 4px 18px #39225805; }
.tool-grid > li:nth-child(4n+2), .cat-grid > li:nth-child(4n+2) { --card-accent: #4caf9c; --card-tint: #edfaf5; }
.tool-grid > li:nth-child(4n+3), .cat-grid > li:nth-child(4n+3) { --card-accent: #e3a05d; --card-tint: #fff6ea; }
.tool-grid > li:nth-child(4n+4), .cat-grid > li:nth-child(4n+4) { --card-accent: #dc87a6; --card-tint: #fff0f5; }
.tool-card__icon { background: var(--card-tint,#eee7fb); color: #574083; border: 1px solid var(--card-accent,#c5b0e9); border-radius: 15px; }
.tool-card:hover { border-color: var(--card-accent,#9a78db); box-shadow: 0 12px 30px #4a327614; }
.cat-card { background: linear-gradient(145deg,var(--card-tint,#f4efff),white); border-radius: 20px; }
.showcase-art { background: linear-gradient(145deg,#eee7fd,#edf9f3); border: 0; }
.showcase-row:nth-child(2) .showcase-art { background: linear-gradient(145deg,#fff0df,#fff0f5); }
.steps > li { border-color: #e4dbf0; border-radius: 18px; }
.steps__art { background: linear-gradient(120deg,#eee7fd,#e7f6f0); }
.faq-item { border-color: #e5dcf0; border-radius: 14px; overflow: hidden; }
.faq-item[open] summary { background: #f1ebfc; color: #56359d; }
.article-header { background: linear-gradient(135deg,#f3edff,#f1fbf6); }
.post-card { border-radius: 20px; box-shadow: 0 5px 20px #49337709; }
.cover-hero { border-radius: 22px; overflow: hidden; }
.site-footer { background: linear-gradient(120deg,#25213e,#343057); }
.page-art { width: 240px; max-width: 100%; position: relative; margin: 0 0 1.2rem; }
.page-art > svg { width: 100%; height: auto; }
.page-art__symbol { position: absolute; left: 16%; top: 38%; display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid #e7d9fc; border-radius: 13px; background: #fff; color: #7652ce; box-shadow: 0 6px 15px #61409e15; transform: rotate(-9deg); }
.page-art__symbol .icon { width: 23px; height: 23px; }
.hero > .container:not(.hero-grid) { position: relative; padding-right: 330px; }
.hero > .container:not(.hero-grid) .page-art { position: absolute; right: 20px; top: 50%; width: 290px; transform: translateY(-50%); }
.prose > .page-art { width: 230px; }
.text-center > .page-art { margin-inline: auto; }
@keyframes art-bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes art-glow { 0%,100% { opacity: .5; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
  .art-float-front, .cv-drift-l, .cv-drift-c, .cv-phone, .cv-rise { animation: art-bob 5s ease-in-out infinite; }
  .art-float-back, .art-orbit, .cv-drift-r, .cv-float-a, .cv-float-b, .cv-badge { animation: art-bob 6s ease-in-out -2s infinite; }
  .art-spark { animation: art-glow 3s ease-in-out infinite; }
}
@media (max-width: 760px) {
  .hero > .container:not(.hero-grid) { padding-right: var(--gutter); }
  .hero > .container:not(.hero-grid) .page-art { position: relative; right: auto; top: auto; transform: none; width: 210px; }
  .page-art { width: 190px; margin-bottom: .8rem; }
  .hero { padding-block: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
  .page-art *, .cover-art * { animation: none !important; transition: none !important; }
}
