/* TRUE VISUAL Graphite Theme v1.0 - v7.14.3
   Replaces large paper-white surfaces with low-glare graphite surfaces.
   Small light mockups are intentionally preserved as visual content. */

:root{
  --paper:#171B22;
  --paper-2:#1E232C;
  --ink:#F3F5F7;
  --muted:#A4ACB8;
  --line-dark:rgba(255,255,255,.10);
  --divider-light:rgba(255,255,255,.13);

  --tv-color-paper:#171B22;
  --tv-color-paper-alt:#1E232C;
  --tv-color-text-dark:#F3F5F7;
  --tv-color-muted-dark:#A4ACB8;
  --tv-divider-light:rgba(255,255,255,.13);
  --tv-border-light:rgba(255,255,255,.10);
}

/* Large formerly-light surfaces */
.statement,
.services,
.articles,
.page-section.paper,
.tv-section--paper,
.tv-article{
  color:#F3F5F7;
  background:
    radial-gradient(circle at 82% 12%,rgba(139,89,251,.055),transparent 28%),
    radial-gradient(circle at 14% 86%,rgba(82,214,255,.025),transparent 25%),
    #171B22;
}
.page-section.soft{
  color:#F3F5F7;
  background:#1E232C;
}

/* Shared copy hierarchy on graphite */
.statement-side,
.services .section-head p,
.articles .section-head p,
.page-section.paper .content-lead,
.page-section.paper .tv-section-intro__side,
.tv-section--paper .tv-section-intro__side,
.page-section.paper .page-copy,
.page-section.paper p,
.page-section.soft p{
  color:#A4ACB8;
}
.statement .section-index,
.services .eyebrow,
.articles .eyebrow,
.page-section.paper .section-label,
.page-section.paper .tv-section-intro__label,
.tv-section--paper .tv-section-intro__label{
  color:#A4ACB8;
}
.statement .copy-divider:before,
.services .copy-divider:before,
.articles .copy-divider:before,
.page-section.paper .copy-divider:before,
.page-section.paper .section-head p:before,
.page-section.paper .tv-section-intro__side,
.tv-section--paper .tv-section-intro__side{
  border-color:rgba(255,255,255,.13);
  background-color:transparent;
}

