/* ===== Golden Data — shared site styles ===== */
:root{
  --ink:#1A1530; --ink2:#241d3e; --violet:#6E2DAE; --violet2:#8A3FC8;
  --magenta:#C44FD0; --pink:#E483E6; --lav:#F4F0FB; --paper:#FCFAFF;
  --slate:#6A6480; --line:#E7E1F2; --maxw:1120px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:"Helvetica Neue",Arial,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);line-height:1.7;-webkit-font-smoothing:antialiased;font-size:16px}
a{color:inherit;text-decoration:none}

/* nav */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:14px 28px;background:rgba(26,21,48,0);transition:.35s}
nav.scrolled,nav.solid{background:rgba(26,21,48,.92);backdrop-filter:blur(10px)}
nav .brand{display:flex;align-items:center;gap:11px;color:#fff;font-weight:800;letter-spacing:.5px}
nav .brand img{height:30px;filter:drop-shadow(0 2px 6px rgba(196,79,208,.5))}
nav .links{display:flex;gap:22px;font-size:13.5px;align-items:center}
nav .links a{color:#cabfe0;transition:.2s}
nav .links a:hover,nav .links a.active{color:var(--pink)}
nav .cta{background:linear-gradient(100deg,var(--violet),var(--magenta));color:#fff!important;padding:8px 18px;border-radius:30px;font-weight:600}
@media(max-width:880px){nav .links a:not(.cta){display:none}}

/* layout */
section{padding:88px 28px}
.wrap{max-width:var(--maxw);margin:0 auto}
.eyebrow{display:inline-block;font-size:12px;letter-spacing:3px;font-weight:700;color:var(--violet2);text-transform:uppercase;margin-bottom:14px}
.dark .eyebrow{color:var(--pink)}
h2{font-size:32px;line-height:1.25;font-weight:800;letter-spacing:-.5px;margin-bottom:14px}
.sub{font-size:16px;color:var(--slate);max-width:760px;margin-bottom:44px}
.dark{background:var(--ink);color:#fff}.dark .sub{color:#b7aed0}
.lav{background:var(--lav)}

/* hero (home) */
#hero{min-height:92vh;display:flex;flex-direction:column;justify-content:center;padding-top:96px;color:#fff;position:relative;overflow:hidden;
  background:radial-gradient(1100px 600px at 76% 16%,rgba(138,63,200,.42),transparent 60%),radial-gradient(820px 520px at 8% 92%,rgba(196,79,208,.2),transparent 55%),var(--ink)}
#hero .grid-bg{position:absolute;inset:0;opacity:.16;background-image:linear-gradient(rgba(255,255,255,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.1) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(circle at 72% 32%,#000,transparent 75%)}
#hero .wrap{position:relative;z-index:2}
#hero .mark{display:flex;align-items:center;gap:14px;margin-bottom:26px}
#hero .mark img{height:54px;filter:drop-shadow(0 4px 16px rgba(196,79,208,.55))}
#hero .mark .wm{font-size:19px;font-weight:800;letter-spacing:1px}
#hero .mark .wm small{display:block;font-size:11px;font-weight:500;color:#9b91bf;letter-spacing:3px}
#hero h1{font-size:clamp(34px,5.4vw,60px);font-weight:800;line-height:1.13;letter-spacing:-1px;margin-bottom:22px;max-width:14ch}
#hero h1 .accent{background:linear-gradient(100deg,var(--pink),var(--magenta));-webkit-background-clip:text;background-clip:text;color:transparent}
#hero p.tag{font-size:clamp(16px,2.2vw,21px);color:#e2dcf2;max-width:640px;font-weight:300;margin-bottom:34px}
#hero .btns{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:46px}
.btn1{background:linear-gradient(100deg,var(--violet),var(--magenta));color:#fff;padding:13px 28px;border-radius:30px;font-weight:600;display:inline-block}
.btn2{border:1px solid rgba(228,131,230,.5);color:var(--pink);padding:13px 28px;border-radius:30px;font-weight:600;display:inline-block}
#hero .metarow{display:flex;gap:38px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.12);padding-top:26px}
#hero .metarow .n{font-size:28px;font-weight:800;display:block}
#hero .metarow .l{font-size:13px;color:#a79dc6}

/* sub-page hero (inner pages) */
.pagehero{padding:140px 28px 70px;color:#fff;position:relative;overflow:hidden;
  background:radial-gradient(900px 500px at 82% 10%,rgba(138,63,200,.4),transparent 60%),var(--ink)}
.pagehero .grid-bg{position:absolute;inset:0;opacity:.14;background-image:linear-gradient(rgba(255,255,255,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.1) 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(circle at 80% 20%,#000,transparent 75%)}
.pagehero .wrap{position:relative;z-index:2}
.pagehero h1{font-size:clamp(30px,4.6vw,48px);font-weight:800;letter-spacing:-1px;line-height:1.15;margin-bottom:16px;max-width:18ch}
.pagehero h1 .accent{background:linear-gradient(100deg,var(--pink),var(--magenta));-webkit-background-clip:text;background-clip:text;color:transparent}
.pagehero p{font-size:clamp(15px,2vw,19px);color:#d6cfee;max-width:680px;font-weight:300}
.crumb{font-size:12.5px;letter-spacing:1px;color:#9b91bf;margin-bottom:22px}
.crumb a:hover{color:var(--pink)}
.crumb span{color:var(--pink)}

/* definition block (AEO) */
.define{background:#fff;border:1px solid var(--line);border-left:4px solid var(--violet);border-radius:14px;padding:28px 30px;font-size:18px;line-height:1.8;color:#2c2546;max-width:880px}
.define b{color:var(--violet)}

/* four-jobs flow */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-radius:16px;overflow:hidden}
.flow .step{padding:26px 22px;position:relative}
.flow .step:not(:last-child){border-right:1px dashed rgba(255,255,255,.18)}
.flow .step .k{font-size:12px;letter-spacing:2px;color:var(--pink);font-weight:700;margin-bottom:8px}
.flow .step h4{font-size:18px;margin-bottom:8px}
.flow .step p{font-size:13px;color:#b7aed0;line-height:1.6}
@media(max-width:780px){.flow{grid-template-columns:1fr 1fr}.flow .step{border:none!important}}

/* cards */
.cards{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.card{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:24px;transition:.25s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(110,45,174,.5)}
.card .ic{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(110,45,174,.1);color:var(--violet);margin-bottom:14px;font-size:19px}
.card h4{font-size:16px;font-weight:700;margin-bottom:7px}
.card p{font-size:13.5px;color:var(--slate);line-height:1.6}
.card .role{font-size:12px;color:var(--violet2);font-weight:600;margin-bottom:6px}
.dark .card{background:var(--ink2);border-color:#332a52}
.dark .card h4{color:#fff}.dark .card p{color:#b7aed0}
.dark .card .ic{background:rgba(228,131,230,.14);color:var(--pink)}

/* layered architecture */
.layers{display:flex;flex-direction:column;gap:9px}
.layer{display:flex;align-items:center;gap:18px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px 22px}
.layer .ln{flex:0 0 42px;height:42px;border-radius:9px;background:var(--ink);color:var(--pink);display:flex;align-items:center;justify-content:center;font-weight:800}
.layer .lt{flex:0 0 200px;font-weight:700;font-size:15px}
.layer .ld{font-size:13.5px;color:var(--slate)}
@media(max-width:680px){.layer{flex-wrap:wrap}.layer .lt{flex-basis:auto}}

/* deployment modes */
.modes{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.mode{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:24px}
.mode .tag{font-size:12px;letter-spacing:1px;color:var(--violet2);font-weight:700}
.mode h4{font-size:18px;font-weight:800;margin:5px 0 8px}
.mode p{font-size:13.5px;color:var(--slate)}

/* prose list / checklist */
.checks{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.checks li{list-style:none;font-size:14.5px;color:#43395c;padding-left:28px;position:relative;line-height:1.55}
.checks li::before{content:"✓";position:absolute;left:0;top:0;color:var(--violet);font-weight:800}

/* integration tags */
.tags{display:flex;gap:10px;flex-wrap:wrap}
.tags span{background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 14px;font-size:13px;color:var(--slate);font-weight:600}
.dark .tags span{background:var(--ink2);border-color:#332a52;color:#cabfe0}

/* faq */
.faq{max-width:880px}
.faq details{background:var(--paper);border:1px solid var(--line);border-radius:12px;margin-bottom:12px;padding:4px 22px;transition:.2s}
.faq details[open]{border-color:var(--violet2)}
.faq summary{font-weight:700;font-size:16px;padding:16px 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--violet);font-size:22px;font-weight:400}
.faq details[open] summary::after{content:"–"}
.faq p{font-size:14.5px;color:#43395c;padding:0 0 18px;line-height:1.75}

/* partners */
.partners{display:flex;gap:30px;flex-wrap:wrap;align-items:center;color:var(--slate);font-weight:700;font-size:15px}
.partners span{padding:10px 20px;border:1px solid var(--line);border-radius:10px;background:#fff}
.dark .partners{color:#cabfe0}
.dark .partners span{background:var(--ink2);border-color:#332a52}

/* contact */
.contact-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.mail-lg{font-size:22px;font-weight:800;color:var(--pink)}

/* cta band */
.ctaband{text-align:center}

footer{background:var(--ink);color:#7d749c;font-size:12.5px;padding:40px 28px;border-top:1px solid rgba(255,255,255,.08)}
footer .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center}
footer .fnav{display:flex;gap:20px;flex-wrap:wrap}
footer .fnav a:hover{color:var(--pink)}

/* ===== Blog article template ===== */
.artmeta{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:#b7aed0;margin-top:18px}
.artmeta span{display:inline-flex;align-items:center;gap:7px}
.article{max-width:760px;margin:0 auto}
.article .prose>p{font-size:16.5px;line-height:1.85;color:#2c2546;margin-bottom:20px}
.article .prose h2{font-size:26px;margin:44px 0 14px}
.article .prose h3{font-size:19px;font-weight:700;margin:28px 0 10px}
.article .prose ul{margin:0 0 20px 0;padding-left:22px}
.article .prose li{font-size:16px;line-height:1.7;color:#2c2546;margin-bottom:8px}
.article .prose a{color:var(--violet);font-weight:600}
.article .prose a:hover{text-decoration:underline}
.takeaways{background:rgba(110,45,174,.06);border:1px solid rgba(110,45,174,.18);border-radius:14px;padding:24px 28px;margin-bottom:36px}
.takeaways h2{font-size:15px;letter-spacing:1px;text-transform:uppercase;color:var(--violet);margin:0 0 12px}
.takeaways ul{margin:0;padding-left:20px}
.takeaways li{font-size:15px;line-height:1.65;color:#3f3858;margin-bottom:8px}
.statcallout{display:flex;gap:26px;flex-wrap:wrap;background:var(--ink);color:#fff;border-radius:16px;padding:28px 30px;margin:30px 0}
.statcallout .s .n{font-size:34px;font-weight:800;color:var(--pink);line-height:1}
.statcallout .s .l{font-size:13px;color:#b7aed0;margin-top:6px;max-width:200px}
figure{margin:26px 0}
figure .ph{background:var(--lav);border:1px dashed var(--line);border-radius:12px;height:220px;display:flex;align-items:center;justify-content:center;color:var(--slate);font-size:13px}
figure img{width:100%;display:block;border-radius:12px;border:1px solid var(--line);background:#fff}
figure.shot img{padding:0;background:#0b0820;border-color:#2a2347}
figcaption{font-size:12.5px;color:var(--slate);margin-top:8px;text-align:center}
/* digital-expert portrait cards */
.card .portrait{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px;margin-bottom:14px;border:1px solid var(--line);display:block}
.dark .card .portrait{border-color:#332a52}
/* product screenshot frame */
.shotframe{margin-top:32px;border-radius:16px;overflow:hidden;border:1px solid rgba(228,131,230,.25);box-shadow:0 36px 80px -44px rgba(110,45,174,.7)}
.shotframe img{width:100%;display:block}
.tm{font-size:.62em;vertical-align:super;font-weight:600;opacity:.85;letter-spacing:0}
.authorcard{display:flex;gap:18px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:22px;margin:40px 0}
.authorcard .avt{flex:0 0 56px;height:56px;border-radius:50%;background:linear-gradient(120deg,var(--violet),var(--magenta));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:20px}
.authorcard h4{font-size:16px;margin-bottom:3px}
.authorcard p{font-size:13px;color:var(--slate)}
.related{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.related a{display:block;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:20px;transition:.25s}
.related a:hover{transform:translateY(-3px);box-shadow:0 16px 36px -22px rgba(110,45,174,.45)}
.related .meta{font-size:11.5px;letter-spacing:1px;text-transform:uppercase;color:var(--violet2);font-weight:700;margin-bottom:8px}
.related h4{font-size:15px;line-height:1.4}
.ctasplit{display:grid;gap:16px;grid-template-columns:1fr 1fr;max-width:760px;margin:0 auto}
@media(max-width:560px){.ctasplit{grid-template-columns:1fr}.statcallout{gap:18px}}
.ctasplit a{display:block;border-radius:14px;padding:22px 24px;border:1px solid rgba(228,131,230,.3)}
.ctasplit a.p1{background:linear-gradient(100deg,var(--violet),var(--magenta));color:#fff;border:none}
.ctasplit a.p2{background:rgba(255,255,255,.04);color:#fff}
.ctasplit h4{font-size:16px;margin-bottom:5px}
.ctasplit p{font-size:13px;opacity:.85}