@import url('https://fonts.googleapis.com/css2?family=Readex+Pro:wght@400;500;600&display=swap');
/* Vybld Labs inner pages: brings product, theme, company, insight and legal pages onto the homepage system.
   Loaded after styles.css and the page's own stylesheet, on <body class="inner">. */
:root{
  --i-teal:#004340;
  --i-teal-2:#0b4f4b;
  --i-orange:#ff5f2e;
  --i-orange-text:#c2421c;
  --i-peach:#feb370;
  --i-powder:#afd9e4;
  --i-ink:#062f2c;
  --i-text:#3e5a57;
  --i-line:rgba(0,67,64,.14);
  --i-on-teal:rgba(255,255,255,.78);
  --i-cover:linear-gradient(128deg,#ff5f2e 0%,#ff7a3d 24%,#feb370 52%,#d3ebf2 84%,#eaf7fb 100%);
  --i-page:linear-gradient(120deg,#ffffff 0%,#f6fbfc 45%,#e3f3f8 100%);
}

.inner{background:#fff;color:var(--i-ink);font-family:Poppins,system-ui,-apple-system,"Segoe UI",sans-serif}
.inner main{overflow:clip}
.inner h1,.inner h2,.inner h3{color:inherit}

/* ---------- header and footer (same as the homepage) ---------- */
.inner .site-header{background:rgba(255,255,255,.94);border-bottom:1px solid var(--i-line)}
.inner .brand{color:var(--i-teal);font-weight:600;letter-spacing:.04em}
.inner .nav-links{color:var(--i-teal);font-weight:500}
.inner .nav-links a[aria-current="page"]{color:var(--i-orange-text)}
.inner .lang{background:#fff;border-color:var(--i-line);color:var(--i-teal)}
.inner .nav-cta{background:var(--i-teal);color:#fff}
.inner .nav-cta span{color:var(--i-peach)}
.inner footer{background:var(--i-teal)}

/* ---------- labels ---------- */
.inner .product-kicker,.inner .insight-kicker,.inner .legal-kicker,.inner .error-code{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--i-teal);font-size:13px;font-weight:500;letter-spacing:.02em;text-transform:none}
.inner .product-kicker:before,.inner .insight-kicker:before,.inner .legal-kicker:before,.inner .error-code:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--i-orange)}
.inner .detail-no{font-size:14px;font-weight:500;letter-spacing:0;color:var(--i-orange-text)}
.inner .answer-label,.inner .direct-answer-grid>span,.inner .direct-answer-grid>label,.inner .direct-answer label,.inner .cluster-answer span,.inner .company-narrative>.shell>span,.inner .insight-related>div>span{font-size:13px;font-weight:500;letter-spacing:.06em;color:var(--i-peach)}

/* ---------- heroes: the cover gradient with the white star ---------- */
.inner .product-hero,.inner .products-index-hero,.inner .cluster-hub-hero,.inner .company-authority-hero,.inner .insights-index-hero,.inner .insight-hero,.inner .legal-hero{
  position:relative;overflow:hidden;isolation:isolate;background:var(--i-cover);border-bottom:0;padding:clamp(72px,8vw,112px) 0 clamp(72px,8vw,104px)}
.inner .product-hero:after,.inner .products-index-hero:after,.inner .cluster-hub-hero:after,.inner .company-authority-hero:after,.inner .insights-index-hero:after,.inner .insight-hero:after,.inner .legal-hero:after{
  content:"";position:absolute;z-index:-1;inset-inline-end:-6%;bottom:-34%;width:min(46vw,560px);aspect-ratio:1204/1286;background:#fff;opacity:.85;
  -webkit-mask:url('/assets/vybld-mark.fd4b53ccb5e8.svg') center/contain no-repeat;mask:url('/assets/vybld-mark.fd4b53ccb5e8.svg') center/contain no-repeat}
.inner .product-hero h1,.inner .products-index-hero h1,.inner .cluster-hub-hero h1,.inner .company-authority-hero h1,.inner .insights-index-hero h1,.inner .insight-hero h1,.inner .legal-hero h1{
  margin:26px 0 22px;max-width:16ch;font-weight:600;font-size:clamp(44px,5.6vw,84px);line-height:1.02;letter-spacing:-.035em;color:#fff}
.inner .product-hero h1{max-width:none}
.inner .insight-hero h1{max-width:20ch;font-size:clamp(40px,5vw,72px)}
.inner .product-definition,.inner .products-index-hero p,.inner .cluster-hub-hero p,.inner .company-authority-hero p,.inner .insights-index-hero p,.inner .insight-hero p,.inner .legal-hero p{
  max-width:56ch;font-size:18px;line-height:1.65;color:var(--i-ink)}
.inner .breadcrumbs{color:rgba(6,47,44,.7);font-size:13px}
.inner .breadcrumbs b{color:var(--i-ink)}
.inner .fact-card{position:relative;z-index:1;border:0;background:rgba(255,255,255,.88);border-radius:24px;padding:6px 22px;backdrop-filter:blur(6px)}
.inner .fact-card div{border-bottom-color:var(--i-line)}
.inner .fact-card div:last-child{border-bottom:0}
.inner .fact-card span{font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--i-text)}
.inner .fact-card strong{font-size:14px;font-weight:500;color:var(--i-ink)}

/* ---------- dark statement sections: brand teal ---------- */
.inner .answer-section,.inner .direct-answer,.inner .cluster-answer,.inner .company-narrative{background:var(--i-teal);color:#fff}
.inner .answer-section h2{font-weight:500;letter-spacing:-.025em;line-height:1.15}
.inner .answer-section p,.inner .company-narrative p{color:var(--i-on-teal)}
.inner .direct-answer p,.inner .cluster-answer p{font-weight:400;line-height:1.6}

/* ---------- content sections ---------- */
.inner .product-detail{background:#fff;border-bottom:1px solid var(--i-line)}
.inner .product-detail.alt{background:var(--i-page)}
.inner .product-detail h2,.inner .insight-section h2,.inner .legal-body h2{font-weight:600;letter-spacing:-.025em;color:var(--i-teal)}
.inner .cap-list i{color:var(--i-orange)}
.inner .evidence-list{border:0;gap:14px}
.inner .evidence-list>div{border:0!important;border-radius:22px;background:#fff;box-shadow:0 1px 0 var(--i-line) inset,0 0 0 1px var(--i-line) inset;padding:22px}
.inner .evidence-list span{font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--i-orange-text)}
.inner .evidence-list strong{font-weight:500;color:var(--i-teal)}
.inner .prose strong{color:var(--i-teal);font-weight:600}

/* ---------- closing band ---------- */
.inner .product-cta{position:relative;overflow:hidden;isolation:isolate;background:var(--i-teal);color:#fff}
.inner .product-cta:after{content:"";position:absolute;z-index:-1;inset-inline-end:-4%;top:-30%;width:min(40vw,460px);aspect-ratio:1204/1286;background:var(--i-orange);
  -webkit-mask:url('/assets/vybld-mark.fd4b53ccb5e8.svg') center/contain no-repeat;mask:url('/assets/vybld-mark.fd4b53ccb5e8.svg') center/contain no-repeat}
.inner .product-cta span{font-size:13px;font-weight:500;letter-spacing:.06em;color:var(--i-peach)}
.inner .product-cta h2{font-weight:600;letter-spacing:-.035em;color:#fff}
.inner .product-cta a{background:var(--i-orange);color:var(--i-ink)}

/* ---------- portfolio index and theme pages ---------- */
.inner .cluster-nav{padding:36px 0 8px;background:#fff}
.inner .cluster-nav .filter{border-color:var(--i-line);background:#fff;color:var(--i-teal);font-weight:500}
.inner .cluster-nav .filter:hover{background:var(--i-teal);color:#fff;border-color:var(--i-teal)}
.inner .canonical-grid{border:0;gap:16px;margin-top:24px}
.inner .canonical-item{border:1px solid var(--i-line)!important;border-radius:24px;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.inner .canonical-item:hover{transform:translateY(-3px);border-color:var(--i-teal)!important;box-shadow:0 18px 40px rgba(0,67,64,.1)}
.inner .canonical-item small{color:var(--i-orange-text);font-weight:500}
.inner .canonical-item h2{color:var(--i-teal);font-weight:600;letter-spacing:-.02em}
.inner .canonical-item>span{color:var(--i-teal)}
.inner .cluster-copy p{color:var(--i-text)}
.inner .cluster-product-list>.shell{border:0;gap:14px}
.inner .cluster-product-list a{border:1px solid var(--i-line)!important;border-radius:22px;background:#fff;transition:transform .2s ease,border-color .2s ease}
.inner .cluster-product-list a:hover{transform:translateY(-3px);border-color:var(--i-teal)!important}
.inner .cluster-product-list small{color:var(--i-orange-text)}
.inner .cluster-product-list strong{color:var(--i-teal);font-weight:600}

/* ---------- company ---------- */
.inner .company-authority-grid{background:#fff}
.inner .company-fact{border-radius:22px;border:1px solid var(--i-line);background:#fff}
.inner .company-fact span{color:var(--i-text)}
.inner .company-fact strong{color:var(--i-teal);font-weight:600}

.inner .company-authority-grid{padding:clamp(56px,6vw,88px) 0}
.inner .company-authority-grid>.shell{border:0;gap:16px}
.inner .company-fact{border:1px solid var(--i-line)!important;min-height:132px}
.inner .company-narrative h2{font-weight:600;letter-spacing:-.035em}
.inner .company-links a{border-color:rgba(255,255,255,.3);color:#fff}
.inner .company-links a:hover{background:#fff;color:var(--i-teal)}

/* ---------- insights ---------- */
.inner .insights-list{background:var(--i-page)}
.inner .insight-card{border-radius:24px;border:1px solid var(--i-line);background:#fff;transition:transform .2s ease,border-color .2s ease}
.inner .insight-card:hover{transform:translateY(-3px);border-color:var(--i-teal)}
.inner .insight-card>span{color:var(--i-orange-text)}
.inner .insight-card h2{color:var(--i-teal);font-weight:600;letter-spacing:-.02em;font-size:clamp(22px,2vw,28px);line-height:1.25}
.inner .insights-list .shell{display:grid;gap:14px}
.inner .insights-index-hero h1{max-width:18ch}
.inner .insight-section{border-color:var(--i-line)}
.inner .insight-section>span,.inner .insight-section .detail-no{color:var(--i-orange-text)}
.inner .insight-related{background:var(--i-page)}
.inner .insight-related a{border-color:var(--i-line);color:var(--i-teal)}

/* second article template (insights.css) */
.inner .article-hero{position:relative;overflow:hidden;isolation:isolate;background:var(--i-cover);border-bottom:0;padding:clamp(72px,8vw,112px) 0}
.inner .article-hero:after{content:"";position:absolute;z-index:-1;inset-inline-end:-6%;bottom:-34%;width:min(46vw,560px);aspect-ratio:1204/1286;background:#fff;opacity:.85;
  -webkit-mask:url('/assets/vybld-mark.fd4b53ccb5e8.svg') center/contain no-repeat;mask:url('/assets/vybld-mark.fd4b53ccb5e8.svg') center/contain no-repeat}
.inner .article-hero h1{font-weight:600;letter-spacing:-.035em;color:#fff}
.inner .article-dek{color:var(--i-ink)}
.inner .article-hero .article-kicker{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--i-teal);font-size:13px;font-weight:500;letter-spacing:.02em}
.inner .article-hero .article-kicker:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--i-orange)}
.inner .article-meta{position:relative;z-index:1;background:rgba(255,255,255,.88);border-radius:22px;padding:6px 20px;border:0}
.inner .article-meta span,.inner .article-meta small{color:var(--i-text)}
.inner .article-copy h2{font-weight:600;letter-spacing:-.025em;color:var(--i-teal)}
.inner .article-toc a:hover{color:var(--i-orange-text)}
.inner .related{background:var(--i-page)}
.inner .related .article-kicker{font-size:13px;font-weight:500;letter-spacing:.04em;color:var(--i-orange-text)}
.inner .related h2{font-weight:600;letter-spacing:-.03em;color:var(--i-teal)}
.inner .related-grid a{border-radius:22px;border:1px solid var(--i-line);color:var(--i-teal)}

/* ---------- contact, legal and 404 ---------- */
.inner .legal-body{color:var(--i-text)}
.inner .legal-card{border-radius:24px;border-color:var(--i-line)}
.inner .legal-card h2,.inner .legal-card h3{color:var(--i-teal);font-weight:600}
.inner .legal-notice{border-radius:18px;background:#fff3e8;border-color:rgba(194,66,28,.18);color:var(--i-ink)}
.inner .button-dark{background:var(--i-teal);color:#fff}
.inner .button-ghost{background:#fff;border-color:var(--i-line);color:var(--i-teal)}
.inner .button-dark span{color:var(--i-peach)}
.inner.error-body main{background:var(--i-cover)}
.inner .error-page{position:relative;overflow:hidden;isolation:isolate;min-height:72vh}
.inner .error-page:after{content:"";position:absolute;z-index:-1;inset-inline-end:-6%;bottom:-20%;width:min(50vw,600px);aspect-ratio:1204/1286;background:#fff;opacity:.85;
  -webkit-mask:url('/assets/vybld-mark.fd4b53ccb5e8.svg') center/contain no-repeat;mask:url('/assets/vybld-mark.fd4b53ccb5e8.svg') center/contain no-repeat}
.inner .error-page h1{font-weight:600;letter-spacing:-.035em;color:#fff}
.inner .error-page p{color:var(--i-ink)}

/* ---------- Arabic ---------- */
[dir="rtl"] .inner{font-family:"Readex Pro",Tajawal,Poppins,sans-serif}
[dir="rtl"] .inner .product-hero,[dir="rtl"] .inner .products-index-hero,[dir="rtl"] .inner .cluster-hub-hero,[dir="rtl"] .inner .company-authority-hero,[dir="rtl"] .inner .insights-index-hero,[dir="rtl"] .inner .insight-hero,[dir="rtl"] .inner .article-hero,[dir="rtl"] .inner .legal-hero{background:linear-gradient(232deg,#ff5f2e 0%,#ff7a3d 24%,#feb370 52%,#d3ebf2 84%,#eaf7fb 100%)}
[dir="rtl"] .inner h1,[dir="rtl"] .inner h2,[dir="rtl"] .inner h3,[dir="rtl"] .inner .product-cta h2{letter-spacing:0!important;line-height:1.3}
[dir="rtl"] .inner .product-hero h1,[dir="rtl"] .inner .products-index-hero h1,[dir="rtl"] .inner .cluster-hub-hero h1,[dir="rtl"] .inner .company-authority-hero h1,[dir="rtl"] .inner .insights-index-hero h1,[dir="rtl"] .inner .insight-hero h1,[dir="rtl"] .inner .article-hero h1,[dir="rtl"] .inner .legal-hero h1{line-height:1.25}
[dir="rtl"] .inner p,[dir="rtl"] .inner li{line-height:1.9}
[dir="rtl"] .inner .product-kicker,[dir="rtl"] .inner .insight-kicker,[dir="rtl"] .inner .legal-kicker,[dir="rtl"] .inner .article-kicker,[dir="rtl"] .inner .answer-label,[dir="rtl"] .inner .fact-card span,[dir="rtl"] .inner .evidence-list span,[dir="rtl"] .inner .product-cta span{letter-spacing:0;text-transform:none}
[dir="rtl"] .inner .cap-list i,[dir="rtl"] .inner .canonical-item>span,[dir="rtl"] .inner .cluster-product-list i,[dir="rtl"] .inner .insight-card>i,[dir="rtl"] .inner .related-grid a span,[dir="rtl"] .inner .company-links a i{transform:scaleX(-1);display:inline-block}
[dir="rtl"] .inner .direct-answer p{font-size:clamp(22px,2.2vw,30px)}

.inner .error-ar{margin-top:48px;padding-top:36px;border-top:1px solid rgba(255,255,255,.45);font-family:"Readex Pro",Tajawal,sans-serif;text-align:right}
.inner .error-ar h2{margin:0 0 12px;font-weight:600;font-size:clamp(30px,3.4vw,44px);line-height:1.3;color:var(--i-teal)}
.inner .error-ar p{margin:0;color:var(--i-ink);font-size:17px;line-height:1.9}

@media (prefers-reduced-motion:reduce){
  .inner .canonical-item,.inner .cluster-product-list a,.inner .insight-card{transition:none}
}
@media (max-width:760px){
  .inner .product-hero:after,.inner .products-index-hero:after,.inner .cluster-hub-hero:after,.inner .company-authority-hero:after,.inner .insights-index-hero:after,.inner .insight-hero:after,.inner .legal-hero:after,.inner .article-hero:after{width:80vw;bottom:-22%;opacity:.55}
  .inner .canonical-grid{grid-template-columns:1fr}
}