/* Homepage service list */
.service-list{border-top-color:rgba(255,255,255,.10)}
.service-row{border-bottom-color:rgba(255,255,255,.10)}
.service-row p{color:#A4ACB8}
.service-row:hover{
  background:linear-gradient(90deg,rgba(139,89,251,.085),rgba(82,214,255,.018) 48%,transparent 86%);
}
.service-row b{color:#B5A6FF}

/* Article/material cards */
.article-card,
body.interior .page-section.paper .info-card,
body.interior .page-section.paper .deliverable,
body.interior .page-section.paper .service-card-page,
body.interior .page-section.paper .principle-grid article,
.tv-section--paper .tv-card{
  color:#F3F5F7;
  border-color:rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 100% 0%,rgba(139,89,251,.055),transparent 31%),
    linear-gradient(155deg,#1E232C,#1A1F27);
  box-shadow:0 18px 42px rgba(0,0,0,.12);
}
.article-card p,
.service-card-page p,
.tv-section--paper .tv-card__text,
body.interior .page-section.paper .info-card p,
body.interior .page-section.paper .deliverable p,
body.interior .page-section.paper .principle-grid article p{
  color:#A4ACB8;
}
.article-card:hover,
body.interior .page-section.paper .service-card-page:hover,
body.interior .page-section.paper .deliverable:hover{
  border-color:rgba(139,89,251,.28);
  box-shadow:0 26px 62px rgba(0,0,0,.20),0 0 28px rgba(139,89,251,.055);
}
.article-card:before{background:radial-gradient(circle,rgba(139,89,251,.12),transparent 68%)}

/* Secondary/action icons on graphite */
.paper .tv-next-icon,
.articles .tv-next-icon,
.page-section.paper .tv-next-icon,
.article-card-link .tv-next-icon,
.service-card-page .tv-next-icon,
.text-action .tv-next-icon{color:#F3F5F7}


/* Materials tabs - compact graphite navigator with softer card language. */
.tv-section--paper .tv-tabs,
body[data-page="materials"] .page-section.paper .tv-tabs{
  gap:14px;
  align-items:center;
  margin-bottom:46px;
  padding-bottom:0;
  border-bottom:0;
}
.tv-section--paper .tv-tab,
body[data-page="materials"] .page-section.paper .tv-tab{
  min-height:52px;
  padding:0 20px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.018));
  color:#C9D1DC;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 10px 24px rgba(5,8,14,.18);
  transition:
    color .22s ease,
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease,
    transform .22s ease;
}
.tv-section--paper .tv-tab:before,
body[data-page="materials"] .page-section.paper .tv-tab:before{
  left:14%;
  right:14%;
  bottom:0;
  height:26px;
  background:radial-gradient(ellipse at 50% 100%,rgba(139,89,251,.16) 0%,rgba(82,214,255,.10) 38%,rgba(82,214,255,0) 72%);
  filter:blur(10px);
  opacity:0;
  transform:scaleX(.72);
}
.tv-section--paper .tv-tab:after,
body[data-page="materials"] .page-section.paper .tv-tab:after{
  left:16px;
  right:16px;
  bottom:8px;
  height:2px;
  background:linear-gradient(90deg,
    rgba(139,89,251,0) 0%,
    rgba(139,89,251,.94) 22%,
    rgba(82,214,255,.92) 78%,
    rgba(82,214,255,0) 100%);
  box-shadow:0 0 12px rgba(139,89,251,.14);
  opacity:0;
  transform:scaleX(.62);
}
.tv-section--paper .tv-tab:hover,
body[data-page="materials"] .page-section.paper .tv-tab:hover{
  color:#FFFFFF;
  border-color:rgba(139,89,251,.24);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(139,89,251,.045));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 14px 26px rgba(6,8,13,.20),
    0 0 0 1px rgba(139,89,251,.02);
  transform:translateY(-1px);
}
.tv-section--paper .tv-tab:hover:before,
body[data-page="materials"] .page-section.paper .tv-tab:hover:before{
  opacity:.46;
  transform:scaleX(.88);
}
.tv-section--paper .tv-tab:hover:after,
body[data-page="materials"] .page-section.paper .tv-tab:hover:after{
  opacity:.68;
  transform:scaleX(.84);
}
.tv-section--paper .tv-tab.is-active,
body[data-page="materials"] .page-section.paper .tv-tab.is-active{
  color:#FFFFFF;
  border-color:rgba(139,89,251,.34);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(139,89,251,.07));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 18px 34px rgba(6,9,15,.22),
    0 0 24px rgba(139,89,251,.08);
}
.tv-section--paper .tv-tab.is-active:before,
body[data-page="materials"] .page-section.paper .tv-tab.is-active:before{
  opacity:.76;
  transform:scaleX(1);
}
.tv-section--paper .tv-tab.is-active:after,
body[data-page="materials"] .page-section.paper .tv-tab.is-active:after{
  opacity:1;
  transform:scaleX(1);
}
@media(max-width:700px){
  .tv-section--paper .tv-tabs,
  body[data-page="materials"] .page-section.paper .tv-tabs{
    gap:10px;
    margin-bottom:34px;
  }
  .tv-section--paper .tv-tab,
  body[data-page="materials"] .page-section.paper .tv-tab{
    min-height:46px;
    padding:0 16px;
    border-radius:14px;
  }
}

/* Breadcrumbs on graphite */

.paper .breadcrumbs span:last-child,
.page-section.paper .breadcrumbs span:last-child{color:#D9DEEA}

/* Service scope board */
.service-direction .deliverables.scope-board{
  border-color:rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 96% 2%,rgba(139,89,251,.07),transparent 30%),
    linear-gradient(155deg,#1E232C,#1A1F27);
}
.service-direction .scope-board-head{border-bottom-color:rgba(255,255,255,.09)}
.service-direction .scope-board-head span{color:#F3F5F7}
.service-direction .scope-board-head small{color:#929CAB}
.service-direction .scope-board .deliverable:nth-child(2),
.service-direction .scope-board .deliverable:nth-child(4){border-right-color:rgba(255,255,255,.08)!important}
.service-direction .scope-board .deliverable:nth-child(2),
.service-direction .scope-board .deliverable:nth-child(3){border-bottom-color:rgba(255,255,255,.08)!important}
.service-direction .scope-board .deliverable p{color:#A4ACB8!important}

/* FAQ */
.faq-section{
  background:
    radial-gradient(circle at 82% 14%,rgba(139,89,251,.08),transparent 27%),
    radial-gradient(circle at 68% 72%,rgba(82,214,255,.045),transparent 25%),
    #171B22;
}
.faq-section:before{
  background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
}
.faq-item{
  border-color:rgba(255,255,255,.10);
  background:linear-gradient(155deg,rgba(255,255,255,.035),rgba(255,255,255,.018));
  box-shadow:0 10px 34px rgba(0,0,0,.10);
}
.faq-item:hover{border-color:rgba(139,89,251,.28);box-shadow:0 18px 46px rgba(0,0,0,.16),0 0 28px rgba(139,89,251,.05)}
.faq-item[open]{
  border-color:rgba(139,89,251,.36);
  background:linear-gradient(135deg,rgba(139,89,251,.08),rgba(255,255,255,.025));
  box-shadow:0 20px 60px rgba(0,0,0,.16),0 0 32px rgba(139,89,251,.06);
}
.faq-item summary{color:#F3F5F7}
.faq-item summary i{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.035);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.faq-item summary i:before,.faq-item summary i:after{background:#E7EBF1}
.faq-item p{color:#A4ACB8}

/* Legal pages */
.legal-paper{background:#171B22!important;color:#F3F5F7!important}
.legal-toc-stick > span{color:#A4ACB8}
.legal-toc a{color:#929CAA;border-left-color:rgba(255,255,255,.10)}
.legal-toc a:hover,.legal-toc a.active{color:#B59BFF;border-left-color:var(--brand-violet)}
.tv-legal-document{color:#D5DBE4}
.tv-legal-document .legal-meta{
  color:#AEB7C4;
  border-color:rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
}
.tv-legal-document h2{color:#F3F5F7}
.tv-legal-document ul{
  border-color:rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
}
.tv-legal-document a{color:#B8A7FF;text-decoration-color:rgba(184,167,255,.30)}
@media(max-width:1000px){.legal-toc a{border-bottom-color:rgba(255,255,255,.08)}}

/* Sitemap and generic interior steps */
.page-section.paper .step,
.page-section.soft .step{
  border-color:rgba(255,255,255,.09);
  background:rgba(255,255,255,.025);
}
.page-section.paper .step p,
.page-section.soft .step p{color:#A4ACB8}

/* Editorial template: graphite reading surface */
.tv-article{background:#171B22;color:#E8ECF2}
.tv-reading-progress{background:rgba(255,255,255,.05)}
.tv-article-breadcrumbs .tv-breadcrumbs{color:#929BA8}
.tv-article-breadcrumbs .tv-breadcrumbs a:hover{color:#fff}
.tv-article-type{background:#F3F5F7;color:#111318;border-color:#F3F5F7}
.tv-article-topic,.tv-article-related-chip{border-color:rgba(255,255,255,.12);color:#BDAEFF}
.tv-article-lead{color:#BAC2CE}
.tv-article-meta{border-top-color:rgba(255,255,255,.10)}
.tv-article-avatar{background:#252B35;color:#E9EDF3}
.tv-article-author small,.tv-article-meta-line{color:#929BA8}
.tv-article-cover{border-color:rgba(255,255,255,.08)}
.tv-article-utility button,.tv-article-utility a{border-bottom-color:rgba(255,255,255,.09);color:#939CAA}
.tv-article-utility button:hover,.tv-article-utility a:hover{color:#fff}
.tv-article-body{color:#E2E6ED}
.tv-article-body h2,.tv-article-body h3{color:#F5F7FA}
.tv-article-body blockquote{color:#F0F3F8}
.tv-article-callout{border-color:rgba(139,89,251,.22);background:rgba(139,89,251,.065)}
.tv-article-callout strong{color:#BBA9FF}
.tv-context-block{border-bottom-color:rgba(255,255,255,.09)}
.tv-context-block h4{color:#939CAA}
.tv-article-toc a{color:#929BA8}
.tv-article-toc a:hover{color:#fff}
.tv-context-related{
  border-color:rgba(255,255,255,.10);
  background:rgba(255,255,255,.025);
  color:#E9EDF3;
}
.tv-context-related span{color:#929BA8}

/* Numbered editorial sections that formerly assumed black on paper */
.tv-article-body .article-section-number,
.tv-article-body .numbered-point-number{color:#A98AFF}

/* Keep form and navigation surfaces visually separated from graphite sections */
.page-section.paper .contact-form,
.page-section.soft .contact-form{background:rgba(9,12,19,.42)}

/* Prevent a bright flash from OS form controls/scrollbars where supported. */
body{color-scheme:dark}


/* v7.14.5 - graphite readability pass for article surfaces, cards and editorial UI */

/* Card typography on graphite */
.article-card h3,
.related-card h3,
.service-card-page h2,
body.interior .page-section.paper .principle-grid article h3,
body.interior .page-section.paper .info-card h3,
body.interior .page-section.paper .deliverable h3,
.page-section.paper .step h3,
.page-section.soft .step h3,
.tv-section--paper .tv-card__title{
  color:#F4F7FB;
}
.article-card > span:first-child,
.related-card small,
.service-card-page small,
body.interior .page-section.paper .principle-grid article span,
.tv-section--paper .tv-card__eyebrow{
  color:#B79FFF;
}
.article-card p,
.related-card p,
.service-card-page p,
body.interior .page-section.paper .principle-grid article p,
body.interior .page-section.paper .info-card p,
body.interior .page-section.paper .deliverable p,
.page-section.paper .step p,
.page-section.soft .step p,
.tv-section--paper .tv-card__text{
  color:#AEB7C4;
}

/* Action labels inside cards must stay readable on graphite */
.article-card-link .article-card-cta,
.related-card .link-row,
.studio-related .related-card .link-row,
.service-card-page .link-row,
.button-secondary-action-inline,
.link-row.button-secondary-action-inline,
.tv-link-action{
  color:#ECF1F7;
}
.article-card-link:hover .article-card-cta,
.article-card-link:focus-visible .article-card-cta,
.related-card:hover .link-row,
.related-card:focus-visible .link-row,
.button-secondary-action-inline:hover,
.button-secondary-action-inline:focus-visible,
.tv-link-action:hover{
  color:#C2B2FF;
}

/* Article metadata chips - no hard white badge on graphite */
.tv-article-kicker{
  gap:0;
  margin-bottom:24px;
  color:#95A0AF;
}
.tv-article-type,
.tv-article-topic{
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  font-size:12px;
  font-weight:820;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.tv-article-type{
  color:#F4F7FB;
}
.tv-article-topic{
  color:#BCAEFF;
}
.tv-article-topic:before{
  content:"/";
  display:inline-block;
  margin:0 10px;
  color:#6E7784;
  font-weight:500;
}

/* Editorial reading contrast */
.tv-article-hero h1{color:#F5F7FA;}
.tv-article-lead{color:#C0C8D4;}
.tv-article-body,
.tv-article-body p,
.tv-article-body li{
  color:#C7CFDB;
}
.tv-article-body > p:first-child,
.tv-article-body h2 + p{
  color:#AEB7C4;
}
.tv-article-body strong,
.tv-article-subheading,
.tv-article-body h2,
.tv-article-body h3{
  color:#F4F7FB !important;
}

/* Numbered headings and sections */
.tv-article-heading--numbered .tv-heading-num{
  color:#A98AFF !important;
}
.tv-article-heading--numbered .tv-heading-num:after{
  box-shadow:0 0 14px rgba(139,89,251,.16);
}

/* Article list blocks and numbered points converted from light cards to graphite cards */
.tv-article-list{
  border-color:rgba(255,255,255,.10) !important;
  background:
    radial-gradient(circle at 8% 0%,rgba(139,89,251,.10),transparent 30%),
    linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.025)) !important;
  box-shadow:0 18px 46px rgba(0,0,0,.14);
}
.tv-article-list li{
  color:#D8DFE9;
}
.tv-article-list li + li{
  border-top-color:rgba(255,255,255,.08);
}
.tv-numbered-point{
  border-color:rgba(255,255,255,.10) !important;
  background:
    radial-gradient(circle at 0% 0%,rgba(139,89,251,.10),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.03)) !important;
  box-shadow:0 16px 40px rgba(0,0,0,.14);
}
.tv-numbered-point__num{
  box-shadow:0 10px 24px rgba(139,89,251,.20);
}
.tv-numbered-point p{
  color:#E0E6EF !important;
}
.tv-article-body blockquote{
  color:#EFF3F8;
  background:linear-gradient(135deg,rgba(139,89,251,.14),rgba(82,214,255,.05));
}
.tv-article-callout{
  border-color:rgba(139,89,251,.24) !important;
  background:
    radial-gradient(circle at 10% 10%,rgba(139,89,251,.09),transparent 30%),
    rgba(255,255,255,.035) !important;
}
.tv-article-callout strong{color:#C6B6FF !important;}
.tv-article-callout p{color:#D6DDE8;}

/* Side navigation and related context */
.tv-article-utility button,
.tv-article-utility a{
  color:#A1ABBA;
}
.tv-article-utility button:hover,
.tv-article-utility a:hover{
  color:#FFFFFF;
}
.tv-context-block h4{color:#A5AEBC;}
.tv-article-toc a{color:#A0A8B6;}
.tv-article-toc a:hover{color:#FFFFFF;}
.tv-article-toc a.active{color:#BDAEFF;}
.tv-context-related{
  border-color:rgba(255,255,255,.11);
  background:linear-gradient(135deg,rgba(255,255,255,.05),rgba(255,255,255,.025));
  color:#E8EDF4;
}
.tv-context-related span{color:#9CA5B3;}
.tv-context-related strong{color:#F4F7FB;}

/* Related cards on studio/materials endings */
.tv-related-card span{color:#DCE4EF;}
.dark-related,
.related-card.dark-related{
  border-color:rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 100% 0%,rgba(139,89,251,.06),transparent 30%),
    linear-gradient(155deg,#1E232C,#1A1F27);
}


/* v7.14.6 - unified containerless catalog tabs for Works + Materials */
:where(.work-filter, body[data-page="materials"] .page-section.paper .tv-tabs){
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:clamp(22px,2.1vw,38px);
  margin-bottom:clamp(34px,3vw,48px);
  padding:0;
  border:0;
  background:none;
  box-shadow:none;
}

:where(.work-filter-tab, body[data-page="materials"] .page-section.paper .tv-tab){
  position:relative;
  isolation:isolate;
  min-height:46px;
  padding:10px 2px 14px;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#9FA9B8;
  font-size:clamp(15px,1vw,18px);
  line-height:1;
  font-weight:760;
  letter-spacing:-.015em;
  cursor:pointer;
  transform:none!important;
  transition:color .22s ease,text-shadow .22s ease;
}

/* Soft light cast by the brand line. */
:where(.work-filter-tab, body[data-page="materials"] .page-section.paper .tv-tab)::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:8%;
  right:8%;
  bottom:2px;
  height:24px;
  border-radius:50%;
  background:radial-gradient(ellipse at 50% 100%,rgba(139,89,251,.18) 0%,rgba(82,214,255,.09) 38%,transparent 72%);
  filter:blur(9px);
  opacity:0;
  transform:scaleX(.66);
  transition:opacity .22s ease,transform .22s ease;
  pointer-events:none;
}

/* Same fade-to-transparent line logic used in the top navigation. */
:where(.work-filter-tab, body[data-page="materials"] .page-section.paper .tv-tab)::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:5px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,
    rgba(139,89,251,0) 0%,
    rgba(139,89,251,.96) 24%,
    rgba(82,214,255,.92) 76%,
    rgba(82,214,255,0) 100%);
  box-shadow:0 0 10px rgba(139,89,251,.16),0 0 14px rgba(82,214,255,.08);
  opacity:0;
  transform:scaleX(.54);
  transition:opacity .22s ease,transform .22s ease;
  pointer-events:none;
}

:where(.work-filter-tab, body[data-page="materials"] .page-section.paper .tv-tab):hover{
  color:#F3F6FA;
  text-shadow:0 0 14px rgba(255,255,255,.05);
}
:where(.work-filter-tab, body[data-page="materials"] .page-section.paper .tv-tab):hover::before{
  opacity:.38;
  transform:scaleX(.86);
}
:where(.work-filter-tab, body[data-page="materials"] .page-section.paper .tv-tab):hover::after{
  opacity:.58;
  transform:scaleX(.82);
}

:where(.work-filter-tab.is-active, body[data-page="materials"] .page-section.paper .tv-tab.is-active){
  color:#FFFFFF;
  text-shadow:0 0 16px rgba(139,89,251,.09);
}
:where(.work-filter-tab.is-active, body[data-page="materials"] .page-section.paper .tv-tab.is-active)::before{
  opacity:.72;
  transform:scaleX(1);
}
:where(.work-filter-tab.is-active, body[data-page="materials"] .page-section.paper .tv-tab.is-active)::after{
  opacity:1;
  transform:scaleX(1);
}

:where(.work-filter-tab, body[data-page="materials"] .page-section.paper .tv-tab):focus-visible{
  outline:1px solid rgba(139,89,251,.58);
  outline-offset:6px;
  border-radius:4px!important;
}

@media(max-width:700px){
  :where(.work-filter, body[data-page="materials"] .page-section.paper .tv-tabs){
    flex-wrap:nowrap;
    gap:24px;
    overflow-x:auto;
    margin-inline:-2px;
    padding:0 2px 6px;
    scrollbar-width:none;
  }
  :where(.work-filter, body[data-page="materials"] .page-section.paper .tv-tabs)::-webkit-scrollbar{display:none}
  :where(.work-filter-tab, body[data-page="materials"] .page-section.paper .tv-tab){
    flex:0 0 auto;
    min-height:42px;
    padding:8px 0 13px;
    font-size:15px;
  }
}


/* v7.14.7 - editorial list colors on graphite */
.tv-article-body .tv-article-list--unordered li,
.tv-article-body .tv-article-list--ordered li{
  color:#D5DCE6;
}
.tv-article-numbered-list{
  border-top-color:rgba(255,255,255,.09);
}
.tv-article-numbered-list__item{
  border-bottom-color:rgba(255,255,255,.09);
}
.tv-article-numbered-list__copy strong{
  color:#F2F5F8;
}
.tv-article-numbered-list__copy p{
  color:#AEB8C5;
}