@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Bengali:wght@400;500;600;700&display=swap');

/* Bengali typography */
.bn-text,
.bn-text * {
  font-family: "Anek Bangla","Manrope",sans-serif !important;
  letter-spacing: 0 !important;
  word-spacing: .04em !important;
}


.project { position: relative; }
.project .mockup.cms-project-image {
  position: relative;
  overflow: hidden;
}
.project .mockup.cms-project-image > *:not(.cms-project-img) {
  opacity: 0 !important;
  pointer-events: none !important;
}
.cms-project-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  z-index: 3;
  transition: transform .5s cubic-bezier(.2,.8,.2,1);
}
.project:hover .cms-project-img { transform: scale(1.025); }
.cms-project-link {
  position: absolute;
  inset: 0;
  z-index: 8;
  border-radius: inherit;
}

/* Homepage blog uploaded images */
.home-blog-card .cms-blog-card-image {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 16px;
  display: block;
  margin-bottom: 18px;
  border: 1px solid rgba(255,255,255,.08);
}

/* Single blog: share tools */
.article-share .share-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
}
.article-share .share-actions a,
.article-share .share-actions button {
  appearance: none;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.18);
  color: inherit;
  padding: 0 0 4px;
  cursor: pointer;
  font: inherit;
}
.article-share .share-actions a:hover,
.article-share .share-actions button:hover {
  color: #d9ff52;
  border-color: #d9ff52;
}

/* Related blog cards */
.related-articles {
  padding-bottom: 90px !important;
}
.related-blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 24px;
}
.related-blog-card {
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 18px;
  padding: 16px;
  min-height: 240px;
  display: flex;
  flex-direction: column;
  background: rgba(255,255,255,.018);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}
.related-blog-card:hover {
  transform: translateY(-4px);
  border-color: rgba(217,255,82,.28);
  background: rgba(217,255,82,.025);
}
.related-blog-card img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 12px;
  margin-bottom: 14px;
}
.related-blog-card small {
  font: 9px "DM Mono",monospace;
  color: #78727d;
  letter-spacing: .06em;
}
.related-blog-card h3 {
  font-size: clamp(20px,1.7vw,28px);
  line-height: 1.16;
  letter-spacing: -.035em;
  margin: 13px 0 18px;
}
.related-blog-card span {
  margin-top: auto;
  color: #d9ff52;
  font: 10px "DM Mono",monospace;
}
@media(max-width:850px){
  .related-blog-grid { grid-template-columns: 1fr; }
}



.project .cms-original-mockup-hidden{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
.cms-project-media{
  position:absolute;
  inset:90px 7% 120px;
  border-radius:18px;
  overflow:hidden;
  z-index:3;
  background:#111;
  transform:translateZ(28px);
}
.cms-project-media[hidden]{display:none!important}
.cms-project-media .cms-project-img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  object-fit:cover!important;
  border-radius:inherit!important;
  transform:none!important;
  filter:none!important;
}
.project:hover .cms-project-media .cms-project-img{
  transform:scale(1.025)!important;
  transition:transform .45s cubic-bezier(.2,.8,.2,1);
}
.project .project-meta,
.project .project-title{
  z-index:6!important;
}
.project .cms-project-link{
  z-index:10!important;
}


.client-avatar.has-client-photo{
  padding:0!important;
  overflow:hidden!important;
  background:#111!important;
  border:1px solid rgba(255,255,255,.16)!important;
}
.client-avatar.has-client-photo img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:inherit!important;
}

/* Native upload inputs must never leak into the polished dashboard UI */
.image-file-input,
.content-image-file{
  display:none!important;
}

.international-phone-note{
  display:block;
  margin-top:8px;
  color:rgba(180,194,201,.62);
  font:9px/1.5 "DM Mono",monospace;
  letter-spacing:.03em;
}



.project.cms-project-showcase{
  min-height: 690px;
  padding: 22px;
  display: flex;
  flex-direction: column;
}
.project.cms-project-showcase .cms-original-mockup-hidden{
  display:none!important;
}
.project.cms-project-showcase .cms-project-media{
  position:relative!important;
  inset:auto!important;
  order:2;
  width:100%;
  flex:1 1 auto;
  min-height:390px;
  margin:34px 0 26px;
  border-radius:18px;
  overflow:hidden;
  z-index:2;
  background:rgba(0,0,0,.14);
  border:1px solid rgba(255,255,255,.08);
  transform:none!important;
}
.project-light.cms-project-showcase .cms-project-media{
  border-color:rgba(0,0,0,.08);
  background:#dedbd2;
}
.project.cms-project-showcase .cms-project-img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:0!important;
  transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .4s ease!important;
}
.project.cms-project-showcase:hover .cms-project-img{
  transform:scale(1.018)!important;
}
.project.cms-project-showcase .project-meta{
  order:1;
  flex:0 0 auto;
}
.project.cms-project-showcase .project-title{
  position:relative!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  order:3;
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-areas:
    "title cta"
    "desc cta";
  align-items:end;
  gap:8px 24px;
  z-index:5!important;
}
.project.cms-project-showcase .project-title h3{
  grid-area:title;
  font-size:clamp(34px,3.7vw,62px);
  margin:0!important;
}
.project.cms-project-showcase .project-title p{
  grid-area:desc;
  margin:0;
  line-height:1.5;
}
.cms-project-cta{
  grid-area:cta;
  display:inline-flex;
  align-items:center;
  gap:12px;
  align-self:end;
  white-space:nowrap;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  padding:8px 9px 8px 15px;
  font-size:11px;
  transition:background .25s,color .25s,border-color .25s,transform .25s;
}
.project-light .cms-project-cta,
.project-acid .cms-project-cta{
  border-color:rgba(0,0,0,.2);
}
.cms-project-cta b{
  width:31px;height:31px;border-radius:50%;
  display:grid;place-items:center;
  background:#d9ff52;color:#0a0a0a;
}
.project-acid .cms-project-cta b{background:#111;color:#d9ff52}
.cms-project-cta:hover{transform:translateY(-2px);background:#f2f0ea;color:#101010;border-color:#f2f0ea}
.project-light .cms-project-cta:hover,
.project-acid .cms-project-cta:hover{background:#101010;color:white;border-color:#101010}


@media(max-width:768px){
  html{scroll-behavior:auto!important}
  body{overflow-x:hidden}
  .noise,#mesh,.cursor,.cursor-label,.spotlight,.portal-transition,.portal-stars,
  .asteroid-belt,.comet,.solar-halo{display:none!important}

  .nav{
    padding:16px 16px!important;
    grid-template-columns:auto 1fr!important;
    mix-blend-mode:normal!important;
    background:linear-gradient(180deg,rgba(8,9,12,.94),rgba(8,9,12,.62),transparent)!important;
  }
  .nav nav{gap:14px!important;font-size:11px!important}
  .nav nav a:nth-child(2){display:none} /* keep navigation compact; About still reachable by scroll */
  .brand-icon img,.nav .brand img{max-width:38px}

  .panel{min-height:auto!important;padding:88px 16px 52px!important}
  .hero{min-height:100svh!important}
  .hero-title{font-size:21vw!important;line-height:.73!important;margin:16vh 0 10vh!important}
  .hero-copy{font-size:18px!important;line-height:1.45!important;max-width:92%!important}
  .solar-system{width:94vw!important;height:94vw!important;right:-68vw!important;top:18vh!important;opacity:.45!important}
  .solar-orbit,.sun-core span{animation-duration:30s!important}

  .statement h2,.work-head h2,.services-head h2,.proof-head h2,.home-blog-head h2{
    font-size:15vw!important;line-height:.86!important;
  }
  .statement-sub,.work-head p,.services-head>p,.proof-head>p,.home-blog-head>p{
    font-size:16px!important;line-height:1.6!important;
  }
  .statement-foot{gap:18px!important}
  .statement-stat strong{font-size:34px!important}

  .work{padding-left:12px!important;padding-right:12px!important}
  .project-stage{display:block!important}
  .project.cms-project-showcase{
    min-height:auto!important;
    margin-bottom:14px!important;
    padding:14px!important;
    border-radius:18px!important;
    transform:none!important;
  }
  .project.cms-project-showcase .project-meta{
    font-size:8px!important;
    padding:2px 2px 0;
  }
  .project.cms-project-showcase .cms-project-media{
    min-height:0!important;
    height:auto!important;
    aspect-ratio:16/10!important;
    margin:18px 0!important;
    border-radius:13px!important;
  }
  .project.cms-project-showcase .project-title{
    grid-template-columns:1fr!important;
    grid-template-areas:"title" "desc" "cta"!important;
    gap:7px!important;
  }
  .project.cms-project-showcase .project-title h3{
    font-size:35px!important;line-height:.95!important;
  }
  .project.cms-project-showcase .project-title p{
    font-size:12px!important;line-height:1.55!important;
  }
  .cms-project-cta{
    justify-self:start!important;margin-top:8px!important;
    padding:7px 8px 7px 13px!important;
  }

  .xp-note,.services-head,.proof-head,.planner-intro{grid-template-columns:1fr!important}
  .capability-grid{grid-template-columns:1fr!important}
  .service-card{min-height:190px!important}
  .service-card h3{font-size:25px!important}
  .proof-metrics{grid-template-columns:1fr 1fr!important}
  .feedback-card{min-height:auto!important;padding:20px!important}
  .feedback-card>p{font-size:22px!important;line-height:1.38!important}
  .home-blog-grid{grid-template-columns:1fr!important}
  .home-blog-card{min-height:auto!important}

  .planner-shell{border-radius:16px!important}
  .planner-side{padding:20px!important}
  .project-planner{padding:24px 16px!important;min-height:auto!important}
  .planner-pane h3{font-size:42px!important}
  .choice-grid,.budget-grid,.timeline-grid{grid-template-columns:1fr!important}
  .planner-actions{gap:8px!important}
  .planner-actions button{font-size:12px!important}

  .global-footer{padding:40px 16px 0!important}
  .global-footer-brand img{max-width:210px}
  .global-footer-social>div{gap:12px!important}
  .global-footer-word{
    white-space:normal!important;
    font-size:19vw!important;
    line-height:.72!important;
    text-align:left!important;
    overflow:hidden;
  }

  img{max-width:100%;height:auto}
}

@media(max-width:420px){
  .nav nav{gap:10px!important;font-size:10px!important}
  .proof-metrics{grid-template-columns:1fr!important}
  .hero-title{font-size:22.5vw!important}
  .project.cms-project-showcase .project-title h3{font-size:31px!important}
}

/* Touch devices do not need hover-heavy transitions */
@media(hover:none),(pointer:coarse){
  .tilt{transform:none!important}
  .magnetic,.magnetic-surface{transform:none!important}
  .cms-project-img{transition:none!important}
}



.article-body,
.article-body *{
  max-width:100%;
  box-sizing:border-box;
}
.article-body img,
.article-body figure img,
.article-body .image img,
.article-inline-image img,
.article-wide-image img{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  height:auto!important;
  max-height:80vh!important;
  object-fit:contain!important;
  object-position:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.article-body figure,
.article-body .image,
.article-inline-image{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  margin-left:0!important;
  margin-right:0!important;
}
.article-body iframe,
.article-body video,
.article-body embed{
  width:100%!important;
  max-width:100%!important;
}
.article-body table{
  display:block;
  width:100%;
  max-width:100%;
  overflow-x:auto;
}
.article-body pre,
.article-body code{
  max-width:100%;
  overflow-x:auto;
}
.article-body figcaption{
  max-width:760px;
  margin:10px auto 0;
  text-align:center;
  color:#817b84;
}

/* Share With */
.article-share .share-actions{
  align-items:center;
}
.share-label{
  font:9px "DM Mono",monospace;
  letter-spacing:.08em;
  color:#77717b;
  margin-right:6px;
}
.article-share .share-actions a,
.article-share .share-actions button{
  font-size:11px;
}

/* Related in orbit — reuse archive-card language, adapted to article width */
.related-articles .related-orbit-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:12px!important;
  padding:0!important;
  margin-top:24px!important;
}
.related-articles .related-orbit-card{
  width:auto!important;
  min-width:0!important;
  min-height:330px!important;
}
.related-articles .related-orbit-card>a{
  height:100%;
}
@media(max-width:900px){
  .related-articles .related-orbit-grid{grid-template-columns:1fr!important}
  .related-articles .related-orbit-card{min-height:280px!important}
}

/* Global user-uploaded images are always constrained */
.cms-project-media img,
.cms-blog-card-image,
.client-avatar img,
.media-grid img{
  max-width:100%!important;
  height:auto;
}



.article-page .interactive-title{
  font-size:clamp(46px,7vw,112px)!important;
  line-height:.90!important;
  letter-spacing:-.052em!important;
  max-width:1320px!important;
  margin-top:34px!important;
  margin-bottom:44px!important;
}
.article-page .cms-bn-article-title{
  font-family:"Anek Bangla","Manrope",sans-serif!important;
  font-size:clamp(46px,6.6vw,104px)!important;
  line-height:1.08!important;
  letter-spacing:0!important;
  word-spacing:.025em!important;
  max-width:1450px!important;
}
.article-page .article-lead{
  font-size:clamp(19px,1.7vw,28px)!important;
  line-height:1.68!important;
}
.article-page .article-section h2{
  font-size:clamp(34px,3.55vw,56px)!important;
  line-height:1.08!important;
  letter-spacing:-.032em!important;
  margin-bottom:28px!important;
}
.article-page .article-conclusion h2{
  font-size:clamp(36px,4vw,62px)!important;
  line-height:1.05!important;
  letter-spacing:-.035em!important;
}
.article-page .cosmic-quote p{
  font-size:clamp(27px,3vw,48px)!important;
  line-height:1.22!important;
}
.journal-page .journal-hero h1{
  font-size:clamp(72px,10vw,175px)!important;
  line-height:.78!important;
}


.outline,
.statement h2 span,
.manifesto h2 span,
.proof-head h2 span,
.planner-intro h2 span,
.service-hero h1 span,
.journal-hero h1 span,
.interactive-title .outline-word,
.article-section h2 em{
  font-family:"Space Grotesk","Manrope",sans-serif!important;
  font-weight:600!important;
  letter-spacing:-.025em!important;
  font-kerning:normal!important;
  font-variant-ligatures:none!important;
  text-rendering:geometricPrecision!important;
  -webkit-text-stroke-width:1px!important;
}

/* Bengali should never use outline/stroke display typography. */
.bn-text.outline,
.bn-text .outline,
.bn-text.outline-word,
.bn-text .outline-word,
.bn-text em,
.bn-text span{
  -webkit-text-stroke:0!important;
}
.interactive-title.bn-text,
.interactive-title.bn-text .outline-word,
.article-section h2.bn-text,
.article-section h2.bn-text em{
  color:#f2f0ea!important;
  -webkit-text-stroke:0!important;
  font-family:"Anek Bangla","Manrope",sans-serif!important;
  font-weight:600!important;
  letter-spacing:0!important;
  line-height:1.12!important;
}

/* Retain visual hierarchy without letter collisions. */
.statement h2 span{ -webkit-text-stroke-color:#0c0c0c!important; }
.proof-head h2 span{ -webkit-text-stroke-color:rgba(255,98,207,.82)!important; }
.planner-intro h2 span{ -webkit-text-stroke-color:#8eeaff!important; }
.service-hero h1 span{ -webkit-text-stroke-color:var(--accent)!important; }
.journal-hero h1 span,.interactive-title .outline-word{
  -webkit-text-stroke-color:rgba(203,177,255,.82)!important;
}
.article-section h2 em{
  -webkit-text-stroke-color:rgba(242,240,234,.64)!important;
}

@media(max-width:640px){
  .article-page .interactive-title{
    font-size:clamp(40px,11.5vw,62px)!important;
    line-height:.96!important;
    letter-spacing:-.04em!important;
  }
  .article-page .cms-bn-article-title{
    font-size:clamp(38px,10.8vw,58px)!important;
    line-height:1.12!important;
  }
  .article-page .article-section h2{
    font-size:clamp(30px,8.7vw,44px)!important;
    line-height:1.14!important;
  }
  .article-page .article-conclusion h2{
    font-size:clamp(32px,9vw,46px)!important;
  }
  .journal-page .journal-hero h1{
    font-size:17vw!important;
  }
}



.article-page .interactive-title{
  position:relative;
  z-index:3;
  max-width:min(1120px,68vw)!important;
}
.article-page .interactive-title .article-title-solid,
.article-page .interactive-title .article-title-outline{
  display:block;
  transform:none!important;
}
.article-page .interactive-title .article-title-solid{
  color:#f2f0ea!important;
}
.article-page .interactive-title .article-title-outline{
  color:transparent!important;
  -webkit-text-stroke:1.35px #caa8ff!important;
  font-family:"Space Grotesk","Manrope",sans-serif!important;
  font-weight:600!important;
  letter-spacing:-.025em!important;
}
.article-page .interactive-title.bn-text .article-title-solid,
.article-page .interactive-title.bn-text .article-title-outline{
  font-family:"Anek Bangla","Manrope",sans-serif!important;
  letter-spacing:0!important;
  word-spacing:.025em!important;
}
.article-page .interactive-title.bn-text .article-title-outline{
  color:rgba(203,177,255,.10)!important;
  -webkit-text-stroke:1px #cbb1ff!important;
  font-weight:600!important;
}

/* Large homepage-inspired orbit in the empty side of article hero */
.article-orbit-small.cms-article-main-orbit{
  width:min(43vw,700px)!important;
  height:min(43vw,700px)!important;
  right:-8vw!important;
  top:120px!important;
  bottom:auto!important;
  opacity:.78;
  border-color:rgba(217,255,82,.08)!important;
  z-index:1;
}
.cms-article-main-orbit>i{
  position:absolute!important;
  border:1px solid rgba(217,255,82,.075)!important;
  border-radius:50%!important;
}
.cms-article-main-orbit>i:nth-child(1){inset:10%!important}
.cms-article-main-orbit>i:nth-child(2){inset:20%!important}
.cms-article-main-orbit>i:nth-child(3){inset:30%!important}
.cms-article-main-orbit .orbit-extra-1{inset:40%!important}
.cms-article-main-orbit .orbit-extra-2{inset:50%!important}
.cms-article-main-orbit .orbit-extra-3{inset:60%!important}
.cms-article-main-orbit .orbit-extra-4{inset:70%!important}
.cms-article-main-orbit b{
  width:20px!important;height:20px!important;
  left:48%!important;top:48%!important;
  box-shadow:0 0 42px rgba(217,255,82,.65)!important;
}
.article-orbit-planet{
  position:absolute;width:9px;height:9px;border-radius:50%;
  background:#8eeaff;box-shadow:0 0 16px currentColor;
  transform-origin:center;
}
.article-orbit-planet.p1{left:25%;top:17%;background:#d9ff52}
.article-orbit-planet.p2{left:82%;top:43%;background:#cbb1ff}
.article-orbit-planet.p3{left:39%;top:83%;background:#ff8bd7}

/* Related in Orbit: every card starts identically from top-left */
.related-articles .related-orbit-card,
.related-articles .related-orbit-card>a{
  text-align:left!important;
}
.related-articles .related-orbit-card>a{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  padding:24px!important;
}
.related-articles .related-orbit-card .archive-index,
.related-articles .related-orbit-card .archive-meta,
.related-articles .related-orbit-card h2,
.related-articles .related-orbit-card p,
.related-articles .related-orbit-card footer{
  width:100%!important;
  text-align:left!important;
  margin-left:0!important;
  margin-right:0!important;
  align-self:stretch!important;
}
.related-articles .related-orbit-card .archive-index{margin-bottom:34px!important}
.related-articles .related-orbit-card .archive-meta{margin-bottom:22px!important}
.related-articles .related-orbit-card h2{
  min-height:2.35em;
  margin-top:0!important;
  margin-bottom:18px!important;
  display:block!important;
}
.related-articles .related-orbit-card p{
  margin-top:0!important;
  margin-bottom:28px!important;
}
.related-articles .related-orbit-card footer{
  margin-top:auto!important;
}

@media(max-width:900px){
  .article-page .interactive-title{max-width:100%!important}
  .article-orbit-small.cms-article-main-orbit{
    width:82vw!important;height:82vw!important;
    right:-56vw!important;top:100px!important;opacity:.38;
  }
}



.article-page .article-hero{
  position:relative!important;
  overflow:hidden!important;
}
.article-page .article-solar-system{
  width:min(55vw,900px)!important;
  height:min(55vw,900px)!important;
  right:-19vw!important;
  top:52%!important;
  transform:translateY(-50%)!important;
  opacity:.72!important;
  pointer-events:none!important;
  z-index:1!important;
  filter:saturate(.8) contrast(1.02)!important;
}
.article-page .article-solar-system .sun-core{
  width:58px!important;height:58px!important;
}
.article-page .interactive-title,
.article-page .article-meta-line,
.article-page .article-intro-grid{
  position:relative;
  z-index:3;
}
@media(max-width:900px){
  .article-page .article-solar-system{
    width:96vw!important;height:96vw!important;
    right:-66vw!important;top:44%!important;opacity:.34!important;
  }
  .article-page .article-solar-system .sun-core{width:38px!important;height:38px!important}
}


.proof-universe{
  min-height:auto!important;
  height:auto!important;
  padding-bottom:110px!important;
}
.proof-sticky{
  position:relative!important;
  top:auto!important;
  min-height:auto!important;
}
.feedback-stage{
  position:relative!important;
  min-height:410px!important;
  overflow:hidden!important;
  margin-top:28px!important;
  border-radius:26px;
}
.feedback-carousel-track{
  display:flex;
  width:100%;
  height:100%;
  transition:transform .7s cubic-bezier(.22,.75,.18,1);
  will-change:transform;
}
.feedback-carousel-track .feedback-card{
  position:relative!important;
  grid-area:auto!important;
  flex:0 0 100%!important;
  width:100%!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  pointer-events:auto!important;
  min-height:390px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  margin:0!important;
  border-radius:26px!important;
}
.feedback-carousel-track .feedback-card.active{
  border-color:rgba(255,99,208,.38)!important;
  box-shadow:inset 0 0 0 1px rgba(255,99,208,.06),0 25px 90px rgba(50,18,62,.18);
}
.feedback-carousel-track .feedback-card>p{
  font-size:clamp(28px,3vw,48px)!important;
  line-height:1.25!important;
  max-width:1200px!important;
  margin:32px 0!important;
}
.feedback-carousel-ui{
  grid-template-columns:auto minmax(140px,1fr) auto auto!important;
  gap:15px!important;
  align-items:center!important;
}
.feedback-controls{
  display:flex;align-items:center;justify-content:flex-end;gap:9px;
}
.feedback-controls>button{
  width:40px;height:40px;border-radius:50%;
  border:1px solid rgba(255,255,255,.18);
  background:transparent;color:#fff;cursor:pointer;
  transition:.2s ease;
}
.feedback-controls>button:hover{background:#fff;color:#09070c}
.feedback-dots{display:flex;gap:6px;align-items:center;padding:0 4px}
.feedback-dots button{
  width:6px;height:6px;padding:0;border:0;border-radius:50%;
  background:rgba(255,255,255,.22);cursor:pointer;
  transition:.25s;
}
.feedback-dots button.active{
  width:22px;border-radius:999px;background:#ff63d0;
}
@media(max-width:700px){
  .proof-universe{padding-bottom:70px!important}
  .proof-head h2{font-size:15vw!important}
  .proof-metrics{grid-template-columns:repeat(3,1fr)!important;gap:7px!important;margin:30px 0 14px!important}
  .proof-metrics strong{font-size:30px!important}
  .proof-metrics span{font-size:7px!important;line-height:1.35!important}
  .feedback-stage{
    min-height:430px!important;
    border-radius:18px!important;
    touch-action:pan-y!important;
  }
  .feedback-carousel-track .feedback-card{
    min-height:430px!important;
    padding:22px!important;
    border-radius:18px!important;
  }
  .feedback-carousel-track .feedback-card>p{
    font-size:22px!important;
    line-height:1.42!important;
    margin:24px 0!important;
  }
  .feedback-top{align-items:center!important}
  .client-avatar{flex:0 0 auto}
  .feedback-carousel-ui{
    grid-template-columns:auto 1fr auto!important;
    margin-top:13px!important;
  }
  .feedback-carousel-ui>span:last-of-type{display:none!important}
  .feedback-controls{grid-column:3}
  .feedback-dots{display:none}
}


@media(max-width:768px){
  .global-footer-word{
    white-space:nowrap!important;
    font-size:clamp(42px,12.2vw,82px)!important;
    line-height:.82!important;
    letter-spacing:-.07em!important;
    width:max-content!important;
    max-width:none!important;
    transform-origin:left center;
  }
  .global-footer{
    overflow:hidden!important;
  }
}
@media(max-width:430px){
  .global-footer-word{font-size:11.7vw!important}
}



.unified-solar-system{
  width:min(55vw,900px)!important;
  height:min(55vw,900px)!important;
  opacity:.72!important;
  pointer-events:none!important;
  filter:saturate(.82) contrast(1.03)!important;
}
.hero .unified-solar-system{
  right:-19vw!important;
  top:50%!important;
  transform:translateY(-50%)!important;
}
.journal-hero .unified-solar-system{
  right:-20vw!important;
  top:50%!important;
  transform:translateY(-50%)!important;
}
.service-hero .unified-solar-system{
  right:-18vw!important;
  top:50%!important;
  transform:translateY(-50%)!important;
}
.article-page .article-solar-system.unified-solar-system{
  right:-19vw!important;
  top:52%!important;
  transform:translateY(-50%)!important;
}
.unified-solar-system .solar-halo{
  opacity:.7!important;
}
.unified-solar-system .sun-core{
  width:58px!important;
  height:58px!important;
}
.unified-solar-system .solar-orbit{
  border-color:rgba(217,255,82,.08)!important;
}
.unified-solar-system .planet i{
  box-shadow:0 0 18px currentColor!important;
}
.unified-solar-system .asteroid-belt{
  opacity:.32!important;
}
@media(max-width:900px){
  .unified-solar-system{
    width:96vw!important;
    height:96vw!important;
    opacity:.34!important;
  }
  .hero .unified-solar-system,
  .journal-hero .unified-solar-system,
  .service-hero .unified-solar-system,
  .article-page .article-solar-system.unified-solar-system{
    right:-66vw!important;
    top:44%!important;
  }
  .unified-solar-system .sun-core{
    width:38px!important;
    height:38px!important;
  }
}


.proof-universe{
  overflow:visible!important;
}
.feedback-stage{
  min-height:500px!important;
  overflow:hidden!important;
  border-radius:28px!important;
  margin-top:34px!important;
  position:relative!important;
}
.feedback-carousel-track{
  display:flex!important;
  width:100%!important;
  height:100%!important;
  transition:transform .72s cubic-bezier(.22,.78,.18,1)!important;
}
.feedback-carousel-track .feedback-card{
  flex:0 0 100%!important;
  width:100%!important;
  min-height:500px!important;
  padding:34px 42px 88px!important;
  box-sizing:border-box!important;
  border-radius:28px!important;
  border:1px solid rgba(255,99,208,.34)!important;
  background:
    radial-gradient(circle at 5% 30%,rgba(111,72,210,.10),transparent 35%),
    rgba(13,10,18,.58)!important;
}
.feedback-carousel-track .feedback-card .feedback-top{
  display:flex!important;
  align-items:center!important;
  gap:16px!important;
}
.feedback-carousel-track .client-avatar{
  width:72px!important;
  height:72px!important;
  flex:0 0 72px!important;
  font-size:16px!important;
  border-radius:50%!important;
}
.feedback-carousel-track .client-avatar img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
.feedback-carousel-track .feedback-card>p{
  font-size:clamp(28px,2.65vw,46px)!important;
  line-height:1.28!important;
  max-width:1180px!important;
  margin:38px 0 22px!important;
}
.feedback-carousel-track .stars{
  font-size:16px!important;
  letter-spacing:4px!important;
}
.feedback-nav-overlay{
  position:absolute;
  left:0;right:0;bottom:0;
  height:72px;
  padding:0 26px;
  display:grid;
  grid-template-columns:52px 1fr 52px;
  align-items:center;
  gap:16px;
  z-index:20;
  background:linear-gradient(180deg,transparent,rgba(8,7,11,.88) 48%);
  pointer-events:none;
}
.feedback-nav-overlay>*{pointer-events:auto}
.feedback-arrow{
  width:48px!important;
  height:48px!important;
  border-radius:50%!important;
  border:1px solid rgba(255,255,255,.28)!important;
  background:rgba(255,255,255,.04)!important;
  color:#fff!important;
  font-size:21px!important;
  cursor:pointer!important;
  display:grid!important;
  place-items:center!important;
  backdrop-filter:blur(10px);
  transition:transform .2s,background .2s,color .2s,border-color .2s!important;
}
.feedback-arrow:hover{
  transform:scale(1.06);
  background:#f4f1ec!important;
  color:#111!important;
  border-color:#f4f1ec!important;
}
.feedback-nav-center{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
}
.feedback-nav-label{
  font:9px "DM Mono",monospace;
  letter-spacing:.11em;
  color:#7c7480;
}
.feedback-dots{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
}
.feedback-dots button{
  width:7px!important;
  height:7px!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.25)!important;
  transition:width .25s,background .25s!important;
}
.feedback-dots button.active{
  width:28px!important;
  background:#ff63d0!important;
}
.feedback-carousel-ui-v11{
  margin-top:12px!important;
}
.feedback-carousel-ui-v11 .feedback-controls{
  display:none!important;
}

@media(max-width:700px){
  .feedback-stage{
    min-height:470px!important;
    border-radius:20px!important;
  }
  .feedback-carousel-track .feedback-card{
    min-height:470px!important;
    padding:24px 22px 86px!important;
    border-radius:20px!important;
  }
  .feedback-carousel-track .client-avatar{
    width:62px!important;
    height:62px!important;
    flex-basis:62px!important;
  }
  .feedback-carousel-track .feedback-card>p{
    font-size:21px!important;
    line-height:1.42!important;
    margin:28px 0 18px!important;
  }
  .feedback-nav-overlay{
    grid-template-columns:46px 1fr 46px;
    padding:0 14px;
    height:70px;
  }
  .feedback-arrow{
    width:44px!important;
    height:44px!important;
  }
  .feedback-nav-label{
    display:none!important;
  }
  .feedback-dots button.active{
    width:22px!important;
  }
}

/* Mobile footer remains one line */
@media(max-width:768px){
  .global-footer-word{
    white-space:nowrap!important;
    font-size:clamp(38px,11.4vw,76px)!important;
    line-height:.82!important;
  }
}



.master-solar-system{
  position:absolute!important;
  width:min(55vw,900px)!important;
  height:min(55vw,900px)!important;
  border-radius:50%!important;
  z-index:1!important;
  pointer-events:auto!important;
  opacity:.72!important;
  filter:saturate(.82) contrast(1.03)!important;
  transform:translateY(-50%)!important;
  will-change:transform!important;
}
.master-solar-home,
.master-solar-journal,
.master-solar-service,
.master-solar-article{
  right:-19vw!important;
  top:52%!important;
}

.master-solar-system:before{
  content:""!important;
  position:absolute!important;
  inset:1.5%!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:50%!important;
}
.master-solar-system:after{
  content:""!important;
  position:absolute!important;
  inset:15%!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:50%!important;
}

.master-solar-system .solar-halo{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  border-radius:50%!important;
  transform:translate(-50%,-50%)!important;
  pointer-events:none!important;
}
.master-solar-system .halo-a{
  width:100%!important;height:100%!important;
  border:1px dashed rgba(217,255,82,.13)!important;
  background:transparent!important;
  animation:masterHaloSpin 46s linear infinite!important;
}
.master-solar-system .halo-b{
  width:72%!important;height:72%!important;
  border:1px dotted rgba(105,95,255,.14)!important;
  background:transparent!important;
  animation:masterHaloSpin 31s linear infinite reverse!important;
}

.master-solar-system .sun-core{
  position:absolute!important;
  left:50%!important;top:50%!important;
  width:58px!important;height:58px!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%!important;
  display:grid!important;place-items:center!important;
  z-index:8!important;
  border:0!important;
  background:radial-gradient(circle at 38% 34%,#fffbe0 0 6%,#f3ff7a 11%,#d9ff52 34%,#91a900 62%,rgba(217,255,82,.12) 72%,transparent 74%)!important;
  box-shadow:0 0 20px rgba(240,255,155,.72),0 0 58px rgba(217,255,82,.28),0 0 120px rgba(217,255,82,.11)!important;
}
.master-solar-system .sun-core span{
  width:100%!important;height:100%!important;
  border-radius:50%!important;
  background:transparent!important;
  box-shadow:none!important;
  position:relative!important;
  animation:masterSunPlasma 5s ease-in-out infinite!important;
}
.master-solar-system .sun-core span:before,
.master-solar-system .sun-core span:after{
  content:""!important;
  position:absolute!important;
  inset:-18%!important;
  border-radius:50%!important;
  border:1px solid rgba(217,255,82,.17)!important;
  animation:masterSunHalo 4s ease-in-out infinite!important;
}
.master-solar-system .sun-core span:after{inset:-38%!important;opacity:.36!important;animation-delay:1.3s!important}

.master-solar-system .solar-orbit{
  position:absolute!important;
  left:50%!important;top:50%!important;
  border:1px solid rgba(255,255,255,.105)!important;
  border-radius:50%!important;
  transform:translate(-50%,-50%)!important;
  overflow:visible!important;
  will-change:transform!important;
}
.master-solar-system .solar-orbit-1{width:19%!important;height:19%!important;animation:masterOrbitSpin 5.2s linear infinite!important}
.master-solar-system .solar-orbit-2{width:28%!important;height:28%!important;animation:masterOrbitSpin 8.2s linear infinite!important}
.master-solar-system .solar-orbit-3{width:38%!important;height:38%!important;animation:masterOrbitSpin 12.2s linear infinite!important}
.master-solar-system .solar-orbit-4{width:48%!important;height:48%!important;animation:masterOrbitSpin 16.4s linear infinite!important}
.master-solar-system .solar-orbit-5{width:61%!important;height:61%!important;animation:masterOrbitSpin 27s linear infinite!important}
.master-solar-system .solar-orbit-6{width:73%!important;height:73%!important;animation:masterOrbitSpin 35s linear infinite!important}
.master-solar-system .solar-orbit-7{width:84%!important;height:84%!important;animation:masterOrbitSpin 44s linear infinite!important}
.master-solar-system .solar-orbit-8{width:96%!important;height:96%!important;animation:masterOrbitSpin 54s linear infinite!important}

.master-solar-system .planet{
  position:absolute!important;
  left:50%!important;top:-7px!important;
  right:auto!important;
  transform:translate(-50%,-50%)!important;
  margin:0!important;
  border:0!important;background:transparent!important;box-shadow:none!important;
  cursor:pointer!important;z-index:7!important;
  pointer-events:auto!important;
}
.master-solar-system .planet i{
  display:block!important;width:100%!important;height:100%!important;
  border-radius:50%!important;border:0!important;
  transition:transform .25s ease,box-shadow .25s ease,filter .25s ease!important;
}
.master-solar-system .planet:after{
  content:attr(data-label)!important;
  position:absolute!important;
  left:50%!important;right:auto!important;
  top:calc(100% + 10px)!important;
  transform:translateX(-50%)!important;
  white-space:nowrap!important;
  padding:4px 7px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:999px!important;
  background:rgba(5,6,9,.78)!important;
  backdrop-filter:blur(8px)!important;
  font:9px/1 "DM Mono",monospace!important;
  letter-spacing:.08em!important;
  color:#fff!important;
  opacity:0!important;
  pointer-events:none!important;
  transition:opacity .2s ease!important;
}
.master-solar-system .planet:hover:after{opacity:1!important}
.master-solar-system .planet:hover i{transform:scale(1.7)!important;filter:saturate(1.25)!important}

.master-solar-system .mercury{width:8px!important;height:8px!important}.master-solar-system .mercury i{background:radial-gradient(circle at 35% 30%,#d6d1c7,#827e76 48%,#373735 76%)!important}
.master-solar-system .venus{width:12px!important;height:12px!important}.master-solar-system .venus i{background:radial-gradient(circle at 35% 30%,#ffe0a3,#c88938 52%,#71420f 80%)!important}
.master-solar-system .earth{width:14px!important;height:14px!important}.master-solar-system .earth i{background:radial-gradient(circle at 62% 45%,#8ee3a8 0 9%,transparent 10%),radial-gradient(circle at 35% 37%,#61be76 0 16%,#2482d7 18% 66%,#0c3459 82%)!important}
.master-solar-system .mars{width:11px!important;height:11px!important}.master-solar-system .mars i{background:radial-gradient(circle at 32% 26%,#ffb174,#d85e2d 49%,#6e2518 80%)!important}
.master-solar-system .jupiter{width:26px!important;height:26px!important}.master-solar-system .jupiter i{background:repeating-linear-gradient(0deg,#a9622e 0 3px,#f0c28e 3px 6px,#704125 6px 8px,#d79a62 8px 11px)!important}
.master-solar-system .saturn{width:22px!important;height:22px!important}.master-solar-system .saturn i{background:radial-gradient(circle,#f2d69a,#b88d4e 68%,#6c4926)!important}
.master-solar-system .saturn-ring{position:absolute!important;left:50%!important;top:50%!important;width:40px!important;height:13px!important;border:2px solid rgba(238,207,145,.55)!important;border-left-color:rgba(238,207,145,.18)!important;border-radius:50%!important;transform:translate(-50%,-50%) rotate(-18deg)!important;pointer-events:none!important}
.master-solar-system .uranus{width:17px!important;height:17px!important}.master-solar-system .uranus i{background:radial-gradient(circle at 34% 30%,#c9ffff,#65d7de 56%,#267e95 82%)!important}
.master-solar-system .neptune{width:17px!important;height:17px!important}.master-solar-system .neptune i{background:radial-gradient(circle at 34% 30%,#7bc8ff,#246ee2 50%,#123286 82%)!important}

.master-solar-system .asteroid-belt{
  position:absolute!important;
  left:50%!important;top:50%!important;
  width:55%!important;height:55%!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%!important;
  border:1px dotted rgba(255,255,255,.12)!important;
  opacity:.5!important;
  animation:masterHaloSpin 80s linear infinite reverse!important;
}
.master-solar-system .asteroid-belt:after{
  content:""!important;position:absolute!important;inset:-2px!important;border-radius:50%!important;
  background:repeating-conic-gradient(rgba(255,255,255,0) 0 4deg,rgba(255,255,255,.23) 4.15deg 4.25deg,rgba(255,255,255,0) 4.4deg 7deg)!important;
  mask:radial-gradient(circle,transparent 0 48%,#000 49% 52%,transparent 53%)!important;
}

@keyframes masterOrbitSpin{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes masterHaloSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes masterSunPlasma{0%,100%{transform:scale(.96) rotate(0)}50%{transform:scale(1.08) rotate(12deg)}}
@keyframes masterSunHalo{0%,100%{transform:scale(.88);opacity:.2}50%{transform:scale(1.14);opacity:.7}}

/* Remove legacy page-specific orbit visuals when master is mounted. */
.service-solar-system,.blog-orbit-bg,.article-orbit-small{display:none!important}


.service-master-nav.nav{
  position:fixed!important;
  top:0!important;left:0!important;right:0!important;
  z-index:90!important;
  display:grid!important;
  grid-template-columns:1fr 1fr 1fr!important;
  align-items:center!important;
  padding:22px 32px!important;
  color:#fff!important;
  background:linear-gradient(180deg,rgba(8,9,12,.84),rgba(8,9,12,.18),transparent)!important;
  backdrop-filter:none!important;
  mix-blend-mode:normal!important;
}
.service-master-nav .brand-icon img{
  width:46px!important;height:30px!important;object-fit:contain!important;
  filter:grayscale(1) brightness(0) invert(1)!important;
}
.service-master-nav .nav-meta{
  text-align:center!important;
  font:11px "DM Mono",monospace!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}
.service-master-nav nav{
  display:flex!important;
  justify-content:flex-end!important;
  gap:24px!important;
  font-size:13px!important;
}
.service-master-nav nav a{position:relative!important}
.service-master-nav nav a:after{
  content:""!important;position:absolute!important;left:0!important;right:100%!important;
  bottom:-5px!important;height:1px!important;background:currentColor!important;
  transition:right .35s cubic-bezier(.2,.8,.2,1)!important;
}
.service-master-nav nav a:hover:after{right:0!important}


.feedback-stage{
  min-height:520px!important;
  padding-bottom:0!important;
  overflow:hidden!important;
  background:transparent!important;
}
.feedback-carousel-track{
  min-height:520px!important;
}
.feedback-carousel-track .feedback-card{
  min-height:520px!important;
  padding:34px 42px 108px!important;
}
.feedback-nav-overlay{
  height:88px!important;
  left:18px!important;right:18px!important;bottom:10px!important;
  padding:0 12px!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
  background:linear-gradient(180deg,rgba(8,7,11,0),rgba(8,7,11,.96) 42%)!important;
}
.feedback-arrow{
  width:54px!important;height:54px!important;
  border:1px solid rgba(255,255,255,.42)!important;
  background:rgba(255,255,255,.07)!important;
  box-shadow:0 8px 30px rgba(0,0,0,.24)!important;
}
.feedback-arrow:before{
  font-size:22px!important;
}
.feedback-carousel-track .client-avatar{
  width:84px!important;height:84px!important;flex:0 0 84px!important;
}
.feedback-nav-label{
  color:#b6adb9!important;
}
.feedback-carousel-ui-v11{
  position:relative!important;
  z-index:5!important;
  margin-top:18px!important;
}

/* Old card footer never competes with slider navigation. */
.feedback-carousel-track .feedback-card footer{
  padding-bottom:0!important;
  margin-bottom:0!important;
}

@media(max-width:900px){
  .master-solar-system{
    width:96vw!important;height:96vw!important;
    right:-66vw!important;top:44%!important;
    opacity:.34!important;
    pointer-events:none!important;
  }
  .master-solar-system .sun-core{width:38px!important;height:38px!important}

  .service-master-nav.nav{
    grid-template-columns:1fr auto!important;
    padding:18px 16px!important;
  }
  .service-master-nav .nav-meta{display:none!important}
  .service-master-nav nav{gap:14px!important;font-size:11px!important}
  .service-master-nav nav a:nth-child(2){display:none!important}
}
@media(max-width:700px){
  .feedback-stage,.feedback-carousel-track,.feedback-carousel-track .feedback-card{
    min-height:500px!important;
  }
  .feedback-carousel-track .feedback-card{
    padding:24px 22px 100px!important;
  }
  .feedback-carousel-track .client-avatar{
    width:70px!important;height:70px!important;flex-basis:70px!important;
  }
  .feedback-nav-overlay{
    left:8px!important;right:8px!important;bottom:6px!important;height:82px!important;
    grid-template-columns:52px 1fr 52px!important;
  }
  .feedback-arrow{width:50px!important;height:50px!important}
}




.front-blog-tools{
  display:grid;
  grid-template-columns:minmax(240px,1fr) 240px auto;
  gap:10px;
  align-items:center;
  margin:0 4% 28px;
  padding:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:rgba(10,10,14,.58);
  backdrop-filter:blur(12px);
}
.front-blog-search{position:relative}
.front-blog-search span{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#d9ff52;font-size:18px}
.front-blog-search input{
  width:100%;padding:13px 14px 13px 40px;border-radius:12px;
  border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.025);color:#fff;
}
.front-blog-tools select{
  width:100%;padding:13px;border-radius:12px;border:1px solid rgba(255,255,255,.12);
  background:#0b0c10;color:#fff;
}
.front-blog-count{font:9px "DM Mono",monospace;color:#77717d;white-space:nowrap}
@media(max-width:700px){
 .front-blog-tools{grid-template-columns:1fr;margin:0 16px 22px}
}



.master-solar-system .solar-orbit{
  animation-play-state:running!important;
  transform-origin:center center!important;
}
.master-solar-system .solar-orbit-1{animation:masterOrbitSpin 5.2s linear infinite!important}
.master-solar-system .solar-orbit-2{animation:masterOrbitSpin 8.2s linear infinite!important}
.master-solar-system .solar-orbit-3{animation:masterOrbitSpin 12.2s linear infinite!important}
.master-solar-system .solar-orbit-4{animation:masterOrbitSpin 16.4s linear infinite!important}
.master-solar-system .solar-orbit-5{animation:masterOrbitSpin 27s linear infinite!important}
.master-solar-system .solar-orbit-6{animation:masterOrbitSpin 35s linear infinite!important}
.master-solar-system .solar-orbit-7{animation:masterOrbitSpin 44s linear infinite!important}
.master-solar-system .solar-orbit-8{animation:masterOrbitSpin 54s linear infinite!important}
.master-solar-system .halo-a{animation:masterHaloSpin 46s linear infinite!important}
.master-solar-system .halo-b{animation:masterHaloSpin 31s linear infinite reverse!important}
.master-solar-system .asteroid-belt{animation:masterHaloSpin 80s linear infinite reverse!important}
.master-solar-system .sun-core span{animation:masterSunPlasma 5s ease-in-out infinite!important}

@media(max-width:900px){
  .master-solar-system .solar-orbit-1{animation-duration:9s!important}
  .master-solar-system .solar-orbit-2{animation-duration:14s!important}
  .master-solar-system .solar-orbit-3{animation-duration:19s!important}
  .master-solar-system .solar-orbit-4{animation-duration:25s!important}
  .master-solar-system .solar-orbit-5{animation-duration:34s!important}
  .master-solar-system .solar-orbit-6{animation-duration:43s!important}
  .master-solar-system .solar-orbit-7{animation-duration:52s!important}
  .master-solar-system .solar-orbit-8{animation-duration:62s!important}
}


.proof-universe{
  padding-bottom:72px!important;
}
.feedback-stage{
  height:clamp(360px,44vh,430px)!important;
  min-height:360px!important;
  overflow:hidden!important;
  border-radius:24px!important;
  margin-top:24px!important;
}
.feedback-carousel-track{
  height:100%!important;
  min-height:0!important;
}
.feedback-carousel-track .feedback-card{
  height:100%!important;
  min-height:0!important;
  padding:28px 76px 58px!important;
  overflow:hidden!important;
  justify-content:flex-start!important;
}
.feedback-carousel-track .feedback-card .feedback-top{
  flex:0 0 auto!important;
}
.feedback-carousel-track .client-avatar{
  width:78px!important;
  height:78px!important;
  flex:0 0 78px!important;
}
.feedback-carousel-track .feedback-card>p{
  flex:1 1 auto!important;
  display:flex!important;
  align-items:center!important;
  font-size:clamp(25px,2.4vw,40px)!important;
  line-height:1.30!important;
  margin:20px 0 12px!important;
  max-width:1200px!important;
}
.feedback-carousel-track .feedback-card footer{
  flex:0 0 auto!important;
  margin-top:auto!important;
}

/* Navigation is now centered vertically on both sides of the card. */
.feedback-nav-overlay{
  position:absolute!important;
  inset:0!important;
  height:auto!important;
  padding:0!important;
  display:block!important;
  background:none!important;
  border:0!important;
  pointer-events:none!important;
  z-index:30!important;
}
.feedback-nav-overlay .feedback-arrow{
  position:absolute!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:50px!important;
  height:50px!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:rgba(8,8,12,.76)!important;
  border:1px solid rgba(255,255,255,.45)!important;
  color:#fff!important;
  box-shadow:0 10px 34px rgba(0,0,0,.34)!important;
  backdrop-filter:blur(12px)!important;
  pointer-events:auto!important;
  z-index:4!important;
}
.feedback-nav-overlay .feedback-prev{left:16px!important}
.feedback-nav-overlay .feedback-next{right:16px!important}
.feedback-nav-overlay .feedback-arrow:hover{
  transform:translateY(-50%) scale(1.08)!important;
  background:#f3f0ea!important;
  color:#101010!important;
}
.feedback-nav-center{
  position:absolute!important;
  left:50%!important;
  bottom:18px!important;
  transform:translateX(-50%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:13px!important;
  pointer-events:auto!important;
  padding:7px 12px!important;
  border-radius:999px!important;
  background:rgba(7,7,10,.66)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  backdrop-filter:blur(10px)!important;
}
.feedback-nav-label{
  display:block!important;
  color:#928a96!important;
}
.feedback-dots{
  display:flex!important;
}
.feedback-dots button{
  cursor:pointer!important;
}
.feedback-carousel-ui-v11{
  margin-top:10px!important;
}
.feedback-carousel-ui-v11>span:last-of-type{
  opacity:.65!important;
}

/* Keep the client identity clean and visually stronger. */
.feedback-carousel-track .feedback-top strong{
  font-size:15px!important;
}
.feedback-carousel-track .feedback-top span{
  font-size:9px!important;
}

@media(max-width:700px){
  .proof-universe{padding-bottom:55px!important}
  .feedback-stage{
    height:420px!important;
    min-height:420px!important;
    border-radius:18px!important;
  }
  .feedback-carousel-track .feedback-card{
    padding:22px 58px 58px!important;
  }
  .feedback-carousel-track .client-avatar{
    width:66px!important;
    height:66px!important;
    flex-basis:66px!important;
  }
  .feedback-carousel-track .feedback-card>p{
    font-size:20px!important;
    line-height:1.42!important;
    margin:18px 0 8px!important;
    align-items:flex-start!important;
    padding-top:8px!important;
  }
  .feedback-nav-overlay .feedback-arrow{
    width:44px!important;
    height:44px!important;
  }
  .feedback-nav-overlay .feedback-prev{left:7px!important}
  .feedback-nav-overlay .feedback-next{right:7px!important}
  .feedback-nav-center{
    bottom:10px!important;
    padding:6px 9px!important;
  }
  .feedback-nav-label{display:none!important}
}

/* Very short desktop viewports: keep the whole slider visible without
   forcing the user to scroll just to find its controls. */
@media(min-width:701px) and (max-height:820px){
  .feedback-stage{
    height:350px!important;
    min-height:350px!important;
  }
  .feedback-carousel-track .feedback-card{
    padding-top:22px!important;
    padding-bottom:52px!important;
  }
  .feedback-carousel-track .client-avatar{
    width:68px!important;
    height:68px!important;
    flex-basis:68px!important;
  }
  .feedback-carousel-track .feedback-card>p{
    font-size:clamp(23px,2.15vw,34px)!important;
    margin:12px 0 6px!important;
  }
}



.proof-universe{
  min-height:0!important;
  height:auto!important;
  padding:110px 0 90px!important;
  overflow:visible!important;
}
.proof-sticky{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
  padding:0 4.4vw!important;
  display:block!important;
}
.proof-sticky::before{
  inset:-110px -4.4vw -90px!important;
}

/* Keep the heading compact enough that the slider enters the viewport naturally. */
.proof-head{
  grid-template-columns:1.05fr .75fr!important;
  gap:48px!important;
  align-items:end!important;
}
.proof-head h2{
  font-size:clamp(58px,7vw,112px)!important;
  line-height:.77!important;
}
.proof-head>p{
  font-size:15px!important;
  max-width:460px!important;
}
.proof-metrics{
  margin:34px 0 26px!important;
}

/* Slider height follows content rather than the monitor height. */
.feedback-stage{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  overflow:hidden!important;
  border-radius:24px!important;
}
.feedback-carousel-track{
  height:auto!important;
  min-height:0!important;
  align-items:stretch!important;
}
.feedback-carousel-track .feedback-card{
  height:auto!important;
  min-height:360px!important;
  overflow:visible!important;
  padding:28px 78px 72px!important;
  display:flex!important;
  flex-direction:column!important;
  box-sizing:border-box!important;
}
.feedback-carousel-track .feedback-card>p{
  flex:1 0 auto!important;
  min-height:0!important;
  display:block!important;
  font-size:clamp(25px,2.35vw,39px)!important;
  line-height:1.32!important;
  margin:26px 0 28px!important;
}
.feedback-carousel-track .feedback-card footer{
  flex:0 0 auto!important;
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  padding-top:14px!important;
  margin-top:auto!important;
}
.feedback-carousel-track .client-avatar{
  width:78px!important;
  height:78px!important;
  flex-basis:78px!important;
}

/* Side navigation remains visible without consuming vertical space. */
.feedback-nav-overlay{
  inset:0!important;
}
.feedback-nav-center{
  bottom:14px!important;
}

/* Old scroll UI was designed for the sticky version; keep only useful progress. */
.feedback-carousel-ui-v11{
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  align-items:center!important;
  margin-top:12px!important;
  padding:0 4px!important;
}
.feedback-carousel-ui-v11>span:last-of-type{
  display:none!important;
}

/* Medium desktop / common 21" monitor */
@media(min-width:901px) and (max-height:900px){
  .proof-universe{
    padding:76px 0 70px!important;
  }
  .proof-head h2{
    font-size:clamp(52px,6.3vw,94px)!important;
  }
  .proof-head>p{
    font-size:14px!important;
  }
  .proof-metrics{
    margin:25px 0 21px!important;
  }
  .proof-metrics strong{
    font-size:clamp(42px,4.1vw,64px)!important;
  }
  .feedback-carousel-track .feedback-card{
    min-height:325px!important;
    padding:24px 72px 66px!important;
  }
  .feedback-carousel-track .client-avatar{
    width:68px!important;
    height:68px!important;
    flex-basis:68px!important;
  }
  .feedback-carousel-track .feedback-card>p{
    font-size:clamp(22px,2vw,32px)!important;
    margin:20px 0 22px!important;
  }
}

/* Tablet / mobile: every testimonial stays fully readable. */
@media(max-width:900px){
  .proof-universe{
    padding:82px 0 65px!important;
  }
  .proof-sticky{
    padding:0 18px!important;
  }
  .proof-head{
    grid-template-columns:1fr!important;
    gap:22px!important;
  }
  .proof-head h2{
    font-size:clamp(54px,14vw,88px)!important;
  }
  .proof-head>p{
    margin:0!important;
    max-width:600px!important;
  }
  .proof-metrics{
    grid-template-columns:repeat(3,1fr)!important;
    gap:8px!important;
    margin:26px 0 20px!important;
  }
  .proof-metrics strong{
    font-size:clamp(29px,8.5vw,50px)!important;
  }
  .feedback-carousel-track .feedback-card{
    min-height:380px!important;
    padding:22px 58px 66px!important;
  }
  .feedback-carousel-track .client-avatar{
    width:64px!important;
    height:64px!important;
    flex-basis:64px!important;
  }
  .feedback-carousel-track .feedback-card>p{
    font-size:20px!important;
    line-height:1.43!important;
    margin:20px 0 22px!important;
  }
  .feedback-nav-center{
    bottom:9px!important;
  }
}
@media(max-width:520px){
  .proof-sticky{padding:0 12px!important}
  .proof-metrics{
    grid-template-columns:1fr 1fr 1fr!important;
  }
  .proof-metrics span{
    font-size:6.8px!important;
  }
  .feedback-carousel-track .feedback-card{
    min-height:400px!important;
    padding:20px 48px 62px!important;
  }
  .feedback-carousel-track .feedback-card>p{
    font-size:18px!important;
    line-height:1.47!important;
  }
  .feedback-nav-overlay .feedback-prev{left:5px!important}
  .feedback-nav-overlay .feedback-next{right:5px!important}
  .feedback-nav-overlay .feedback-arrow{
    width:40px!important;
    height:40px!important;
  }
}



.master-solar-system.js-solar-motion .solar-orbit,
.master-solar-system.js-solar-motion .solar-halo{
  animation:none!important;
  animation-play-state:running!important;
}



.solar-engine-active .solar-orbit,
.solar-engine-active .solar-halo{
  animation:none!important;
  animation-play-state:running!important;
  will-change:transform!important;
}
.solar-engine-active .planet{
  backface-visibility:hidden;
}



@media(max-width:900px){
  html,body{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  .planner-universe{
    width:100%!important;
    max-width:100vw!important;
    overflow:hidden!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  .planner-universe > .panel-inner,
  .planner-universe > div,
  .planner-intro,
  .planner-shell,
  .project-planner,
  .planner-pane,
  .field,
  .input-grid,
  .choice-grid,
  .budget-grid,
  .timeline-grid{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  .planner-intro{
    width:100%!important;
    padding:0 18px!important;
    gap:20px!important;
    overflow:hidden!important;
  }
  .planner-intro .contact-kicker{
    max-width:100%!important;
    overflow-wrap:anywhere!important;
  }
  .planner-intro h2{
    width:100%!important;
    max-width:100%!important;
    font-size:clamp(50px,14.2vw,92px)!important;
    line-height:.80!important;
    letter-spacing:-.065em!important;
    transform:none!important;
    overflow:visible!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    margin:10px 0 4px!important;
  }
  .planner-intro h2 span{
    display:inline!important;
    max-width:100%!important;
    -webkit-text-stroke-width:1px!important;
  }
  .planner-intro>p{
    width:100%!important;
    max-width:620px!important;
    font-size:16px!important;
    line-height:1.65!important;
    margin:0!important;
  }
  .planner-shell{
    width:calc(100% - 24px)!important;
    max-width:calc(100vw - 24px)!important;
    margin:44px 12px 0!important;
    overflow:hidden!important;
  }
  .planner-side,
  .project-planner{
    width:100%!important;
    max-width:100%!important;
  }
  .planner-side{
    padding:18px!important;
  }
  .project-planner{
    padding:24px 18px!important;
  }
  .planner-pane h3{
    font-size:clamp(34px,10vw,48px)!important;
    line-height:.98!important;
    overflow-wrap:anywhere!important;
  }
  .field input,
  .field textarea,
  .choice-grid span,
  .budget-grid span,
  .timeline-grid span{
    max-width:100%!important;
    min-width:0!important;
  }
  .planner-actions{
    width:100%!important;
    min-width:0!important;
  }
  .contact-foot{
    width:100%!important;
    min-width:0!important;
    padding-left:18px!important;
    padding-right:18px!important;
  }

  /* Show much more of the master solar on mobile.
     Previous right:-66vw exposed only a thin slice. */
  .master-solar-system,
  .hero .master-solar-system,
  .journal-hero .master-solar-system,
  .service-hero .master-solar-system,
  .article-page .master-solar-system{
    width:100vw!important;
    height:100vw!important;
    right:-42vw!important;
    top:44%!important;
    opacity:.46!important;
    transform:translateY(-50%)!important;
  }
}

@media(max-width:520px){
  .planner-intro{
    padding:0 14px!important;
  }
  .planner-intro h2{
    font-size:clamp(47px,14.5vw,72px)!important;
    line-height:.82!important;
    letter-spacing:-.06em!important;
  }
  .planner-shell{
    width:calc(100% - 16px)!important;
    max-width:calc(100vw - 16px)!important;
    margin-left:8px!important;
    margin-right:8px!important;
  }
  .project-planner{
    padding:22px 14px!important;
  }

  .master-solar-system,
  .hero .master-solar-system,
  .journal-hero .master-solar-system,
  .service-hero .master-solar-system,
  .article-page .master-solar-system{
    width:104vw!important;
    height:104vw!important;
    right:-45vw!important;
    opacity:.48!important;
  }
}


.article-body h2[id],.article-body h3[id],.article-section-heading{scroll-margin-top:110px}
.article-toc a{overflow-wrap:anywhere}



@media(hover:hover) and (pointer:fine){
  .premium-cursor-enabled,
  .premium-cursor-enabled body,
  .premium-cursor-enabled a,
  .premium-cursor-enabled button,
  .premium-cursor-enabled input,
  .premium-cursor-enabled textarea,
  .premium-cursor-enabled select,
  .premium-cursor-enabled label,
  .premium-cursor-enabled [role="button"]{
    cursor:none!important;
  }

  .global-cursor-dot,
  .global-cursor-ring,
  .global-cursor-label{
    position:fixed;
    left:0;top:0;
    z-index:999999;
    pointer-events:none;
    opacity:0;
  }

  .global-cursor-dot{
    width:7px;height:7px;
    border-radius:50%;
    background:#d9ff52;
    box-shadow:0 0 18px rgba(217,255,82,.65);
    transition:opacity .18s ease, width .18s ease, height .18s ease, background .18s ease;
  }

  .global-cursor-ring{
    width:38px;height:38px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.52);
    background:rgba(255,255,255,.015);
    backdrop-filter:blur(2px);
    box-shadow:0 0 0 1px rgba(255,255,255,.025) inset;
    transition:
      opacity .18s ease,
      width .22s cubic-bezier(.2,.8,.2,1),
      height .22s cubic-bezier(.2,.8,.2,1),
      border-color .2s ease,
      background .2s ease;
  }

  .global-cursor-dot.is-visible,
  .global-cursor-ring.is-visible{opacity:1}

  .global-cursor-ring.is-active{
    width:58px;height:58px;
    border-color:rgba(217,255,82,.68);
    background:rgba(217,255,82,.055);
  }

  .global-cursor-label{
    padding:5px 7px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:999px;
    background:rgba(8,9,12,.78);
    backdrop-filter:blur(10px);
    color:#eef2e3;
    font:8px/1 "DM Mono",monospace;
    letter-spacing:.08em;
    white-space:nowrap;
    transition:opacity .14s ease;
  }
  .global-cursor-label.is-visible{opacity:1}
}

@media(hover:none),(pointer:coarse){
  .global-cursor-dot,.global-cursor-ring,.global-cursor-label{display:none!important}
}


@media(hover:hover) and (pointer:fine){
  .global-cursor-ring{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    background:transparent!important;
    border-color:rgba(242,240,234,.62)!important;
    box-shadow:none!important;
    mix-blend-mode:difference!important;
  }
  .global-cursor-ring.is-active{
    background:transparent!important;
    border-color:#d9ff52!important;
    box-shadow:0 0 0 1px rgba(217,255,82,.08)!important;
  }
  .global-cursor-label{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    background:#0b0c0e!important;
    border-color:rgba(255,255,255,.18)!important;
    box-shadow:0 7px 18px rgba(0,0,0,.22)!important;
  }
}

.services-universe{
  overflow:hidden!important;
}
.services-universe .manifesto-ticker{
  position:absolute!important;
  top:58px!important;
  left:0!important;
  width:100%!important;
  padding:0!important;
  border-top:1px solid rgba(217,255,82,.3)!important;
  border-bottom:1px solid rgba(217,255,82,.3)!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  animation:none!important;
  color:#d9ff52!important;
  background:linear-gradient(90deg,rgba(217,255,82,.025),rgba(217,255,82,.055),rgba(217,255,82,.025))!important;
}
.services-universe .manifesto-ticker-track{
  display:flex!important;
  width:max-content!important;
  will-change:transform!important;
  animation:servicesMarqueeV23 24s linear infinite!important;
}
.services-universe .manifesto-ticker-group{
  flex:none!important;
  display:flex!important;
  align-items:center!important;
  gap:28px!important;
  padding:17px 28px 17px 0!important;
  font-family:"DM Mono",monospace!important;
  font-size:clamp(15px,1.25vw,21px)!important;
  line-height:1!important;
  letter-spacing:.13em!important;
  font-weight:600!important;
  text-transform:uppercase!important;
}
.services-universe .manifesto-ticker-group span{
  display:inline-flex!important;
  align-items:center!important;
  gap:28px!important;
}
.services-universe .manifesto-ticker-group span::after{
  content:"→"!important;
  color:rgba(217,255,82,.68)!important;
  font-size:1.05em!important;
}
@keyframes servicesMarqueeV23{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}
@media(max-width:900px){
  .services-universe .manifesto-ticker{top:54px!important}
  .services-universe .manifesto-ticker-group{
    gap:22px!important;
    padding:15px 22px 15px 0!important;
    font-size:14px!important;
    letter-spacing:.11em!important;
  }
  .services-universe .manifesto-ticker-group span{gap:22px!important}
  .services-universe .manifesto-ticker-track{animation-duration:20s!important}
}



.service-marquee,
.services-marquee,
.marquee-band{
  overflow:hidden!important;
  width:100%!important;
  margin-bottom:72px!important;
}

.service-marquee-track,
.services-marquee-track,
.marquee-track{
  display:flex!important;
  flex-wrap:nowrap!important;
  width:max-content!important;
  min-width:max-content!important;
  gap:0!important;
  animation:v24Marquee 28s linear infinite!important;
  will-change:transform!important;
}

.service-marquee-track > *,
.services-marquee-track > *,
.marquee-track > *{
  flex:0 0 auto!important;
}

.service-marquee-track .marquee-group,
.services-marquee-track .marquee-group,
.marquee-track .marquee-group{
  display:flex!important;
  flex:0 0 auto!important;
  width:max-content!important;
  gap:0!important;
  padding:0!important;
  margin:0!important;
}

@keyframes v24Marquee{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}

@media(max-width:700px){
  .service-marquee,
  .services-marquee,
  .marquee-band{
    margin-bottom:54px!important;
  }
  .service-marquee-track,
  .services-marquee-track,
  .marquee-track{
    animation-duration:22s!important;
  }
}



.article-share{
  width:min(1180px,calc(100% - 48px));
  margin:52px auto 72px;
  padding:20px 0;
  border-top:1px solid rgba(255,255,255,.10);
  border-bottom:1px solid rgba(255,255,255,.07);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.article-share-label{
  flex:0 0 auto;
  font:9px "DM Mono",monospace;
  letter-spacing:.12em;
  color:#7b7680;
}
.article-share-links{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
}
.article-share-links button{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.025);
  color:#aaa6ad;
  border-radius:999px;
  padding:9px 12px;
  font-size:10px;
  cursor:pointer;
  transition:border-color .2s,color .2s,background .2s,transform .2s;
}
.article-share-links button:hover{
  color:#eef2e4;
  border-color:rgba(217,255,82,.34);
  background:rgba(217,255,82,.055);
  transform:translateY(-1px);
}
@media(max-width:700px){
  .article-share{
    width:calc(100% - 28px);
    margin:38px auto 54px;
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }
  .article-share-links{
    justify-content:flex-start;
  }
  .article-share-links button{
    padding:8px 10px;
    font-size:9px;
  }
}



.article-share{
  width:min(900px,calc(100% - 48px))!important;
  margin:34px auto 70px!important;
  padding:18px 0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:22px!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  float:none!important;
  clear:both!important;
}
.article-share-links{
  justify-content:flex-start!important;
}
@media(max-width:700px){
  .article-share{
    width:calc(100% - 28px)!important;
    margin:28px auto 50px!important;
    gap:12px!important;
  }
}



.article-layout{
  align-items:start!important;
}
.article-body{
  width:100%!important;
  max-width:920px!important;
  min-width:0!important;
  justify-self:start!important;
  font-size:clamp(16px,1.12vw,19px)!important;
  line-height:1.78!important;
  overflow-wrap:anywhere;
}
.article-body > *{
  width:100%!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  float:none!important;
}
.article-body p,
.article-body li{
  font-size:inherit!important;
  line-height:1.78!important;
}
.article-body p{margin:0 0 1.35em!important}
.article-body ul,
.article-body ol{
  padding-left:1.35em!important;
  margin:0 0 1.5em!important;
}
.article-body h2{
  font-size:clamp(28px,3vw,48px)!important;
  line-height:1.08!important;
  margin:2.1em 0 .65em!important;
}
.article-body h3{
  font-size:clamp(22px,2vw,32px)!important;
  line-height:1.18!important;
  margin:1.8em 0 .6em!important;
}
.article-body h4{
  font-size:clamp(18px,1.45vw,24px)!important;
  line-height:1.25!important;
  margin:1.6em 0 .55em!important;
}
.article-body img{
  width:auto!important;
  max-width:100%!important;
  height:auto!important;
}
.article-body .aligncenter{margin-left:auto!important;margin-right:auto!important}
.article-body .alignleft,
.article-body .alignright{float:none!important;margin-left:0!important;margin-right:0!important}

/* Share is the last part of the article, never a third grid column/item */
.article-body > .article-share{
  width:100%!important;
  max-width:100%!important;
  margin:52px 0 8px!important;
  padding:22px 0!important;
  border-top:1px solid rgba(255,255,255,.12);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.article-share .share-actions{
  width:100%!important;
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-start!important;
  gap:10px 18px!important;
}
.article-share .share-actions a,
.article-share .share-actions button{
  white-space:nowrap!important;
}

@media(max-width:900px){
  .article-body{max-width:100%!important}
  .article-body > .article-share{margin-top:38px!important}
}
@media(max-width:640px){
  .article-body{
    font-size:16px!important;
    line-height:1.72!important;
  }
  .article-body h2{font-size:30px!important}
  .article-body h3{font-size:24px!important}
  .article-share .share-actions{gap:9px 14px!important}
}



.article-layout{
  display:grid!important;
  grid-template-columns:minmax(170px,220px) minmax(0,860px)!important;
  justify-content:center!important;
  align-items:start!important;
  column-gap:clamp(36px,5vw,72px)!important;
  width:100%!important;
  max-width:1280px!important;
  margin:0 auto!important;
  padding:58px clamp(24px,4vw,56px) 110px!important;
  box-sizing:border-box!important;
}

.article-toc{
  width:100%!important;
  max-width:220px!important;
  min-width:0!important;
  position:sticky!important;
  top:110px!important;
  align-self:start!important;
}

.article-body{
  grid-column:2!important;
  width:100%!important;
  max-width:860px!important;
  min-width:0!important;
  justify-self:stretch!important;
  overflow:visible!important;
  font-size:18px!important;
  line-height:1.8!important;
}

/* Imported content: no shrink-to-fit wrappers. */
.article-body div,
.article-body .imported-block{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  float:none!important;
  clear:both!important;
}
.article-body span{
  max-width:100%!important;
}
.article-body p,
.article-body li,
.article-body div{
  overflow-wrap:break-word!important;
  word-break:normal!important;
}
.article-body > div,
.article-body > p,
.article-body > ul,
.article-body > ol,
.article-body > blockquote,
.article-body > figure{
  margin-left:0!important;
  margin-right:0!important;
}

/* Imported social-post HTML often stores each paragraph in nested div/span wrappers.
   Give those wrappers normal reading rhythm. */
.article-body > .imported-block{
  margin:0 0 1.15em!important;
}
.article-body > .imported-block:has(> ul),
.article-body > .imported-block:has(> ol){
  margin-bottom:.75em!important;
}
.article-body .imported-block > .imported-block{
  margin:0!important;
}
.article-body strong{
  font-weight:700!important;
}
.article-body ul,
.article-body ol{
  width:100%!important;
  max-width:100%!important;
  padding-left:1.35em!important;
}
.article-body li{
  width:auto!important;
  max-width:100%!important;
  margin:.35em 0!important;
}

/* Featured/content media aligns with the reading column. */
.article-body img,
.article-body figure,
.article-body video,
.article-body iframe{
  max-width:100%!important;
}
.article-wide-image{
  width:min(1180px,calc(100% - 48px))!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Share belongs to the end of the reading column. */
.article-body > .article-share{
  width:100%!important;
  max-width:860px!important;
  margin:50px 0 0!important;
}

/* Tablet: TOC moves above content; body gets full available width. */
@media(max-width:980px){
  .article-layout{
    grid-template-columns:1fr!important;
    max-width:900px!important;
    padding:42px 22px 80px!important;
    row-gap:34px!important;
  }
  .article-toc{
    grid-column:1!important;
    position:relative!important;
    top:auto!important;
    max-width:none!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px 18px!important;
  }
  .article-toc>span{
    grid-column:1/-1!important;
  }
  .article-body{
    grid-column:1!important;
    max-width:100%!important;
    font-size:17px!important;
  }
}

/* Mobile: clean single reading column. */
@media(max-width:640px){
  .article-layout{
    padding:34px 16px 68px!important;
  }
  .article-toc{
    grid-template-columns:1fr!important;
  }
  .article-body{
    font-size:16px!important;
    line-height:1.75!important;
  }
}



.article-body > .article-share-v28{
  width:100%!important;
  max-width:860px!important;
  margin:54px 0 0!important;
  padding:22px 0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:14px!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  position:static!important;
  float:none!important;
}
.article-share-v28 .article-share-label{
  display:block!important;
  color:#77727d!important;
  font:9px "DM Mono",monospace!important;
  letter-spacing:.12em!important;
  white-space:nowrap!important;
}
.article-share-v28 .article-share-links{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-start!important;
  gap:7px!important;
  width:100%!important;
}
.article-share-v28 .article-share-links button{
  appearance:none!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.025)!important;
  color:#aaa6ad!important;
  padding:9px 12px!important;
  font:10px/1.2 "DM Mono",monospace!important;
}
.article-share-v28 .article-share-links button:hover{
  border-color:rgba(217,255,82,.32)!important;
  color:#edf4d9!important;
  background:rgba(217,255,82,.05)!important;
}
@media(max-width:640px){
  .article-body > .article-share-v28{
    margin-top:40px!important;
    padding:18px 0!important;
  }
  .article-share-v28 .article-share-links button{
    padding:8px 10px!important;
    font-size:9px!important;
  }
}



.article-share-v28::before,
.article-share-v28::after,
.article-share-v28 .article-share-label::before,
.article-share-v28 .article-share-label::after{
  content:none!important;
  display:none!important;
}
.article-share-v28 > .article-share-label{
  display:block!important;
}

/* Featured image breathing room after the article hero/meta area */
.article-featured,
.article-featured-image,
.article-hero-image,
.article-body > figure:first-of-type,
.article-body > .featured-image:first-child{
  margin-top:36px!important;
}
@media(max-width:640px){
  .article-featured,
  .article-featured-image,
  .article-hero-image,
  .article-body > figure:first-of-type,
  .article-body > .featured-image:first-child{
    margin-top:28px!important;
  }
}






.anek-bn{
  font-family:"Anek Bangla",sans-serif!important;
  font-optical-sizing:auto!important;
  font-style:normal!important;
  font-synthesis:none!important;
}

/* Slightly smaller blog archive titles */
.archive-card h2,
.archive-card h3,
.blog-card h2,
.blog-card h3,
.post-card h2,
.post-card h3{
  font-size:clamp(28px,2.15vw,42px)!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
}

/* Slightly smaller single-blog hero title, while keeping the editorial impact */
.article-hero h1,
.article-title{
  font-size:clamp(58px,7.2vw,118px)!important;
  line-height:.88!important;
}

@media(max-width:900px){
  .archive-card h2,
  .archive-card h3,
  .blog-card h2,
  .blog-card h3,
  .post-card h2,
  .post-card h3{
    font-size:clamp(26px,6vw,36px)!important;
  }

  .article-hero h1,
  .article-title{
    font-size:clamp(48px,12vw,76px)!important;
  }
}



html,body{
  font-family:var(--cms-font-en,inherit);
}
body{
  font-size:var(--cms-base-size,16px);
  line-height:var(--cms-body-lh,1.7);
}
.main-nav a,
.site-nav a,
header nav a{
  font-size:var(--cms-nav-size,13px)!important;
}
.archive-card h2,
.archive-card h3,
.blog-card h2,
.blog-card h3,
.post-card h2,
.post-card h3{
  font-size:clamp(24px,var(--cms-card-title,34px),52px)!important;
}
.article-hero h1,
.article-title{
  font-size:calc(clamp(58px,7.2vw,118px) * var(--cms-article-scale,1))!important;
}
.section-title,
.statement-wrap h2,
.services-headline,
.project-headline,
.feedback-headline{
  font-size:calc(1em * var(--cms-section-scale,1));
}
.anek-bn,
[lang="bn"] .anek-bn{
  font-family:var(--cms-font-bn,"Anek Bangla"),sans-serif!important;
}



.planet-interactive-v32{
  cursor:pointer!important;
  transition:filter .22s ease,transform .22s ease,box-shadow .22s ease!important;
  z-index:4!important;
}
.planet-interactive-v32:hover{
  filter:brightness(1.25) saturate(1.15)!important;
  box-shadow:0 0 22px rgba(217,255,82,.32)!important;
}
.planet-tooltip-v32{
  position:absolute;
  left:50%;
  top:-28px;
  transform:translateX(-50%) translateY(4px) rotate(var(--planet-counter-rotate,0deg));
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(7,9,12,.92);
  color:#f1f4e6;
  font:8px "DM Mono",monospace;
  letter-spacing:.06em;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease,transform .18s ease;
  box-shadow:0 8px 24px rgba(0,0,0,.24);
}
.planet-interactive-v32:hover .planet-tooltip-v32{
  opacity:1;
  transform:translateX(-50%) translateY(0) rotate(var(--planet-counter-rotate,0deg));
}
@media(hover:none),(pointer:coarse){
  .planet-tooltip-v32{display:none!important}
}



.article-starfield-v32{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  opacity:.68;
}
.article-starfield-v32 i{
  position:absolute;
  left:var(--x);
  top:var(--y);
  width:var(--sz);
  height:var(--sz);
  border-radius:50%;
  background:rgba(255,255,255,var(--o));
  box-shadow:0 0 8px rgba(255,255,255,.16);
  animation:v32StarPulse var(--d) ease-in-out infinite alternate;
}
.article-page main,
.article-page header,
.article-page footer,
.article-page .article-hero,
.article-page .article-layout{
  position:relative;
  z-index:1;
}
@keyframes v32StarPulse{
  from{opacity:.25;transform:scale(.85)}
  to{opacity:.8;transform:scale(1.15)}
}
@media(max-width:700px){
  .article-starfield-v32{opacity:.42}
  .article-starfield-v32 i:nth-child(2n){display:none}
}



.blog-pagination-v33{
  width:min(1720px,calc(100% - 56px));
  margin:46px auto 92px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.blog-page-numbers{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
}
.blog-page-numbers span{
  color:#66616d;
  font:10px "DM Mono",monospace;
  padding:0 3px;
}
.blog-page-btn{
  min-width:40px;
  height:40px;
  padding:0 13px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  color:#aaa6b0;
  font:10px "DM Mono",monospace;
  cursor:pointer;
  transition:
    transform .2s ease,
    color .2s ease,
    border-color .2s ease,
    background .2s ease;
}
.blog-page-btn:hover:not(:disabled){
  transform:translateY(-2px);
  color:#f1f4e6;
  border-color:rgba(217,255,82,.32);
  background:rgba(217,255,82,.055);
}
.blog-page-btn.active{
  color:#0a0d0e;
  border-color:#d9ff52;
  background:#d9ff52;
}
.blog-page-btn:disabled{
  opacity:.28;
  cursor:default;
}
@media(max-width:720px){
  .blog-pagination-v33{
    width:calc(100% - 28px);
    margin:34px auto 62px;
    gap:12px;
    flex-wrap:wrap;
  }
  .blog-page-numbers{
    order:3;
    width:100%;
  }
  .blog-page-btn{
    min-width:36px;
    height:36px;
    padding:0 10px;
    font-size:9px;
  }
}


.master-solar-system .solar-orbit{pointer-events:none!important}
.master-solar-system .planet{pointer-events:auto!important}
.master-solar-system .planet:after{display:none!important}
.master-solar-system .planet-near-v34 i{transform:scale(1.7)!important;filter:brightness(1.4) saturate(1.3)!important;box-shadow:0 0 22px rgba(217,255,82,.4)!important}
.planet-tip-v34{position:fixed;z-index:999999;transform:translate(-50%,-100%) translateY(-7px);padding:6px 9px;border:1px solid rgba(217,255,82,.28);border-radius:999px;background:rgba(7,9,12,.94);color:#fff;font:9px/1 'DM Mono',monospace;letter-spacing:.07em;opacity:0;pointer-events:none;transition:opacity .14s ease}
.planet-tip-v34.show{opacity:1}
@media(hover:none),(pointer:coarse){.planet-tip-v34{display:none!important}}






/* Important: do not alter the existing page/layout background */
.article-layout.space-overlay-v38{
  position:relative!important;
  isolation:isolate;
  overflow:hidden;
}

/* Star dust */
.space-stars-v38{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  opacity:.72;
}
.space-stars-v38 i{
  position:absolute;
  left:var(--sx);
  top:var(--sy);
  width:var(--ss);
  height:var(--ss);
  border-radius:50%;
  background:rgba(235,240,255,var(--so));
  box-shadow:0 0 5px rgba(255,255,255,.08);
  animation:v38StarPulse var(--sd) ease-in-out infinite alternate;
}
.space-stars-v38 i.bright{
  box-shadow:
    0 0 7px rgba(255,255,255,.24),
    0 0 16px rgba(140,170,255,.10);
}

/* Faint galaxy haze, transparent-only overlay */
.space-stars-v38::before{
  content:"";
  position:absolute;
  width:78%;
  height:28%;
  left:8%;
  top:36%;
  transform:rotate(-14deg);
  border-radius:50%;
  filter:blur(48px);
  background:
    radial-gradient(ellipse at 28% 50%,rgba(114,92,155,.055),transparent 35%),
    radial-gradient(ellipse at 53% 47%,rgba(92,112,151,.040),transparent 38%),
    radial-gradient(ellipse at 74% 54%,rgba(137,92,125,.035),transparent 34%);
  opacity:.78;
}

/* Cursor light */
.space-light-v38{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  opacity:0;
  transition:opacity .28s ease;
  background:
    radial-gradient(
      circle 220px at var(--mx,50%) var(--my,40%),
      rgba(210,225,255,.09) 0%,
      rgba(124,153,216,.055) 24%,
      rgba(109,79,150,.028) 46%,
      transparent 72%
    );
}
.article-layout.space-hover-v38 .space-light-v38{
  opacity:1;
}

/* Keep real content above overlays */
.article-layout.space-overlay-v38 > *:not(.space-stars-v38):not(.space-light-v38){
  position:relative;
  z-index:2;
}

@keyframes v38StarPulse{
  from{opacity:.35;transform:scale(.9)}
  to{opacity:1;transform:scale(1.1)}
}

@media(max-width:700px){
  .space-stars-v38{
    opacity:.55;
  }
  .space-light-v38{
    display:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .space-stars-v38 i{
    animation:none!important;
  }
}



.article-featured,
.article-featured-image,
.article-hero-image,
.article-wide-image{
  margin-top:64px!important;
}
@media(max-width:700px){
  .article-featured,
  .article-featured-image,
  .article-hero-image,
  .article-wide-image{
    margin-top:52px!important;
  }
}




body{font-size:var(--cms-base-size,16px);line-height:var(--cms-body-lh,1.7)}
header nav a,.main-nav a,.site-nav a{font-size:var(--cms-nav-size,13px)!important}

/* Homepage */
body.home-page .hero h1,
body.home-page .hero-title,
body.home-page .display-title{
  font-size:calc(1em * var(--home-hero-scale,1))!important;
}
body.home-page .section-title,
body.home-page .statement-wrap h2{
  font-size:calc(1em * var(--home-section-scale,1))!important;
}
body.home-page p{font-size:var(--home-body-size,16px)}

/* Blog archive */
body.blog-page .archive-card h2,
body.blog-page .archive-card h3,
body.blog-page .blog-card h2,
body.blog-page .blog-card h3{
  font-size:var(--blog-card-title-size,34px)!important;
}
body.blog-page .archive-card p,
body.blog-page .blog-card p{
  font-size:var(--blog-excerpt-size,16px)!important;
}

/* Single blog */
.article-hero h1,.article-title{
  font-size:calc(clamp(56px,7vw,112px) * var(--single-blog-title-scale,.94))!important;
}
.article-body{
  font-size:var(--single-blog-body-size,18px)!important;
}
.article-body h2{
  font-size:calc(clamp(28px,3vw,48px) * var(--single-blog-h2-scale,1))!important;
}
.article-body h3{
  font-size:calc(clamp(22px,2vw,32px) * var(--single-blog-h3-scale,1))!important;
}

/* Services */
body.service-page .service-hero h1,
body.service-page .service-title{
  font-size:calc(1em * var(--service-hero-scale,1))!important;
}
body.service-page .service-copy,
body.service-page .service-copy p{
  font-size:var(--service-body-size,17px)!important;
}
body.service-page .service-card h3{
  font-size:var(--service-card-title-size,34px)!important;
}



/* Kill the previous artificial galaxy/cloud background layers */
.article-layout.space-reading-v40::before,
.article-layout.space-reading-v40::after{
  background:none!important;
  box-shadow:none!important;
  filter:none!important;
  opacity:0!important;
}
.article-layout.space-reading-v40 .galaxy-field-v39,
.article-layout.space-reading-v40 .article-galaxy-v37,
.article-layout.space-reading-v40 .article-space-v38{
  display:none!important;
}

.space-field-v40{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  background:transparent!important;
  opacity:1;
}
.space-stars-v40{
  position:absolute;
  inset:0;
  background:transparent!important;
}
.space-stars-v40 i{
  position:absolute;
  left:var(--sx);
  top:var(--sy);
  width:var(--ss);
  height:var(--ss);
  border-radius:50%;
  background:rgba(245,247,255,var(--sa));
  box-shadow:0 0 3px rgba(255,255,255,.14);
  opacity:.72;
  animation:v40StarPulse var(--sd) ease-in-out infinite alternate;
  will-change:opacity,transform;
}
.space-stars-v40 i.is-medium{
  box-shadow:0 0 5px rgba(255,255,255,.20);
}
.space-stars-v40 i.is-bright{
  box-shadow:
    0 0 5px rgba(255,255,255,.45),
    0 0 12px rgba(188,202,255,.18);
}

/* This is transparent at rest; cursor makes only a local light bloom */
.space-cursor-light-v40{
  position:absolute;
  inset:0;
  opacity:.12;
  transition:opacity .42s ease;
  background:
    radial-gradient(circle 300px at var(--space-x,50%) var(--space-y,35%),
      rgba(226,236,255,.10) 0%,
      rgba(180,197,235,.065) 26%,
      rgba(130,145,190,.025) 49%,
      transparent 72%);
}
.article-layout.space-pointer-active-v40 .space-cursor-light-v40{
  opacity:1;
}
.article-layout.space-pointer-active-v40 .space-stars-v40 i{
  opacity:.88;
}

/* All real article UI stays above the transparent decorative layer */
.article-layout.space-reading-v40 > *:not(.space-field-v40){
  position:relative;
  z-index:2;
}

@keyframes v40StarPulse{
  0%{opacity:.48;transform:scale(.92)}
  100%{opacity:.86;transform:scale(1.06)}
}
@media(max-width:700px){
  .space-stars-v40 i{opacity:.62}
  .space-cursor-light-v40{
    background:
      radial-gradient(circle 210px at var(--space-x,50%) var(--space-y,35%),
        rgba(226,236,255,.09),rgba(150,170,215,.04) 35%,transparent 72%);
  }
}
@media(prefers-reduced-motion:reduce){
  .space-stars-v40 i{animation:none!important}
}



.article-layout,
.article-layout:hover,
.article-layout:focus-within,
.article-layout[class*="galaxy"],
.article-layout[class*="space"]{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}

/* kill all previous synthetic panels / overlays */
.article-layout::before,
.article-layout::after,
.article-layout:hover::before,
.article-layout:hover::after{
  content:none!important;
  display:none!important;
  background:none!important;
  opacity:0!important;
  box-shadow:none!important;
  filter:none!important;
}

.article-layout .galaxy-field-v39,
.article-layout .galaxy-stars-v39,
.article-layout .galaxy-pointer-v39,
.article-layout .space-field-v40,
.article-layout .space-stars-v40,
.article-layout .space-cursor-light-v40,
.article-layout .space-stars-v38,
.article-layout .space-light-v38,
.article-layout .article-galaxy-cursor-v36,
.article-layout .article-galaxy-dust-v36,
.article-layout .article-starfield-v32{
  display:none!important;
}

/* Real content always stays normal */
.article-layout > *{
  position:relative;
}



/* Star field itself is 100% transparent except for the star dots */
.space-stars-v42{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  background:transparent!important;
  opacity:1;
}

/* No ::before / ::after haze */
.space-stars-v42::before,
.space-stars-v42::after{
  content:none!important;
  display:none!important;
}

.space-stars-v42 i{
  position:absolute;
  left:var(--x);
  top:var(--y);
  width:var(--size);
  height:var(--size);
  border-radius:50%;
  background:rgba(244,247,255,var(--alpha));
  box-shadow:0 0 3px rgba(255,255,255,.12);
  opacity:.66;
  animation:v42Twinkle var(--dur) ease-in-out infinite alternate;
  transition:opacity .28s ease,filter .28s ease,box-shadow .28s ease;
}
.space-stars-v42 i.medium{
  box-shadow:0 0 5px rgba(255,255,255,.18);
}
.space-stars-v42 i.bright{
  box-shadow:
    0 0 6px rgba(255,255,255,.34),
    0 0 13px rgba(176,194,255,.10);
}

/*
 Cursor behavior:
 there is NO radial-gradient background.
 The pointer only increases star intensity globally a little,
 while the existing premium cursor remains responsible for local cursor feel.
*/
.article-layout.star-pointer-v42 .space-stars-v42 i{
  opacity:.84;
  filter:brightness(1.22);
}
.article-layout.star-pointer-v42 .space-stars-v42 i.bright{
  box-shadow:
    0 0 8px rgba(255,255,255,.52),
    0 0 17px rgba(176,194,255,.16);
}

/* All article UI above stars */
.article-layout.star-reading-v42 > *:not(.space-stars-v42){
  position:relative;
  z-index:2;
}

/* Explicitly neutralize hover/focus backgrounds forever */
.article-layout.star-reading-v42:hover,
.article-layout.star-reading-v42:focus,
.article-layout.star-reading-v42:focus-within{
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}

@keyframes v42Twinkle{
  from{opacity:.48;transform:scale(.92)}
  to{opacity:.82;transform:scale(1.05)}
}

@media(max-width:700px){
  .space-stars-v42 i{
    opacity:.58;
  }
  .article-layout.star-pointer-v42 .space-stars-v42 i{
    opacity:.70;
    filter:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .space-stars-v42 i{animation:none!important}
}




/* Common host remains transparent; original page background shows through. */
.article-space-host-v44,
.article-space-host-v44:hover,
.article-space-host-v44:focus-within{
  position:relative!important;
  isolation:isolate;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

/* No decorative cloud/gradient pseudo-elements. */
.article-space-host-v44::before,
.article-space-host-v44::after{
  content:none!important;
  display:none!important;
}

/* One continuous star field around feature image + article body. */
.interactive-stars-v44{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  background:transparent!important;
}
.interactive-stars-v44::before,
.interactive-stars-v44::after{
  content:none!important;
  display:none!important;
}

.interactive-stars-v44 i{
  position:absolute;
  border-radius:50%;
  background:#f4f7ff;
  transform-origin:center;
  transition:
    opacity .18s ease,
    transform .18s ease,
    filter .18s ease,
    box-shadow .18s ease;
  animation:v44Twinkle var(--twinkle) ease-in-out infinite alternate;
  will-change:opacity,transform,filter;
  box-shadow:0 0 3px rgba(255,255,255,.10);
}
.interactive-stars-v44 i.medium{
  box-shadow:0 0 5px rgba(255,255,255,.16);
}
.interactive-stars-v44 i.bright{
  box-shadow:
    0 0 6px rgba(255,255,255,.38),
    0 0 15px rgba(178,198,255,.12);
}
.interactive-stars-v44 i[style*="--boost"]{
  box-shadow:
    0 0 calc(5px + 10px * var(--boost)) rgba(255,255,255,.38),
    0 0 calc(12px + 24px * var(--boost)) rgba(154,181,255,.12);
}

/* Everything real stays above stars. */
.article-space-host-v44 > *:not(.interactive-stars-v44){
  position:relative;
  z-index:2;
}

/* Featured image wrappers must NOT create a dark panel. */
.article-space-host-v44 .article-featured,
.article-space-host-v44 .article-featured-image,
.article-space-host-v44 .article-hero-image,
.article-space-host-v44 .article-wide-image,
.article-space-host-v44 figure.article-featured,
.article-space-host-v44 .article-featured figure{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}

/* Keep image itself visually intact. Only its surrounding container is transparent. */
.article-space-host-v44 .article-featured img,
.article-space-host-v44 .article-featured-image img,
.article-space-host-v44 .article-hero-image img,
.article-space-host-v44 .article-wide-image img{
  position:relative;
  z-index:2;
}

/* Reading layout stays transparent in every interaction state. */
.article-space-host-v44 .article-layout,
.article-space-host-v44 .article-layout:hover,
.article-space-host-v44 .article-layout:focus-within{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}


.article-space-host-v44 .article-featured,
.article-space-host-v44 .article-featured-image,
.article-space-host-v44 .article-hero-image,
.article-space-host-v44 .article-wide-image{
  margin-top:64px!important;
  padding-top:0!important;
}

@keyframes v44Twinkle{
  from{filter:brightness(.88)}
  to{filter:brightness(1.08)}
}

@media(max-width:700px){
  .article-space-host-v44 .article-featured,
  .article-space-host-v44 .article-featured-image,
  .article-space-host-v44 .article-hero-image,
  .article-space-host-v44 .article-wide-image{
    margin-top:52px!important;
  }
  .interactive-stars-v44 i{
    transition-duration:.12s;
  }
}

@media(prefers-reduced-motion:reduce){
  .interactive-stars-v44 i{
    animation:none!important;
    transition:none!important;
  }
}


.hero{isolation:isolate;overflow:hidden}
.hero .hero-portrait-v47{position:absolute;right:3.5vw;bottom:0;width:min(39vw,700px);height:88%;z-index:2;pointer-events:none;display:flex;align-items:flex-end;justify-content:center}
.hero .hero-portrait-v47::before{content:"";position:absolute;inset:12% 0 0;background:radial-gradient(circle at 55% 42%,rgba(106,76,155,.14),transparent 53%);filter:blur(24px)}
.hero .hero-portrait-v47 img{position:relative;width:100%;height:100%;object-fit:contain;object-position:center bottom;mix-blend-mode:lighten;filter:contrast(1.04) saturate(.9);mask-image:linear-gradient(to bottom,#000 0 82%,transparent 100%)}
.hero .hero-title,.hero .hero-top,.hero .hero-bottom{position:relative;z-index:4}
.hero .solar-system{z-index:3;opacity:.74;transform-origin:center right}
@media(max-width:900px){.hero .hero-portrait-v47{right:-12vw;width:68vw;height:68%;opacity:.54}.hero .solar-system{opacity:.5}.hero .hero-title{max-width:78vw}}
@media(max-width:620px){.hero .hero-portrait-v47{right:-24vw;width:92vw;height:58%;opacity:.38}.hero .hero-title{max-width:92vw}}

.site-stars-v47{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;opacity:.72}
.site-stars-v47 i{position:absolute;display:block;border-radius:50%;background:#fff;width:var(--s);height:var(--s);opacity:var(--a);box-shadow:0 0 var(--glow,5px) rgba(220,229,255,.28);transition:opacity .22s ease,transform .22s ease,box-shadow .22s ease}
.site-stars-v47 i.warm{background:#d9ff48;box-shadow:0 0 8px rgba(205,255,61,.3)}
.site-star-host-v47{position:relative;isolation:isolate}
.site-star-host-v47>*:not(.site-stars-v47){position:relative;z-index:1}
.site-star-host-v47.star-pointer-v47 .site-stars-v47{opacity:.92}
@media(prefers-reduced-motion:reduce){.site-stars-v47 i{transition:none}}


.hero{isolation:isolate;overflow:hidden!important}
.hero .hero-portrait-v47{
  right:4vw!important;
  bottom:-2vh!important;
  width:min(52vw,900px)!important;
  height:96%!important;
  z-index:2!important;
  opacity:.94!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:center!important;
  pointer-events:none!important;
}
.hero .hero-portrait-v47::before{
  content:""!important;
  position:absolute!important;
  inset:4% -6% -4%!important;
  background:
    radial-gradient(circle at 50% 39%,rgba(255,255,255,.07),transparent 29%),
    radial-gradient(circle at 52% 51%,rgba(108,73,150,.16),transparent 47%)!important;
  filter:blur(30px)!important;
  opacity:.95!important;
}
.hero .hero-portrait-v47::after{
  content:"ASHIKUL / PRODUCT DESIGN"!important;
  position:absolute!important;
  right:-4px!important;
  bottom:13vh!important;
  writing-mode:vertical-rl!important;
  transform:rotate(180deg)!important;
  font:8px "DM Mono",monospace!important;
  letter-spacing:.18em!important;
  color:rgba(255,255,255,.32)!important;
}
.hero .hero-portrait-v47 img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  mix-blend-mode:lighten!important;
  filter:grayscale(.35) saturate(.64) brightness(.72) contrast(1.16)!important;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 76%,rgba(0,0,0,.92) 86%,transparent 100%)!important;
  mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 76%,rgba(0,0,0,.92) 86%,transparent 100%)!important;
}
.hero .hero-title{
  position:relative!important;
  z-index:4!important;
  width:min(84vw,1500px)!important;
  margin:auto 0!important;
  font-size:clamp(88px,15.2vw,270px)!important;
  line-height:.69!important;
  letter-spacing:-.088em!important;
}
.hero .hero-title .hero-line:first-child{transform:translateX(-.01em)}
.hero .hero-title .hero-line.shifted{padding-left:10.5vw!important}
.hero .hero-title .outline{
  -webkit-text-stroke:1px rgba(242,240,234,.92)!important;
  text-shadow:0 0 34px rgba(0,0,0,.45)!important;
}
.hero .hero-title .hero-line.shifted span{
  text-shadow:0 9px 42px rgba(0,0,0,.56)!important;
}
.hero .hero-top,.hero .hero-bottom{z-index:6!important}
.hero .hero-copy{
  max-width:520px!important;
  padding:14px 16px 14px 0!important;
  text-shadow:0 2px 20px rgba(0,0,0,.8)!important;
}
.hero .solar-system{
  z-index:1!important;
  right:-31vw!important;
  opacity:.72!important;
  filter:saturate(.88) contrast(1.05)!important;
}
/* a faint editorial guide line behind the portrait */
.hero::after{
  content:""!important;
  position:absolute!important;
  z-index:1!important;
  top:13vh!important;
  bottom:11vh!important;
  right:35vw!important;
  width:1px!important;
  background:linear-gradient(to bottom,transparent,rgba(255,255,255,.10) 20%,rgba(255,255,255,.10) 78%,transparent)!important;
  pointer-events:none!important;
}

/* Restore the large Design Philosophy statement. The earlier typography rule
   collapsed this to ~1em. Keep it responsive while still respecting the UI. */
body.home-page .statement-wrap h2,
.statement .statement-wrap h2{
  font-size:clamp(64px,10.6vw,176px)!important;
  line-height:.78!important;
  letter-spacing:-.07em!important;
  margin:25px 0!important;
}
body.home-page .statement-wrap h2 span,
.statement .statement-wrap h2 span{
  display:inline-block!important;
  font-size:1em!important;
}
body.home-page .statement-sub,
.statement .statement-sub{
  font-size:clamp(18px,2vw,26px)!important;
  max-width:650px!important;
}

@media(max-width:1000px){
  .hero .hero-portrait-v47{right:-9vw!important;width:70vw!important;height:78%!important;opacity:.74!important}
  .hero .hero-title{width:94vw!important;font-size:19vw!important}
  .hero .hero-title .hero-line.shifted{padding-left:7vw!important}
  .hero::after{right:34vw!important}
}
@media(max-width:700px){
  .hero .hero-portrait-v47{right:-25vw!important;bottom:2vh!important;width:102vw!important;height:66%!important;opacity:.50!important}
  .hero .hero-portrait-v47 img{filter:grayscale(.5) saturate(.5) brightness(.62) contrast(1.18)!important}
  .hero .hero-portrait-v47::after{display:none!important}
  .hero .hero-title{font-size:21vw!important;line-height:.72!important;width:100%!important;margin:12vh 0 8vh!important}
  .hero .hero-title .hero-line.shifted{padding-left:0!important}
  .hero .solar-system{opacity:.46!important}
  .hero::after{display:none!important}
  body.home-page .statement-wrap h2,.statement .statement-wrap h2{font-size:15vw!important;line-height:.84!important}
}


.hero .hero-portrait-v47{right:1.5vw!important;bottom:-6vh!important;width:min(56vw,980px)!important;height:104%!important;opacity:.96!important;z-index:2!important}
.hero .hero-portrait-v47 img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;mix-blend-mode:lighten!important;filter:grayscale(.45) saturate(.48) brightness(.66) contrast(1.22)!important;mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 79%,transparent 99%)!important}
.hero .hero-portrait-v47::before{inset:2% -8% 0!important;background:radial-gradient(circle at 52% 39%,rgba(255,255,255,.08),transparent 22%),radial-gradient(circle at 49% 49%,rgba(91,60,138,.20),transparent 48%)!important;filter:blur(30px)!important}
.hero .hero-portrait-v47::after{display:none!important}
.hero .portrait-index{position:absolute;right:7%;top:19%;z-index:3;color:rgba(255,255,255,.34);font:8px "DM Mono",monospace;letter-spacing:.14em;writing-mode:vertical-rl}
.hero .hero-title{z-index:5!important;width:min(88vw,1580px)!important}
.hero .hero-title .hero-line:first-child{position:relative;z-index:1}
.hero .hero-title .hero-line.shifted{position:relative;z-index:6;padding-left:8.5vw!important}
.hero .hero-title .outline{-webkit-text-stroke:1px rgba(242,240,234,.88)!important;color:transparent!important}
.hero .hero-title .hero-line.shifted span{color:#f2f0ea!important;text-shadow:0 10px 46px rgba(0,0,0,.66)!important}
.hero .solar-system{z-index:1!important;right:-35vw!important;opacity:.57!important}
.hero .hero-copy{position:relative;z-index:7!important;max-width:500px!important}
@media(max-width:1000px){.hero .hero-portrait-v47{right:-13vw!important;width:76vw!important;height:82%!important;opacity:.72!important}.hero .hero-title .hero-line.shifted{padding-left:5vw!important}}
@media(max-width:700px){.hero .hero-portrait-v47{right:-27vw!important;bottom:0!important;width:106vw!important;height:66%!important;opacity:.48!important}.hero .portrait-index{display:none!important}.hero .hero-title .hero-line.shifted{padding-left:0!important}}

/* Design Philosophy headline — restore original statement presence */
body.home-page .statement-wrap h2,.statement .statement-wrap h2{font-size:clamp(78px,11.7vw,198px)!important;line-height:.76!important;letter-spacing:-.074em!important;margin:28px 0 34px!important}
@media(max-width:700px){body.home-page .statement-wrap h2,.statement .statement-wrap h2{font-size:17vw!important;line-height:.82!important}}

/* Testimonial: more breathing room before pagination/progress */
.feedback-stage{margin-bottom:30px!important}
.feedback-carousel-ui-v11,.feedback-scroll-ui{margin-top:26px!important;padding-top:4px!important}
.feedback-nav-center{bottom:20px!important}
@media(max-width:700px){.feedback-stage{margin-bottom:22px!important}.feedback-carousel-ui-v11,.feedback-scroll-ui{margin-top:20px!important}}



.hero{min-height:100svh!important;position:relative!important;overflow:hidden!important}
.hero .hero-portrait-v47{
  position:absolute!important;left:50%!important;right:auto!important;bottom:-9vh!important;
  transform:translateX(-50%)!important;width:min(58vw,980px)!important;height:92%!important;
  z-index:3!important;opacity:.88!important;background:none!important;overflow:visible!important;
}
.hero .hero-portrait-v47::before,.hero .hero-portrait-v47::after{display:none!important}
.hero .hero-portrait-v47 img{
  width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;
  mix-blend-mode:normal!important;filter:grayscale(.42) brightness(.58) contrast(1.2)!important;
  -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 78%,rgba(0,0,0,.88) 88%,transparent 100%)!important;
  mask-image:linear-gradient(to bottom,#000 0,#000 78%,rgba(0,0,0,.88) 88%,transparent 100%)!important;
}
.hero .portrait-index{display:none!important}
.hero .hero-title{
  position:absolute!important;left:50%!important;top:48%!important;transform:translate(-50%,-50%)!important;
  width:94vw!important;margin:0!important;z-index:4!important;text-align:center!important;
  font-size:clamp(94px,14.6vw,255px)!important;line-height:.70!important;letter-spacing:-.085em!important;
}
.hero .hero-title .hero-line{width:100%!important;text-align:center!important;transform:none!important}
.hero .hero-title .hero-line.shifted{padding-left:0!important}
.hero .hero-title .outline{color:transparent!important;-webkit-text-stroke:1px rgba(242,240,234,.48)!important;text-shadow:none!important}
.hero .hero-title .hero-line.shifted span{color:#f2f0ea!important;text-shadow:0 12px 55px rgba(0,0,0,.72)!important}
.hero .hero-top{position:absolute!important;top:6.5vh!important;left:4.8vw!important;right:4.8vw!important;z-index:7!important}
.hero .hero-bottom{position:absolute!important;left:4.8vw!important;right:4.8vw!important;bottom:5vh!important;z-index:7!important}
.hero .hero-copy{max-width:430px!important;background:none!important}
.hero .solar-system{z-index:1!important;right:-35vw!important;opacity:.46!important}
.hero::after{display:none!important}
@media(max-width:1000px){
 .hero .hero-portrait-v47{width:78vw!important;height:82%!important;bottom:-5vh!important;opacity:.72!important}
 .hero .hero-title{font-size:18vw!important;top:44%!important}
}
@media(max-width:700px){
 .hero{min-height:100svh!important}
 .hero .hero-portrait-v47{width:118vw!important;height:67%!important;bottom:4vh!important;opacity:.58!important}
 .hero .hero-title{top:35%!important;width:96vw!important;font-size:20vw!important;line-height:.76!important}
 .hero .hero-top{top:9vh!important;left:5vw!important;right:5vw!important}
 .hero .hero-bottom{left:5vw!important;right:5vw!important;bottom:4vh!important}
 .hero .hero-copy{max-width:70vw!important;font-size:14px!important}
}


.hero{min-height:100svh!important;position:relative!important;overflow:hidden!important;isolation:isolate!important}

/* Restore the original left editorial name composition. */
.hero .hero-title{
  position:relative!important;
  left:auto!important;top:auto!important;
  transform:none!important;
  width:min(88vw,1580px)!important;
  margin:auto 0!important;
  z-index:5!important;
  text-align:left!important;
  font-size:clamp(88px,15.2vw,270px)!important;
  line-height:.69!important;
  letter-spacing:-.088em!important;
  pointer-events:none!important;
}
.hero .hero-title .hero-line{width:auto!important;text-align:left!important;transform:none!important;position:relative!important}
.hero .hero-title .hero-line:first-child{z-index:4!important}
.hero .hero-title .hero-line.shifted{padding-left:8.5vw!important;z-index:6!important}
.hero .hero-title .outline{color:transparent!important;-webkit-text-stroke:1px rgba(242,240,234,.88)!important;text-shadow:0 0 30px rgba(0,0,0,.28)!important}
.hero .hero-title .hero-line.shifted span{color:#f2f0ea!important;text-shadow:0 12px 48px rgba(0,0,0,.72)!important}

/* Portrait lives beneath the name instead of cutting through it. */
.hero .hero-portrait-v47{
  position:absolute!important;
  left:28.5vw!important;right:auto!important;
  bottom:-10vh!important;
  transform:none!important;
  width:min(43vw,760px)!important;height:69%!important;
  z-index:3!important;opacity:.96!important;
  display:flex!important;align-items:flex-end!important;justify-content:center!important;
  background:none!important;overflow:visible!important;pointer-events:none!important;
}
.hero .hero-portrait-v47::before{
  content:""!important;display:block!important;position:absolute!important;
  inset:9% -16% -7%!important;
  background:radial-gradient(ellipse at 50% 48%,rgba(255,255,255,.075) 0,rgba(255,255,255,.025) 27%,rgba(54,64,72,.09) 45%,transparent 72%)!important;
  filter:blur(32px)!important;opacity:.8!important;pointer-events:none!important;
}
.hero .hero-portrait-v47::after{display:none!important}
.hero .hero-portrait-v47 img{
  position:relative!important;width:100%!important;height:100%!important;
  object-fit:contain!important;object-position:center bottom!important;
  mix-blend-mode:lighten!important;
  filter:grayscale(1) saturate(0) brightness(.63) contrast(1.28)!important;
  -webkit-mask-image:radial-gradient(ellipse 62% 73% at 50% 49%,#000 0 59%,rgba(0,0,0,.94) 67%,rgba(0,0,0,.56) 78%,transparent 96%)!important;
  mask-image:radial-gradient(ellipse 62% 73% at 50% 49%,#000 0 59%,rgba(0,0,0,.94) 67%,rgba(0,0,0,.56) 78%,transparent 96%)!important;
}
.hero .portrait-index{display:none!important}

/* Bring the complete solar system back into the composition. */
.hero .solar-system{
  z-index:2!important;
  width:min(62vw,1100px)!important;height:min(62vw,1100px)!important;
  right:-24vw!important;top:50%!important;
  transform:translateY(-50%)!important;
  opacity:.82!important;
  filter:saturate(.9) contrast(1.04)!important;
}

.hero .hero-top{position:relative!important;top:auto!important;left:auto!important;right:auto!important;z-index:7!important}
.hero .hero-bottom{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;z-index:7!important}
.hero .hero-copy{max-width:500px!important;background:none!important;text-shadow:0 2px 22px rgba(0,0,0,.86)!important}

@media(max-width:1000px){
  .hero .hero-title{width:94vw!important;font-size:19vw!important}
  .hero .hero-title .hero-line.shifted{padding-left:5vw!important}
  .hero .hero-portrait-v47{left:27vw!important;bottom:-5vh!important;width:59vw!important;height:61%!important;opacity:.78!important}
  .hero .solar-system{right:-34vw!important;opacity:.58!important}
}
@media(max-width:700px){
  .hero .hero-title{width:100%!important;font-size:21vw!important;line-height:.72!important;margin:12vh 0 8vh!important}
  .hero .hero-title .hero-line.shifted{padding-left:0!important}
  .hero .hero-portrait-v47{left:18vw!important;bottom:1vh!important;width:88vw!important;height:52%!important;opacity:.58!important}
  .hero .solar-system{right:-58vw!important;opacity:.42!important}
  .hero .hero-copy{max-width:70vw!important;font-size:14px!important}
}


.hero .hero-title{
  z-index:6!important;
}
.hero .hero-title .hero-line:first-child,
.hero .hero-title .hero-line.shifted{
  position:relative!important;
  z-index:6!important;
}

/* Portrait now starts beneath the name, with only a tiny optical overlap. */
.hero .hero-portrait-v47{
  left:29.5vw!important;
  right:auto!important;
  bottom:-1.5vh!important;
  width:min(35vw,650px)!important;
  height:50%!important;
  z-index:3!important;
  opacity:.96!important;
  overflow:visible!important;
  transform:translateZ(0)!important;
}

/* Soft editorial back-light behind the silhouette — no visible box. */
.hero .hero-portrait-v47::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:-28%!important;
  right:-28%!important;
  top:-18%!important;
  bottom:-10%!important;
  background:
    radial-gradient(ellipse 36% 42% at 50% 30%,rgba(255,255,255,.115),transparent 70%),
    radial-gradient(ellipse 52% 46% at 48% 58%,rgba(71,85,103,.12),transparent 72%),
    radial-gradient(ellipse 65% 35% at 50% 88%,rgba(0,0,0,.62),transparent 74%)!important;
  filter:blur(28px)!important;
  opacity:.9!important;
  pointer-events:none!important;
}
.hero .hero-portrait-v47::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:-4% -22% -10%!important;
  z-index:2!important;
  pointer-events:none!important;
  background:
    linear-gradient(90deg,rgba(4,7,9,.68) 0,transparent 19%,transparent 81%,rgba(4,7,9,.72) 100%),
    linear-gradient(180deg,transparent 0 67%,rgba(4,7,9,.52) 84%,rgba(4,7,9,.95) 100%)!important;
  filter:blur(10px)!important;
}

.hero .hero-portrait-v47 img{
  z-index:1!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  mix-blend-mode:normal!important;
  opacity:.96!important;
  filter:
    grayscale(1)
    saturate(0)
    brightness(.70)
    contrast(1.32)
    drop-shadow(0 0 24px rgba(255,255,255,.035))!important;
  -webkit-mask-image:radial-gradient(ellipse 70% 92% at 50% 35%,#000 0 58%,rgba(0,0,0,.96) 67%,rgba(0,0,0,.74) 77%,rgba(0,0,0,.30) 88%,transparent 98%)!important;
  mask-image:radial-gradient(ellipse 70% 92% at 50% 35%,#000 0 58%,rgba(0,0,0,.96) 67%,rgba(0,0,0,.74) 77%,rgba(0,0,0,.30) 88%,transparent 98%)!important;
}

/* Preserve the solar system as a major secondary visual. */
.hero .solar-system{
  z-index:2!important;
  right:-23vw!important;
  opacity:.84!important;
  filter:saturate(.92) contrast(1.05) brightness(.94)!important;
}

/* Slightly clear the copy/portrait relationship. */
.hero .hero-copy{
  position:relative!important;
  z-index:8!important;
  max-width:470px!important;
}
.hero .scroll-pill{position:relative!important;z-index:8!important}

@media(max-width:1200px){
  .hero .hero-portrait-v47{
    left:30vw!important;
    width:41vw!important;
    height:47%!important;
    bottom:-1vh!important;
  }
  .hero .solar-system{right:-31vw!important;opacity:.68!important}
}

@media(max-width:900px){
  .hero .hero-portrait-v47{
    left:27vw!important;
    width:53vw!important;
    height:43%!important;
    bottom:1vh!important;
    opacity:.82!important;
  }
  .hero .solar-system{right:-43vw!important;opacity:.55!important}
}

@media(max-width:700px){
  .hero .hero-portrait-v47{
    left:19vw!important;
    width:76vw!important;
    height:39%!important;
    bottom:7vh!important;
    opacity:.68!important;
  }
  .hero .hero-portrait-v47::before{left:-12%!important;right:-12%!important;filter:blur(20px)!important}
  .hero .hero-portrait-v47::after{inset:-2% -8% -8%!important}
  .hero .hero-portrait-v47 img{filter:grayscale(1) saturate(0) brightness(.64) contrast(1.28)!important}
  .hero .solar-system{right:-58vw!important;opacity:.44!important}
}




/* Desktop: portrait begins below the ISLAM line, not inside the title. */
.hero .hero-portrait-v47{
  left:31vw!important;
  right:auto!important;
  top:57%!important;
  bottom:auto!important;
  width:min(31vw,560px)!important;
  height:43%!important;
  transform:none!important;
  z-index:3!important;
  opacity:.42!important;
  overflow:visible!important;
  pointer-events:none!important;
  background:transparent!important;
}

/* Softer atmospheric blend around portrait edges. */
.hero .hero-portrait-v47::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:-12% -22% -9%!important;
  background:
    radial-gradient(ellipse 42% 46% at 50% 34%,rgba(255,255,255,.055),transparent 72%),
    radial-gradient(ellipse 58% 48% at 50% 64%,rgba(86,96,112,.065),transparent 74%)!important;
  filter:blur(32px)!important;
  opacity:.62!important;
}

/* Strong edge/bottom feather without a visible box. */
.hero .hero-portrait-v47::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:-2% -18% -9%!important;
  z-index:2!important;
  pointer-events:none!important;
  background:
    linear-gradient(90deg,rgba(4,7,9,.78) 0,transparent 24%,transparent 76%,rgba(4,7,9,.78) 100%),
    linear-gradient(180deg,transparent 0 62%,rgba(4,7,9,.42) 79%,rgba(4,7,9,.96) 100%)!important;
  filter:blur(12px)!important;
}

.hero .hero-portrait-v47 img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center top!important;
  opacity:.78!important;
  mix-blend-mode:normal!important;
  filter:
    grayscale(1)
    saturate(0)
    brightness(.58)
    contrast(1.26)!important;
  -webkit-mask-image:radial-gradient(
    ellipse 68% 92% at 50% 38%,
    #000 0 54%,
    rgba(0,0,0,.90) 65%,
    rgba(0,0,0,.55) 79%,
    rgba(0,0,0,.18) 90%,
    transparent 100%
  )!important;
  mask-image:radial-gradient(
    ellipse 68% 92% at 50% 38%,
    #000 0 54%,
    rgba(0,0,0,.90) 65%,
    rgba(0,0,0,.55) 79%,
    rgba(0,0,0,.18) 90%,
    transparent 100%
  )!important;
}

/* Tablet */
@media(max-width:1000px){
  .hero .hero-portrait-v47{
    left:30vw!important;
    top:59%!important;
    width:39vw!important;
    height:39%!important;
    opacity:.38!important;
  }
}

/* Mobile: still below name, lighter and more subtle. */
@media(max-width:700px){
  .hero .hero-portrait-v47{
    left:23vw!important;
    top:56%!important;
    width:70vw!important;
    height:38%!important;
    opacity:.30!important;
  }
  .hero .hero-portrait-v47::before{
    inset:-8% -10% -5%!important;
    filter:blur(22px)!important;
    opacity:.45!important;
  }
  .hero .hero-portrait-v47::after{
    inset:0 -8% -6%!important;
    filter:blur(9px)!important;
  }
  .hero .hero-portrait-v47 img{
    opacity:.72!important;
    filter:grayscale(1) saturate(0) brightness(.54) contrast(1.22)!important;
  }
}


.hero .hero-title{z-index:6!important;position:relative!important}
.hero .hero-portrait-v47{
  left:25vw!important;
  right:auto!important;
  top:17%!important;
  bottom:auto!important;
  width:min(48vw,860px)!important;
  height:83%!important;
  transform:none!important;
  z-index:4!important;
  opacity:.58!important;
  overflow:visible!important;
  background:transparent!important;
  pointer-events:none!important;
}
.hero .hero-portrait-v47::before{
  content:""!important;display:block!important;position:absolute!important;
  inset:0 -15% -4%!important;
  background:radial-gradient(ellipse 44% 45% at 51% 35%,rgba(255,255,255,.055),transparent 72%)!important;
  filter:blur(30px)!important;opacity:.55!important;z-index:0!important;
}
.hero .hero-portrait-v47::after{
  content:""!important;display:block!important;position:absolute!important;
  inset:-1% -12% -4%!important;z-index:2!important;pointer-events:none!important;
  background:linear-gradient(90deg,rgba(4,7,9,.9) 0,transparent 20%,transparent 78%,rgba(4,7,9,.82) 100%),linear-gradient(180deg,rgba(4,7,9,.12) 0,transparent 24%,transparent 62%,rgba(4,7,9,.96) 100%)!important;
  filter:blur(14px)!important;
}
.hero .hero-portrait-v47 img{
  position:relative!important;z-index:1!important;width:100%!important;height:100%!important;
  object-fit:contain!important;object-position:center bottom!important;opacity:.72!important;
  mix-blend-mode:luminosity!important;filter:grayscale(1) saturate(0) brightness(.47) contrast(1.30)!important;
  -webkit-mask-image:radial-gradient(ellipse 65% 90% at 50% 45%,#000 0 52%,rgba(0,0,0,.92) 65%,rgba(0,0,0,.48) 82%,transparent 100%)!important;
  mask-image:radial-gradient(ellipse 65% 90% at 50% 45%,#000 0 52%,rgba(0,0,0,.92) 65%,rgba(0,0,0,.48) 82%,transparent 100%)!important;
}
.hero .portrait-index{display:none!important}
.hero .solar-system{z-index:5!important}
.hero .hero-bottom,.hero .hero-top{z-index:7!important}
@media(max-width:1000px){.hero .hero-portrait-v47{left:29vw!important;top:24%!important;width:58vw!important;height:74%!important;opacity:.48!important}}
@media(max-width:700px){.hero .hero-portrait-v47{left:20vw!important;top:31%!important;width:88vw!important;height:63%!important;opacity:.34!important}.hero .hero-portrait-v47 img{brightness:.44!important}}



.hero-talk-v55{
  position:absolute;
  left:4.8vw;
  bottom:7.8vh;
  z-index:16;
  display:inline-flex;
  align-items:center;
  gap:24px;
  min-height:52px;
  padding:10px 11px 10px 20px;
  border:1px solid rgba(245,245,238,.20);
  border-radius:999px;
  background:rgba(7,10,12,.34);
  color:#f4f4ef;
  text-decoration:none;
  font-family:var(--cms-font-en,Inter,sans-serif);
  font-size:12px;
  font-weight:650;
  letter-spacing:.015em;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 14px 42px rgba(0,0,0,.18);
  transition:border-color .28s ease,background .28s ease,transform .28s ease,box-shadow .28s ease;
}
.hero-talk-v55 span{white-space:nowrap}
.hero-talk-v55 b{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:50%;
  background:#d9ff3f;
  color:#080b0c;
  font-size:14px;
  line-height:1;
  box-shadow:0 0 0 1px rgba(217,255,63,.18),0 0 18px rgba(217,255,63,.10);
  transition:transform .28s ease,box-shadow .28s ease;
}
.hero-talk-v55:hover{
  transform:translateY(-2px);
  border-color:rgba(217,255,63,.42);
  background:rgba(217,255,63,.035);
  box-shadow:0 16px 46px rgba(0,0,0,.25),0 0 25px rgba(217,255,63,.055);
}
.hero-talk-v55:hover b{
  transform:rotate(8deg) scale(1.06);
  box-shadow:0 0 0 1px rgba(217,255,63,.30),0 0 24px rgba(217,255,63,.16);
}
@media(max-width:900px){
  .hero-talk-v55{
    left:5vw;
    bottom:6.7vh;
  }
}
@media(max-width:700px){
  .hero-talk-v55{
    position:absolute;
    left:20px;
    bottom:78px;
    min-height:46px;
    padding:8px 9px 8px 15px;
    gap:18px;
    font-size:10.5px;
  }
  .hero-talk-v55 b{width:29px;height:29px;font-size:12px}
}




/* Wider copy area: preserves existing typography but removes the narrow 4-line wrap. */
.hero .hero-copy{
  width:min(860px,52vw)!important;
  max-width:min(860px,52vw)!important;
  white-space:normal!important;
  text-wrap:balance;
}

/* CTA stays visually attached to the copy instead of floating across it. */
.hero .hero-talk-v55{
  position:absolute!important;
  left:4.8vw!important;
  top:auto!important;
  bottom:5.0vh!important;
  margin:0!important;
  z-index:18!important;
}

/*
 Desktop copy currently sits low in the hero.
 Give it enough bottom room for the CTA so the two never overlap.
*/
@media(min-width:901px){
  .hero .hero-copy{
    padding-bottom:74px!important;
  }
}

/* Tablet */
@media(min-width:701px) and (max-width:1100px){
  .hero .hero-copy{
    width:min(700px,60vw)!important;
    max-width:min(700px,60vw)!important;
    padding-bottom:68px!important;
  }
  .hero .hero-talk-v55{
    bottom:4.5vh!important;
  }
}

/* Mobile stays readable; don't force two lines on narrow screens. */
@media(max-width:700px){
  .hero .hero-copy{
    width:calc(100vw - 40px)!important;
    max-width:560px!important;
    padding-bottom:64px!important;
    text-wrap:pretty;
  }
  .hero .hero-talk-v55{
    left:20px!important;
    bottom:62px!important;
  }
}


a[href],
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="checkbox"],
input[type="radio"],
select,
summary,
label[for],
[role="button"],
[role="link"],
[data-cursor],
.magnetic,
.clickable{
  cursor:pointer!important;
}

button:disabled,
input:disabled,
select:disabled,
[aria-disabled="true"]{
  cursor:not-allowed!important;
}



.hero .hero-portrait,
.hero .hero-photo,
.hero .hero-image,
.hero .portrait,
.hero .profile-image,
.hero [class*="portrait"],
.hero [class*="hero-photo"],
.hero [class*="hero-image"],
.hero img[data-hero-image],
.hero picture[data-hero-image],
.hero .hero-person,
.hero .hero-person-image{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  background-image:none!important;
}




/* Keep the title block where it already is, but align both words by their ending edge. */
.hero .hero-title{
  width:min(58vw,1040px)!important;
  max-width:min(58vw,1040px)!important;
}

.hero .hero-title .hero-line{
  width:100%!important;
  text-align:right!important;
  padding-left:0!important;
  transform:none!important;
}

/* ASHIKUL = FILLED */
.hero .hero-title .hero-line:first-child .outline{
  color:#f2f0ea!important;
  -webkit-text-stroke:0!important;
  text-shadow:0 12px 46px rgba(0,0,0,.30)!important;
}

/* ISLAM = OUTLINE */
.hero .hero-title .hero-line.shifted span{
  color:transparent!important;
  -webkit-text-stroke:1.2px rgba(242,240,234,.86)!important;
  text-shadow:none!important;
}

/* Hero bottom becomes a clean local layout context. */
.hero .hero-bottom{
  display:grid!important;
  grid-template-columns:minmax(0,860px) auto!important;
  grid-template-areas:
    "copy work"
    "talk work"!important;
  align-items:start!important;
  column-gap:42px!important;
  row-gap:18px!important;
}

/* Intro text: roughly two lines on desktop. */
.hero .hero-copy{
  grid-area:copy!important;
  width:min(860px,52vw)!important;
  max-width:min(860px,52vw)!important;
  margin:0!important;
  padding:0!important;
  text-wrap:balance!important;
}

/* LET'S TALK directly under the copy — no absolute floating. */
.hero .hero-talk-v55{
  grid-area:talk!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  margin:0!important;
  justify-self:start!important;
  align-self:start!important;
}

/* Existing Explore selected work stays on the right. */
.hero .scroll-pill{
  grid-area:work!important;
  align-self:start!important;
  justify-self:end!important;
}

/* Hand cursor for every real clickable element. */
a[href],
button:not(:disabled),
input[type="button"]:not(:disabled),
input[type="submit"]:not(:disabled),
input[type="reset"]:not(:disabled),
select:not(:disabled),
summary,
label[for],
[role="button"]:not([aria-disabled="true"]),
[role="link"]:not([aria-disabled="true"]),
.magnetic,
.clickable{
  cursor:pointer!important;
}

.field-note-v58{
  display:block;
  margin-top:5px;
  color:#59686e;
  font-size:8px;
}

@media(max-width:1100px){
  .hero .hero-title{
    width:min(72vw,900px)!important;
    max-width:min(72vw,900px)!important;
  }
  .hero .hero-bottom{
    grid-template-columns:minmax(0,1fr) auto!important;
  }
  .hero .hero-copy{
    width:min(680px,62vw)!important;
    max-width:min(680px,62vw)!important;
  }
}

@media(max-width:700px){
  .hero .hero-title{
    width:100%!important;
    max-width:100%!important;
  }
  .hero .hero-title .hero-line{
    text-align:left!important;
  }
  .hero .hero-bottom{
    display:block!important;
  }
  .hero .hero-copy{
    width:100%!important;
    max-width:100%!important;
  }
  .hero .hero-talk-v55{
    display:inline-flex!important;
    margin-top:18px!important;
  }
  .hero .scroll-pill{
    margin-top:18px!important;
  }
}



.article-page .interactive-title .article-title-outline,
.article-page .interactive-title.bn-text .article-title-outline,
.article-page .interactive-title.cms-bn-article-title .article-title-outline{
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  -webkit-text-stroke:1.35px #cbb1ff!important;
  text-shadow:
    0 0 1px rgba(203,177,255,.35),
    0 0 12px rgba(132,92,205,.06)!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}

/* Never dim the manual outline line because it is Bengali. */
.article-page .interactive-title.bn-text .article-title-outline{
  opacity:1!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  -webkit-text-stroke:1.35px #cbb1ff!important;
}



.article-page .interactive-title .article-title-solid,
.article-page .interactive-title.bn-text .article-title-solid,
.article-page .interactive-title.cms-bn-article-title .article-title-solid{
  color:#f4f2ed!important;
  -webkit-text-fill-color:#f4f2ed!important;
  -webkit-text-stroke:0!important;
  opacity:1!important;
  text-shadow:none!important;
}

.article-page .interactive-title .article-title-outline,
.article-page .interactive-title.bn-text .article-title-outline,
.article-page .interactive-title.cms-bn-article-title .article-title-outline{
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  -webkit-text-stroke:1.35px #cbb1ff!important;
  opacity:1!important;
  text-shadow:none!important;
  filter:none!important;
}



.article-page .interactive-title.bn-text .article-title-outline,
.article-page .interactive-title.cms-bn-article-title .article-title-outline{
  opacity:1!important;
  visibility:visible!important;
  color:rgba(203,177,255,.018)!important;
  -webkit-text-fill-color:rgba(203,177,255,.018)!important;
  -webkit-text-stroke:0!important;
  text-shadow:
    -1px -1px 0 #cbb1ff,
     0   -1px 0 #cbb1ff,
     1px -1px 0 #cbb1ff,
    -1px  0   0 #cbb1ff,
     1px  0   0 #cbb1ff,
    -1px  1px 0 #cbb1ff,
     0    1px 0 #cbb1ff,
     1px  1px 0 #cbb1ff!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}



.article-page .interactive-title .article-title-outline,
.article-page .interactive-title.bn-text .article-title-outline,
.article-page .interactive-title.cms-bn-article-title .article-title-outline {
  opacity:1!important;
  visibility:visible!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  -webkit-text-stroke:1.35px #C7F000!important;
  text-shadow:none!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}

/* Anek Bangla: keep the interior visually empty while preserving glyph
   rendering, then draw the same lime outline around the glyphs. */
.article-page .interactive-title.bn-text .article-title-outline,
.article-page .interactive-title.cms-bn-article-title .article-title-outline {
  color:rgba(199,240,0,.001)!important;
  -webkit-text-fill-color:rgba(199,240,0,.001)!important;
  -webkit-text-stroke:0!important;
  text-shadow:
    -1.15px -1.15px 0 #C7F000,
     0      -1.15px 0 #C7F000,
     1.15px -1.15px 0 #C7F000,
    -1.15px  0      0 #C7F000,
     1.15px  0      0 #C7F000,
    -1.15px  1.15px 0 #C7F000,
     0       1.15px 0 #C7F000,
     1.15px  1.15px 0 #C7F000!important;
}




/* English remains transparent-fill + lime stroke. */
.article-page .interactive-title:not(.bn-text):not(.cms-bn-article-title) .article-title-outline{
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  -webkit-text-stroke:1.35px #C7F000!important;
  text-shadow:none!important;
  opacity:1!important;
}

/*
 Bengali/Anek Bangla:
 WebKit's transparent fill can render inconsistently on joined Bengali glyphs.
 Use the hero's near-black as the interior and draw only the lime edge.
 Visually this is outline-only against the dark hero background.
*/
.article-page .interactive-title.bn-text .article-title-outline,
.article-page .interactive-title.cms-bn-article-title .article-title-outline{
  color:#080b0e!important;
  -webkit-text-fill-color:#080b0e!important;
  -webkit-text-stroke:1.45px #C7F000!important;
  text-shadow:none!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}

/* Slightly reduce the excerpt / intro immediately under single-blog title. */
.article-page .article-intro-grid>p{
  font-size:clamp(17px,1.45vw,23px)!important;
  line-height:1.55!important;
  max-width:780px!important;
}

@media(max-width:700px){
  .article-page .article-intro-grid>p{
    font-size:16px!important;
    line-height:1.6!important;
  }
}




/* English: native outline, unchanged. */
.article-page .interactive-title:not(.bn-text):not(.cms-bn-article-title) .article-title-outline{
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  -webkit-text-stroke:1.35px #C7F000!important;
  text-shadow:none!important;
  filter:none!important;
  opacity:1!important;
}

/*
 Bengali: dark interior matching the hero + morphology-generated lime edge.
 The SVG filter works on the rasterized glyph alpha, so joined Bengali glyphs
 get the same visible outline as punctuation/Latin characters.
*/
.article-page .interactive-title.bn-text .article-title-outline,
.article-page .interactive-title.cms-bn-article-title .article-title-outline{
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  color:#080b0e!important;
  -webkit-text-fill-color:#080b0e!important;
  -webkit-text-stroke:0!important;
  text-shadow:none!important;
  filter:url(#banglaOutlineV64)!important;
  overflow:visible!important;
  isolation:isolate!important;
  mix-blend-mode:normal!important;
}
.article-page .interactive-title,
.article-page .interactive-title .article-title-outline{
  overflow:visible!important;
}

/* Slightly smaller intro/excerpt under title. */
.article-page .article-intro-grid>p{
  font-size:clamp(16px,1.25vw,21px)!important;
  line-height:1.55!important;
  max-width:760px!important;
}
@media(max-width:700px){
  .article-page .article-intro-grid>p{
    font-size:15.5px!important;
    line-height:1.58!important;
  }
}




.article-page .article-body table,
.article-page .article-content table,
.article-page .cms-article-content table,
.article-page article table{
  width:100%!important;
  border-collapse:collapse!important;
  border-spacing:0!important;
  margin:28px 0 34px!important;
  background:rgba(10,13,16,.72)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  font:inherit!important;
  color:inherit!important;
}

/* Header cells */
.article-page .article-body table th,
.article-page .article-content table th,
.article-page .cms-article-content table th,
.article-page article table th{
  padding:14px 16px!important;
  text-align:left!important;
  vertical-align:top!important;
  font-weight:700!important;
  color:#f3f1eb!important;
  background:rgba(255,255,255,.045)!important;
  border-right:1px solid rgba(255,255,255,.12)!important;
  border-bottom:1px solid rgba(255,255,255,.14)!important;
}

/* Body cells */
.article-page .article-body table td,
.article-page .article-content table td,
.article-page .cms-article-content table td,
.article-page article table td{
  padding:13px 16px!important;
  text-align:left!important;
  vertical-align:top!important;
  color:#c8c8c3!important;
  background:rgba(255,255,255,.012)!important;
  border-right:1px solid rgba(255,255,255,.09)!important;
  border-bottom:1px solid rgba(255,255,255,.09)!important;
  line-height:1.55!important;
}

.article-page table tr:last-child td{
  border-bottom:0!important;
}
.article-page table th:last-child,
.article-page table td:last-child{
  border-right:0!important;
}

/* Slight row hover to improve scanning. */
.article-page table tbody tr{
  transition:background .18s ease!important;
}
.article-page table tbody tr:hover td{
  background:rgba(199,240,0,.018)!important;
}

/* Bengali table content uses the configured Bangla font. */
.article-page table:lang(bn),
.article-page .bn-text table,
.article-page table .bn-text,
.article-page table th:lang(bn),
.article-page table td:lang(bn){
  font-family:var(--cms-font-bn,"Anek Bangla",sans-serif)!important;
}

/* WordPress/imported tables sometimes arrive with inline widths. Keep them inside article. */
.article-page table,
.article-page table *{
  box-sizing:border-box!important;
  max-width:100%!important;
}

/* Responsive wrapper behavior without requiring editor changes. */
.article-page .article-body,
.article-page .article-content,
.article-page .cms-article-content,
.article-page article{
  min-width:0!important;
}

@media(max-width:760px){
  .article-page .article-body table,
  .article-page .article-content table,
  .article-page .cms-article-content table,
  .article-page article table{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    white-space:nowrap!important;
    border-radius:10px!important;
    scrollbar-width:thin;
  }

  .article-page table th,
  .article-page table td{
    min-width:150px!important;
    padding:11px 13px!important;
    white-space:normal!important;
    font-size:14px!important;
  }

  .article-page table th:first-child,
  .article-page table td:first-child{
    min-width:120px!important;
  }
}


/* FINAL — title stabilization only. No hero/layout/background changes. */
body.article-page #articleTitle{
  transform:none!important;
}
body.article-page #articleTitle *,
body.article-page .interactive-title > span{
  transform:none!important;
  animation:none!important;
  transition:none!important;
}
body.article-page #articleTitle.article-title-ready-final{
  visibility:visible!important;
}



@media(hover:hover) and (pointer:fine){
  .global-cursor-light-final{
    position:fixed;
    left:0;
    top:0;
    width:300px;
    height:300px;
    border-radius:50%;
    pointer-events:none;
    z-index:999990;
    opacity:.30;
    background:
      radial-gradient(circle,
        rgba(217,255,82,.095) 0%,
        rgba(55,89,255,.042) 34%,
        rgba(138,93,255,.025) 50%,
        transparent 69%);
    filter:blur(8px);
    mix-blend-mode:screen;
    will-change:transform;
  }
  .premium-cursor-enabled .journal-pointer{display:none!important}
}
@media(hover:none),(pointer:coarse){
  .global-cursor-light-final{display:none!important}
}

.site-stars-v47{display:none!important}

/* 800-star overlay: decorative only; does not change section/layout stacking. */
.site-stars-canvas-final{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  z-index:1;
  pointer-events:none;
  opacity:.72;
  mix-blend-mode:screen;
}



body.article-page #articleTitle .article-title-solid,
body.article-page #articleTitle .article-title-outline{
  display:inline!important;
  width:auto!important;
}
body.article-page #articleTitle .article-title-solid::after{
  content:" ";
  white-space:pre;
}



.dashboard-main-logo-v74{
  display:block;
  width:38px;
  height:auto;
  max-height:30px;
  object-fit:contain;
}
.dashboard-main-logo-wrap-v74{
  padding:4px 0 14px;
}
.dashboard-main-logo-v74.inline-logo svg{
  display:block;
  width:38px;
  height:auto;
}



body.journal-page .front-blog-tools{
  margin-top:18px!important;
}



.back-to-top-v78{
  position:fixed;
  right:28px;
  bottom:28px;
  z-index:9994;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.15);
  border-radius:50%;
  background:rgba(9,10,13,.62);
  color:#d9ff52;
  font:500 18px/1 "DM Mono",monospace;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 10px 35px rgba(0,0,0,.25);
  opacity:0;
  visibility:hidden;
  transform:translateY(10px);
  transition:opacity .22s ease,visibility .22s ease,transform .22s ease,border-color .22s ease;
}
.back-to-top-v78.is-visible{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.back-to-top-v78:hover{
  border-color:rgba(217,255,82,.48);
}
@media(max-width:700px){
  .back-to-top-v78{
    right:18px;
    bottom:18px;
    width:40px;
    height:40px;
    font-size:16px;
  }
}




@media(max-width:900px){

  /* 2 + 3 — kill horizontal page drift and keep 20px content gutters */
  html,
  body{
    width:100%!important;
    max-width:100%!important;
    overflow-x:clip!important;
  }

  body > main,
  main,
  .panel,
  .panel > *,
  .work-head,
  .project-stage,
  .xp-list,
  .xp-note,
  .capability-grid,
  .services-head,
  .service-grid,
  .proof-sticky,
  .home-blog-head,
  .home-blog-grid,
  .planner-shell{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  .panel{
    width:100%!important;
    padding-left:20px!important;
    padding-right:20px!important;
    padding-bottom:82px!important; /* room for section index */
  }

  /* Undo an older 12px Work-only gutter. */
  .work{
    padding-left:20px!important;
    padding-right:20px!important;
  }

  /* 1 — mobile hero rhythm: no giant flex-distributed gaps */
  .hero{
    min-height:100svh!important;
    justify-content:flex-start!important;
    overflow:hidden!important;
  }

  .hero .hero-title{
    width:100%!important;
    max-width:100%!important;
    margin:9vh 0 5vh!important;
    font-size:clamp(72px,21vw,118px)!important;
    line-height:.67!important;
  }

  .hero .hero-title .hero-line{
    width:100%!important;
    max-width:100%!important;
    text-align:left!important;
    white-space:nowrap!important;
  }

  .hero .hero-bottom{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
  }

  .hero .hero-copy{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
  }

  /* Two CTAs stack vertically instead of sitting side-by-side. */
  .hero .hero-talk-v55,
  .hero .scroll-pill{
    display:flex!important;
    width:max-content!important;
    max-width:100%!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  .hero .hero-talk-v55{
    margin-top:18px!important;
  }

  .hero .scroll-pill{
    margin-top:12px!important;
    justify-self:start!important;
  }

  /* Solar system was pushed almost fully off-screen by the older mobile rule. */
  .hero .solar-system{
    display:block!important;
    width:102vw!important;
    height:102vw!important;
    right:-34vw!important;
    top:15vh!important;
    opacity:.54!important;
    visibility:visible!important;
    transform:none!important;
  }

  .hero .solar-system .solar-orbit,
  .hero .solar-system .sun-core,
  .hero .solar-system .planet{
    visibility:visible!important;
    opacity:1;
  }

  /* 2 — Selected Work heading always stays inside viewport. */
  .work-head{
    display:block!important;
    width:100%!important;
    overflow:hidden!important;
  }

  .work-head h2{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    font-size:clamp(44px,11.5vw,74px)!important;
    line-height:.88!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    letter-spacing:-.055em!important;
  }

  .work-head p{
    width:100%!important;
    max-width:100%!important;
  }

  .project-stage,
  .project,
  .project.cms-project-showcase,
  .cms-project-media,
  .cms-project-img{
    max-width:100%!important;
  }

  /* 4 + 6 — section counters get a reserved footer lane. */
  .panel > .hero-index{
    left:20px!important;
    right:auto!important;
    bottom:18px!important;
    top:auto!important;
    z-index:12!important;
    margin:0!important;
    transform:none!important;
  }

  .experience .capability-grid,
  .services-universe .service-grid{
    margin-bottom:18px!important;
  }

  /* 06/07 lives inside proof-sticky, so reserve its own bottom lane. */
  .proof-universe .proof-sticky{
    position:relative!important;
    padding-bottom:64px!important;
  }

  .proof-universe .proof-sticky > .hero-index{
    left:0!important;
    right:auto!important;
    bottom:18px!important;
    top:auto!important;
    z-index:12!important;
    transform:none!important;
  }

  /* 5 — working seamless ticker + breathing room before WHAT I DO. */
  .services-universe{
    padding-top:148px!important;
    overflow:hidden!important;
  }

  .services-universe .manifesto-ticker{
    top:62px!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    display:block!important;
    overflow:hidden!important;
  }

  .services-universe .manifesto-ticker-track{
    display:flex!important;
    width:max-content!important;
    min-width:max-content!important;
    animation:servicesMarqueeV23 20s linear infinite!important;
    will-change:transform!important;
  }

  .services-universe .manifesto-ticker-group{
    flex:0 0 auto!important;
    width:max-content!important;
  }

  .services-universe .services-head{
    margin-top:28px!important;
  }

  /* Contact / 08 index cannot sit over form content. */
  .planner-universe{
    padding-bottom:88px!important;
  }
}

/* Phone-specific tightening. */
@media(max-width:700px){
  .hero .hero-title{
    margin-top:7.5vh!important;
    margin-bottom:4vh!important;
    font-size:clamp(70px,20.5vw,96px)!important;
  }

  .hero .hero-copy{
    font-size:16px!important;
    line-height:1.45!important;
  }

  .hero .solar-system{
    width:112vw!important;
    height:112vw!important;
    right:-42vw!important;
    top:17vh!important;
    opacity:.50!important;
  }

  .work-head h2{
    font-size:clamp(42px,11vw,58px)!important;
  }

  .services-universe{
    padding-top:142px!important;
  }

  .services-universe .services-head{
    margin-top:32px!important;
  }

  .services-universe .manifesto-ticker-track{
    animation-duration:18s!important;
  }
}

/* Small phones: keep the title compact but readable. */
@media(max-width:420px){
  .hero .hero-title{
    font-size:20vw!important;
    margin-top:7vh!important;
    margin-bottom:3.5vh!important;
  }

  .work-head h2{
    font-size:10.7vw!important;
  }
}




@media(max-width:900px){

  /* Homepage hero: balanced vertical rhythm.
     Name stays high, copy + stacked CTAs live lower, index owns the bottom lane. */
  .hero{
    min-height:100svh!important;
    padding-bottom:48px!important;
  }

  .hero .hero-title{
    margin-top:8vh!important;
    margin-bottom:0!important;
  }

  .hero .hero-bottom{
    margin-top:auto!important;
    padding-bottom:38px!important;
  }

  .hero .hero-copy{
    margin:0 0 20px!important;
    padding:0!important;
  }

  .hero .hero-talk-v55{
    margin-top:0!important;
  }

  .hero .scroll-pill{
    margin-top:12px!important;
  }

  /* Every homepage section index has its own bottom lane and uses 08 total. */
  .panel{
    padding-bottom:88px!important;
  }

  .panel > .hero-index{
    left:20px!important;
    right:auto!important;
    bottom:8px!important;
    top:auto!important;
    line-height:1!important;
    z-index:20!important;
  }

  .experience .capability-grid,
  .services-universe .service-grid{
    margin-bottom:30px!important;
  }

  .proof-universe .proof-sticky{
    padding-bottom:76px!important;
  }

  .proof-universe .proof-sticky > .hero-index{
    left:0!important;
    right:auto!important;
    bottom:8px!important;
    top:auto!important;
    z-index:20!important;
  }

  .planner-universe{
    padding-bottom:96px!important;
  }
}

@media(max-width:700px){

  /* Keep hero neither cramped nor empty on phones. */
  .hero .hero-title{
    margin-top:7vh!important;
  }

  .hero .hero-bottom{
    padding-bottom:34px!important;
  }

  .hero .hero-copy{
    margin-bottom:18px!important;
  }

  /* Single blog: reduce oversized whitespace above title and before feature image. */
  body.article-page .article-hero{
    min-height:auto!important;
    padding:102px 20px 28px!important;
  }

  body.article-page .interactive-title{
    margin-top:22px!important;
    margin-bottom:28px!important;
  }

  body.article-page .article-intro-grid{
    gap:22px!important;
  }

  body.article-page .article-wide-image{
    margin-top:0!important;
    padding-top:8px!important;
    padding-left:20px!important;
    padding-right:20px!important;
    padding-bottom:52px!important;
  }

  body.article-page .article-featured,
  body.article-page .article-featured-image,
  body.article-page .article-hero-image,
  body.article-page .article-body > figure:first-of-type,
  body.article-page .article-body > .featured-image:first-child{
    margin-top:14px!important;
  }

  /* Related articles never need archive pagination. Safety net in CSS too. */
  body.article-page .related-articles + .blog-pagination-v33,
  body.article-page .related-articles .blog-pagination-v33{
    display:none!important;
  }
}

@media(max-width:420px){
  .hero .hero-title{
    margin-top:6.5vh!important;
  }
  body.article-page .article-hero{
    padding-top:94px!important;
  }
}


.hero-iam-v83{position:relative;z-index:8;width:max-content;margin:0 0 10px;color:rgba(242,240,234,.72);font:500 11px/1.1 "DM Mono",monospace;letter-spacing:.12em;text-transform:uppercase}

@media(min-width:901px){
  .panel > .hero-index{transform:translateY(24px)!important}
  .proof-universe .proof-sticky > .hero-index{transform:translateY(24px)!important}
}

@media(max-width:900px){
  .panel > .hero-index{bottom:1px!important}
  .proof-universe .proof-sticky > .hero-index{bottom:1px!important}
  .planner-intro{overflow:visible!important;padding-left:20px!important;padding-right:20px!important;box-sizing:border-box!important}
  .planner-intro h2{max-width:100%!important;overflow:visible!important;padding-left:2px!important;margin-left:0!important}
}

@media(max-width:700px){
  body.article-page .article-wide-image{padding-top:20px!important}
  body.article-page .article-featured,
  body.article-page .article-featured-image,
  body.article-page .article-hero-image,
  body.article-page .article-body > figure:first-of-type,
  body.article-page .article-body > .featured-image:first-child{margin-top:20px!important}
  .hero-iam-v83{margin-bottom:8px!important;font-size:10px!important}
  .planner-universe .planner-intro{width:100%!important;max-width:100%!important}
  .planner-universe .planner-intro h2{width:100%!important;max-width:calc(100vw - 40px)!important;box-sizing:border-box!important}
}




/* "I AM" is part of the hero identity, not metadata. */
.hero-iam-v83{
  position:relative!important;
  z-index:9!important;
  display:block!important;
  width:max-content!important;
  margin:0 0 12px!important;
  color:#f2f0ea!important;
  font-family:"Space Grotesk","Manrope",sans-serif!important;
  font-size:clamp(28px,2.2vw,38px)!important;
  font-weight:600!important;
  line-height:1!important;
  letter-spacing:-.035em!important;
  text-transform:uppercase!important;
}

/* Desktop: keep I AM close to the name without disturbing the hero structure. */
@media(min-width:901px){
  .hero-iam-v83{
    margin-top:42px!important;
    margin-bottom:14px!important;
  }
}

/* =========================================================
   CONSISTENT SECTION INDEX SYSTEM
   All homepage section counters occupy their own bottom lane.
   ========================================================= */
@media(max-width:900px){

  /* Do not let section content and the index share the same vertical space. */
  .panel{
    position:relative!important;
    padding-bottom:108px!important;
  }

  .panel > .hero-index{
    position:absolute!important;
    left:20px!important;
    right:auto!important;
    top:auto!important;
    bottom:24px!important;
    margin:0!important;
    transform:none!important;
    z-index:25!important;
    line-height:1!important;
  }

  /* Proof section counter is nested inside sticky wrapper. */
  .proof-universe{
    padding-bottom:0!important;
  }
  .proof-universe .proof-sticky{
    position:relative!important;
    padding-bottom:104px!important;
  }
  .proof-universe .proof-sticky > .hero-index{
    position:absolute!important;
    left:0!important;
    right:auto!important;
    top:auto!important;
    bottom:24px!important;
    margin:0!important;
    transform:none!important;
    z-index:25!important;
  }

  /* Keep carousel's own 01/04 progress visually separate from section 06/08. */
  .proof-universe .feedback-carousel-ui{
    margin-bottom:24px!important;
  }

  /* Experience: remove the accidental dead zone before WHAT I DO. */
  .experience{
    padding-bottom:88px!important;
  }
  .experience .capability-grid{
    margin-bottom:0!important;
  }

  /* Selected Work: keep its final CTA/content clear of 03/08. */
  .work{
    padding-bottom:104px!important;
  }
  .work .work-more,
  .work .project-stage{
    margin-bottom:20px!important;
  }

  /* Services: clean transition from ticker to WHAT I DO and reserve index lane. */
  .services-universe{
    padding-top:132px!important;
    padding-bottom:108px!important;
  }
  .services-universe .services-head{
    margin-top:24px!important;
  }
  .services-universe .service-grid{
    margin-bottom:0!important;
  }

  /* Contact: reserve final index lane. */
  .planner-universe{
    padding-bottom:108px!important;
  }
}

/* =========================================================
   PHONE HERO
   Balanced spacing: I AM -> NAME -> paragraph -> buttons -> index.
   ========================================================= */
@media(max-width:700px){
  .hero{
    min-height:100svh!important;
    padding-top:0!important;
    padding-bottom:110px!important;
    justify-content:flex-start!important;
  }

  .hero-iam-v83{
    font-size:24px!important;
    margin-top:48px!important;
    margin-bottom:10px!important;
  }

  .hero .hero-title{
    margin-top:0!important;
    margin-bottom:0!important;
  }

  .hero .hero-bottom{
    margin-top:44px!important;
    padding-bottom:0!important;
  }

  .hero .hero-copy{
    margin-bottom:24px!important;
  }

  .hero .hero-talk-v55{
    margin-top:0!important;
  }

  .hero .scroll-pill{
    margin-top:14px!important;
  }

  .hero > .hero-index{
    bottom:24px!important;
  }

  /* Selected Work heading/content must never overflow horizontally. */
  .work-head,
  .work-head h2,
  .work-head p{
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }

  /* Experience -> Services transition should not create a giant empty section. */
  .experience{
    min-height:auto!important;
  }

  /* =======================================================
     CONTACT HEADLINE
     Fix clipped L / clipped EXCEPTIONAL on narrow screens.
     ======================================================= */
  .planner-universe{
    overflow:hidden!important;
  }
  .planner-universe .planner-intro{
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
    margin-left:0!important;
    overflow:visible!important;
  }
  .planner-universe .planner-intro h2{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    padding:0!important;
    margin-left:0!important;
    margin-right:0!important;
    overflow:visible!important;
    font-size:clamp(47px,13vw,68px)!important;
    line-height:.88!important;
    letter-spacing:-.055em!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
  }
  .planner-universe .planner-intro h2 span{
    display:inline!important;
  }
}

/* Very narrow devices get one more typography safety step. */
@media(max-width:420px){
  .hero-iam-v83{
    font-size:22px!important;
    margin-top:44px!important;
  }

  .planner-universe .planner-intro h2{
    font-size:12.1vw!important;
    line-height:.9!important;
    letter-spacing:-.06em!important;
  }
}




/* I AM: visually belongs to the name, not a separate headline. */
.hero-iam-v83{
  font-family:"DM Mono",monospace!important;
  font-size:clamp(17px,1.45vw,24px)!important;
  font-weight:500!important;
  letter-spacing:.08em!important;
  line-height:1!important;
  color:rgba(242,240,234,.9)!important;
  margin:0 0 12px!important;
  text-transform:uppercase!important;
}

/* Desktop: keep I AM close to ASHIKUL, not floating far above. */
@media(min-width:901px){
  .hero-iam-v83{
    margin-top:18px!important;
    margin-bottom:10px!important;
  }
}

/* =========================================================
   MOBILE/TABLET — stop using forced absolute bottom counters.
   Counters now sit in normal visual flow after content.
   ========================================================= */
@media(max-width:900px){

  /* Header-safe hero top. */
  .hero{
    min-height:auto!important;
    padding-top:92px!important;
    padding-bottom:42px!important;
    justify-content:flex-start!important;
  }

  .hero .hero-top{
    position:relative!important;
    z-index:12!important;
    margin-bottom:34px!important;
  }

  .hero .hero-top .eyebrow,
  .hero .hero-top .availability{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
  }

  .hero-iam-v83{
    margin-top:0!important;
    margin-bottom:9px!important;
    font-size:20px!important;
  }

  .hero .hero-title{
    margin:0!important;
  }

  .hero .hero-bottom{
    margin-top:38px!important;
    padding-bottom:0!important;
  }

  .hero .hero-copy{
    margin:0 0 22px!important;
  }

  .hero .hero-talk-v55{
    margin-top:0!important;
  }

  .hero .scroll-pill{
    margin-top:14px!important;
  }

  
  .panel{
    padding-bottom:46px!important;
  }

  .panel > .hero-index,
  .proof-universe .proof-sticky > .hero-index{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    margin:34px 0 0!important;
    transform:none!important;
    z-index:12!important;
    display:block!important;
  }

  /* Hero gets a slightly larger end gap before 01/08, but no huge dead space. */
  .hero > .hero-index{
    margin-top:42px!important;
  }

  /* Work/Experience/Services/Planner counters use consistent section-end spacing. */
  .work > .hero-index,
  .experience > .hero-index,
  .services-universe > .hero-index,
  .planner-universe > .hero-index{
    margin-top:36px!important;
  }

  /* Proof section: carousel progress and section counter clearly separated. */
  .proof-universe .proof-sticky{
    padding-bottom:0!important;
  }
  .proof-universe .feedback-carousel-ui{
    margin-bottom:18px!important;
  }
  .proof-universe .proof-sticky > .hero-index{
    margin-top:30px!important;
  }

  /* Remove giant empty zone between Experience and Services. */
  .experience{
    min-height:auto!important;
    padding-bottom:42px!important;
  }

  .experience .capability-grid{
    margin-bottom:0!important;
  }

  .services-universe{
    padding-top:116px!important;
    padding-bottom:44px!important;
  }

  .services-universe .services-head{
    margin-top:22px!important;
  }

  /* Contact / planner should not clip at either side. */
  .planner-universe{
    padding-bottom:46px!important;
    overflow:hidden!important;
  }

  .planner-universe .planner-intro{
    padding-left:0!important;
    padding-right:0!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  .planner-universe .planner-intro h2{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }
}

/* Phone-specific composition. */
@media(max-width:700px){

  .hero{
    padding-top:84px!important;
  }

  .hero .hero-top{
    margin-bottom:28px!important;
  }

  .hero-iam-v83{
    font-size:19px!important;
    margin-bottom:8px!important;
  }

  .hero .hero-title{
    font-size:clamp(72px,20vw,96px)!important;
    line-height:.68!important;
  }

  .hero .hero-bottom{
    margin-top:34px!important;
  }

  /* 01/08 now follows content naturally. */
  .hero > .hero-index{
    margin-top:40px!important;
  }

  /* Contact title fits narrow viewport without clipping first/last letters. */
  .planner-universe .planner-intro h2{
    font-size:clamp(43px,11.6vw,60px)!important;
    line-height:.9!important;
    letter-spacing:-.052em!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
  }

  /* Journal transition: prevent previous section counter from floating above it. */
  .home-blog-universe,
  .journal-universe{
    position:relative!important;
    clear:both!important;
  }
}

@media(max-width:420px){
  .hero{
    padding-top:80px!important;
  }

  .hero-iam-v83{
    font-size:18px!important;
  }

  .planner-universe .planner-intro h2{
    font-size:11.2vw!important;
  }
}



@media(max-width:900px){
  .hero{
    min-height:100svh!important;
    height:auto!important;
    box-sizing:border-box!important;
    padding-top:84px!important;
    padding-bottom:28px!important;
    display:flex!important;
    flex-direction:column!important;
  }

  /* Keep existing hero composition; use remaining viewport space
     so the next section starts after the first full screen. */
  .hero > .hero-index{
    margin-top:auto!important;
    padding-top:28px!important;
  }
}

@media(max-width:700px){
  .hero{
    min-height:100svh!important;
    padding-top:84px!important;
    padding-bottom:28px!important;
  }
}



@media(min-width:901px){
  .hero-iam-v83{
    margin-top:0!important;
    margin-bottom:10px!important;
    margin-left:0!important;
    align-self:flex-start!important;
  }

  .hero .hero-title{
    margin-top:0!important;
  }
}




/* Desktop: make I AM a deliberate part of the name lockup,
   with breathing room below the role line. */
@media(min-width:901px){
  .hero-iam-v83{
    font-size:22px!important;
    line-height:1!important;
    letter-spacing:.13em!important;
    margin-top:12px!important;
    margin-bottom:12px!important;
    margin-left:0!important;
  }
}

/* Mobile/tablet: role -> availability -> breathing room -> I AM -> name.
   Keep the reference's vertical hierarchy without changing the rest. */
@media(max-width:900px){
  .hero-iam-v83{
    font-size:20px!important;
    line-height:1!important;
    letter-spacing:.12em!important;
    margin-top:72px!important;
    margin-bottom:8px!important;
    margin-left:0!important;
  }
}

@media(max-width:700px){
  .hero-iam-v83{
    font-size:20px!important;
    margin-top:68px!important;
    margin-bottom:8px!important;
  }
}




/* Desktop */
@media (min-width:901px){
  .hero .hero-top{
    margin-bottom:0!important;
  }
  .hero .hero-iam-v83{
    display:block!important;
    position:relative!important;
    width:max-content!important;
    margin:24px 0 10px 0!important;
    padding:0!important;
    font-family:"DM Mono",monospace!important;
    font-size:26px!important;
    font-weight:500!important;
    line-height:1!important;
    letter-spacing:.12em!important;
    text-transform:uppercase!important;
    color:rgba(242,240,234,.95)!important;
  }
}

/* Tablet + mobile: preserve top metadata, then give the identity lockup
   the same breathing room shown in the supplied Photoshop reference. */
@media (max-width:900px){
  .hero .hero-top{
    margin-bottom:0!important;
  }
  .hero .hero-iam-v83{
    display:block!important;
    position:relative!important;
    width:max-content!important;
    margin:72px 0 9px 0!important;
    padding:0!important;
    font-family:"DM Mono",monospace!important;
    font-size:23px!important;
    font-weight:500!important;
    line-height:1!important;
    letter-spacing:.10em!important;
    text-transform:uppercase!important;
    color:rgba(242,240,234,.96)!important;
  }
}

@media (max-width:700px){
  .hero .hero-iam-v83{
    margin-top:72px!important;
    margin-bottom:8px!important;
    font-size:22px!important;
  }
}



@media (min-width:901px){
  .panel{
    position:relative;
  }

  .panel .hero-index{
    position:absolute!important;
    left:48px!important;
    right:auto!important;
    top:auto!important;
    bottom:30px!important;
    margin:0!important;
    transform:none!important;
    z-index:20!important;
    white-space:nowrap!important;
    pointer-events:none!important;
  }

  /* 06/08 lives inside the testimonial sticky wrapper in the markup.
     Anchor it visually to the section bottom without touching 01/04–04/04. */
  .mentor .proof-sticky{
    position:static!important;
  }

  .mentor .hero-index{
    left:48px!important;
    bottom:30px!important;
  }
}



.philosophy .outline,
.philosophy .outline-text,
.philosophy .stroke,
.philosophy .title-outline,
.philosophy .display-outline,
.philosophy h2 .outline,
.philosophy-title .outline,
[data-section="philosophy"] .outline,
[data-section="design-philosophy"] .outline{
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  -webkit-text-stroke:1.35px rgba(207,255,54,.92)!important;
  text-stroke:1.35px rgba(207,255,54,.92)!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
}



body.home-page section.statement#about .statement-wrap h2 > span,
section.statement#about .statement-wrap h2 > span,
.statement .statement-wrap h2 > span,
.statement h2 > span {
  display:inline-block!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  -webkit-text-stroke-width:1.5px!important;
  -webkit-text-stroke-color:rgba(242,240,234,.72)!important;
  -webkit-text-stroke:1.5px rgba(242,240,234,.72)!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  text-shadow:none!important;
}

/* v104 — single article reading comfort + persistent desktop TOC */
@media (min-width:981px){
  .article-page .article-layout{
    align-items:start!important;
  }
  .article-page .article-toc{
    position:sticky!important;
    top:96px!important;
    align-self:start!important;
    height:max-content!important;
    max-height:calc(100vh - 120px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    padding-bottom:12px!important;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.18) transparent;
  }
  .article-page .article-toc::-webkit-scrollbar{width:4px}
  .article-page .article-toc::-webkit-scrollbar-track{background:transparent}
  .article-page .article-toc::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:99px}
}

/* Tighter, calmer reading rhythm: less vertical fatigue without hurting legibility. */
.article-page .article-body{
  line-height:1.58!important;
}
.article-page .article-body p,
.article-page .article-body li{
  line-height:1.58!important;
}
.article-page .article-body p{
  margin-bottom:1em!important;
}
.article-page .article-body ul,
.article-page .article-body ol{
  margin-top:.45em!important;
  margin-bottom:1.05em!important;
}
.article-page .article-body li{
  margin:.22em 0!important;
}
.article-page .article-body > .imported-block{
  margin-bottom:.78em!important;
}
.article-page .article-body h2{
  margin-top:1.7em!important;
  margin-bottom:.52em!important;
}
.article-page .article-body h3{
  margin-top:1.5em!important;
  margin-bottom:.48em!important;
}
.article-page .article-body h4{
  margin-top:1.35em!important;
  margin-bottom:.44em!important;
}
.article-page .article-lead{
  line-height:1.48!important;
  margin-bottom:72px!important;
}
.article-page .article-section{
  padding-top:30px!important;
  padding-bottom:72px!important;
}
.article-page .section-number{
  margin-bottom:24px!important;
}
.article-page .article-section h2{
  margin-top:0!important;
  margin-bottom:28px!important;
}
.article-page .cosmic-quote{
  margin-bottom:82px!important;
}
.article-page .cosmic-quote p{
  line-height:1.14!important;
}

@media(max-width:980px){
  .article-page .article-toc{
    position:relative!important;
    top:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .article-page .article-body,
  .article-page .article-body p,
  .article-page .article-body li{
    line-height:1.62!important;
  }
  .article-page .article-lead{
    line-height:1.52!important;
    margin-bottom:54px!important;
  }
  .article-page .article-section{
    padding-top:26px!important;
    padding-bottom:58px!important;
  }
}

/* v105 — reliable sticky article navigation.
   v44's star host used overflow:hidden, which created a non-scrolling sticky container. */
@media (min-width:981px){
  body.journal-page.article-page{overflow-x:clip!important}
  .article-page .article-space-host-v44{
    overflow:visible!important;
  }
  .article-page .article-layout,
  .article-page .article-layout[class*="space"],
  .article-page .article-layout[class*="galaxy"]{
    overflow:visible!important;
    align-items:start!important;
  }
  .article-page .article-toc{
    position:sticky!important;
    top:92px!important;
    align-self:start!important;
    z-index:8!important;
    max-height:calc(100vh - 112px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
}

/* v105 — responsive embedded media in long-form posts */
.article-page .article-embed{width:100%!important;max-width:100%!important;margin:1.25em 0 1.55em!important}
.article-page .article-embed-frame{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:#050609}
.article-page .article-embed-frame iframe,
.article-page .article-embed-frame video{display:block;width:100%!important;height:100%!important;border:0!important;margin:0!important}
.article-page .article-custom-embed{overflow:hidden;border-radius:16px}
.article-page .article-custom-embed iframe,
.article-page .article-custom-embed video{display:block;width:100%!important;max-width:100%!important;min-height:420px;border:0}
.article-page .article-custom-embed blockquote{max-width:100%!important}
@media(max-width:700px){
  .article-page .article-embed{margin:1.05em 0 1.3em!important}
  .article-page .article-embed-frame{border-radius:13px}
  .article-page .article-custom-embed iframe,
  .article-page .article-custom-embed video{min-height:250px}
}


/* v106 — H2-only reading map + tighter article rhythm */
.article-page .article-toc a{position:relative;padding-right:34px!important}
.article-page .article-toc a.active{color:#d9ff52!important;transform:translateX(4px)!important;font-weight:600!important;opacity:1!important}
.article-page .article-toc a.active::before{content:"";position:absolute;left:-12px;top:.62em;width:5px;height:5px;border-radius:50%;background:#d9ff52;box-shadow:0 0 12px rgba(217,255,82,.42)}
.article-page .article-toc a.active::after{content:"NOW";position:absolute;right:0;top:.18em;font:7px "DM Mono",monospace;letter-spacing:.08em;color:#a9c842}
.article-page .article-body,.article-page .article-body p,.article-page .article-body li{line-height:1.46!important}
.article-page .article-body p{margin-top:0!important;margin-bottom:.78em!important}
.article-page .article-body ul,.article-page .article-body ol{margin-top:.3em!important;margin-bottom:.82em!important}
.article-page .article-body li{margin:.12em 0!important}
.article-page .article-body h2{margin-top:1.48em!important;margin-bottom:.42em!important;line-height:1.17!important}
.article-page .article-body h3{margin-top:1.25em!important;margin-bottom:.34em!important;line-height:1.22!important}
.article-page .article-body h4{margin-top:1.1em!important;margin-bottom:.3em!important;line-height:1.25!important}
.article-page .article-body > .imported-block{margin-bottom:.58em!important}
@media(max-width:980px){.article-page .article-body,.article-page .article-body p,.article-page .article-body li{line-height:1.5!important}}

/* v107 — persistent H2-only article navigator */
@media(min-width:981px){
  .article-page .article-layout{position:relative!important}
  .article-page .article-toc{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
  }
  .article-page .article-toc.toc-empty{display:none!important}
  .article-page .article-toc.toc-fixed-v107{
    position:fixed!important;
    top:92px!important;
    margin:0!important;
    z-index:20!important;
  }
  .article-page .article-toc.toc-bottom-v107{
    position:absolute!important;
    top:auto!important;
    bottom:110px!important;
    margin:0!important;
    z-index:20!important;
  }
}
.article-page .article-body h2{scroll-margin-top:112px!important}
.article-page .article-toc a{transition:color .16s ease,transform .16s ease,opacity .16s ease!important}
.article-page .article-toc a.active{background:linear-gradient(90deg,rgba(217,255,82,.055),transparent)!important;border-radius:6px!important}


/* v110 — reliable current-section scroll spy */
.article-page .article-toc a.active{
  color:#d9ff52!important;
  opacity:1!important;
  font-weight:650!important;
  background:linear-gradient(90deg,rgba(217,255,82,.10),rgba(217,255,82,.025) 70%,transparent)!important;
  box-shadow:inset 2px 0 0 #d9ff52!important;
  padding-left:10px!important;
}
.article-page .article-toc a:not(.active){opacity:.72!important}


/* v111 — smoother, quieter article TOC active state */
.article-page .article-toc a{
  position:relative!important;
  display:block!important;
  margin:0 -6px!important;
  padding:7px 30px 7px 12px!important;
  border-radius:8px!important;
  background-color:transparent!important;
  color:#85808a!important;
  opacity:.66!important;
  transform:translateX(0)!important;
  box-shadow:none!important;
  transition:
    color .34s cubic-bezier(.22,.61,.36,1),
    opacity .34s cubic-bezier(.22,.61,.36,1),
    transform .38s cubic-bezier(.16,1,.3,1),
    background-color .38s ease,
    box-shadow .38s ease!important;
  will-change:transform,opacity;
}
.article-page .article-toc a::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:7px!important;
  bottom:7px!important;
  width:2px!important;
  height:auto!important;
  border-radius:99px!important;
  background:#d9ff52!important;
  opacity:0!important;
  transform:scaleY(.36)!important;
  transform-origin:center!important;
  box-shadow:0 0 0 rgba(217,255,82,0)!important;
  transition:opacity .28s ease,transform .42s cubic-bezier(.16,1,.3,1),box-shadow .42s ease!important;
}
.article-page .article-toc a::after{
  content:"NOW"!important;
  position:absolute!important;
  right:8px!important;
  top:8px!important;
  font:600 6.5px "DM Mono",monospace!important;
  letter-spacing:.1em!important;
  color:#bddf4b!important;
  opacity:0!important;
  transform:translateX(4px)!important;
  transition:opacity .28s ease,transform .36s cubic-bezier(.16,1,.3,1)!important;
}
.article-page .article-toc a:hover{
  color:#b9b4bd!important;
  opacity:.9!important;
  transform:translateX(2px)!important;
  background-color:rgba(255,255,255,.025)!important;
}
.article-page .article-toc a.active{
  color:#d9ff52!important;
  opacity:1!important;
  font-weight:600!important;
  transform:translateX(3px)!important;
  background-color:rgba(217,255,82,.052)!important;
  box-shadow:0 7px 22px rgba(0,0,0,.10)!important;
}
.article-page .article-toc a.active::before{
  opacity:1!important;
  transform:scaleY(1)!important;
  box-shadow:0 0 12px rgba(217,255,82,.24)!important;
}
.article-page .article-toc a.active::after{
  opacity:.78!important;
  transform:translateX(0)!important;
}
.article-page .article-toc a.active:hover{
  color:#e2ff78!important;
  background-color:rgba(217,255,82,.07)!important;
}
@media(prefers-reduced-motion:reduce){
  .article-page .article-toc a,
  .article-page .article-toc a::before,
  .article-page .article-toc a::after{transition:none!important;scroll-behavior:auto!important}
}


/* v112 — keep article TOC inside its grid column all the way to the footer.
   The old JS fixed/absolute fallback could overlap the final section. */
@media (min-width:981px){
  .article-page .article-layout{
    position:relative!important;
    align-items:start!important;
    overflow:visible!important;
  }
  .article-page .article-toc,
  .article-page .article-toc.toc-fixed-v107,
  .article-page .article-toc.toc-bottom-v107{
    position:sticky!important;
    top:92px!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:auto!important;
    margin:0!important;
    align-self:start!important;
    z-index:8!important;
    max-height:calc(100vh - 116px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  .article-page .article-body{
    min-width:0!important;
  }
}

/* v139 global typography coverage */
body{font-family:var(--cms-font-en,Inter,sans-serif)}
:where(.section-label,.eyebrow,.meta,.article-meta,.service-kicker,.work-index,.global-footer-meta,.global-footer-brand>span,.global-footer-social>span,.global-footer-time>span){font-size:var(--cms-small-size,12px)!important}
:where(button,.btn,.cta,.hero-cta,.service-cta,.planner-next,.planner-submit,.feedback-arrow){font-size:var(--cms-button-size,14px)!important}
:where(.global-footer-social a,.global-footer-meta,.global-footer-time,.global-footer-brand>span){font-size:var(--cms-footer-size,14px)!important}


/* v140 footer descriptor — slightly quieter beneath the logo for better proportion. */
.global-footer-brand>span{font-size:10px!important;line-height:1.45!important;letter-spacing:.075em!important}
@media(max-width:640px){.global-footer-brand>span{font-size:9px!important;letter-spacing:.065em!important}}

/* v154 — Typography Studio controls for individual service detail pages.
   Defaults mirror the existing service theme, so saving typography does not change the visual until adjusted. */
.service-hero h1,
.service-proof h2,
.service-statement blockquote,
.service-section-head h2,
.process-row h3,
.service-start-card h3,
.service-faq summary,
.service-work-copy h3,
.service-final h2{
  font-family:var(--single-service-heading-font,"Space Grotesk",sans-serif)!important;
}
.service-intro,
.service-proof p,
.process-row p,
.service-start-card p,
.service-faq details p,
.service-work-copy p,
.deliverable-grid strong,
.service-hero-cta,
.service-final a{
  font-family:var(--single-service-body-font,Manrope,sans-serif)!important;
}
.service-hero h1{
  font-size:clamp(var(--single-service-hero-min,64px),var(--single-service-hero-fluid,9vw),var(--single-service-hero-max,150px))!important;
}
.service-intro{
  font-size:clamp(var(--single-service-intro-min,19px),var(--single-service-intro-fluid,1.6vw),var(--single-service-intro-max,25px))!important;
}
.service-proof h2{
  font-size:clamp(var(--single-service-proof-min,26px),var(--single-service-proof-fluid,2.1vw),var(--single-service-proof-max,36px))!important;
}
.service-statement blockquote{
  font-size:clamp(var(--single-service-statement-min,36px),var(--single-service-statement-fluid,4.6vw),var(--single-service-statement-max,72px))!important;
}
.service-section-head h2{
  font-size:clamp(var(--single-service-section-min,40px),var(--single-service-section-fluid,4.5vw),var(--single-service-section-max,68px))!important;
}
.process-row h3{
  font-size:clamp(var(--single-service-process-min,24px),var(--single-service-process-fluid,2.5vw),var(--single-service-process-max,39px))!important;
}
.service-proof p,
.process-row p,
.service-start-card p,
.service-faq details p{
  font-size:var(--single-service-body-size,15px)!important;
}
.service-faq summary{font-size:var(--single-service-faq-size,18px)!important}
.service-work-copy h3{font-size:var(--single-service-work-title-size,20px)!important}

/* v159 — Single Service Typography Studio: exact px controls that override service.css reliably. */
body .service-hero h1{font-size:var(--single-service-hero-size,130px)!important}
body .service-hero .service-intro{font-size:var(--single-service-intro-size,23px)!important}
body .service-proof article h2{font-size:var(--single-service-proof-size,32px)!important}
body .service-statement blockquote{font-size:var(--single-service-statement-size,64px)!important}
body .service-section .service-section-head>span,
body .service-work-showcase .service-section-head>span,
body .service-faq .service-section-head>span{font-size:var(--single-service-label-size,10px)!important}
body .service-section .service-section-head>h2,
body .service-work-showcase .service-section-head>h2,
body .service-faq .service-section-head>h2{font-size:var(--single-service-section-size,60px)!important}
body .service-section .process-list .process-row h3{font-size:var(--single-service-process-size,34px)!important}
body .service-proof article p,
body .service-section .process-list .process-row p,
body .service-start-card p,
body .service-faq details p{font-size:var(--single-service-body-size,15px)!important}
body .service-faq details summary{font-size:var(--single-service-faq-size,18px)!important}
body .service-work-showcase .service-work-copy h3{font-size:var(--single-service-work-title-size,20px)!important}

/* Keep user-selected desktop px values exact; cap only when the viewport becomes smaller. */
@media(max-width:900px){
 body .service-hero h1{font-size:min(var(--single-service-hero-size,130px),12vw)!important}
 body .service-hero .service-intro{font-size:min(var(--single-service-intro-size,23px),3.4vw)!important}
 body .service-proof article h2{font-size:min(var(--single-service-proof-size,32px),5.4vw)!important}
 body .service-statement blockquote{font-size:min(var(--single-service-statement-size,64px),8.5vw)!important}
 body .service-section .service-section-head>h2,
 body .service-work-showcase .service-section-head>h2,
 body .service-faq .service-section-head>h2{font-size:min(var(--single-service-section-size,60px),8vw)!important}
 body .service-section .process-list .process-row h3{font-size:min(var(--single-service-process-size,34px),5.6vw)!important}
}
@media(max-width:620px){
 body .service-hero h1{font-size:min(var(--single-service-hero-size,130px),13vw)!important}
 body .service-hero .service-intro{font-size:min(var(--single-service-intro-size,23px),4.5vw)!important}
 body .service-proof article h2{font-size:min(var(--single-service-proof-size,32px),7vw)!important}
 body .service-statement blockquote{font-size:min(var(--single-service-statement-size,64px),9.5vw)!important}
 body .service-section .service-section-head>h2,
 body .service-work-showcase .service-section-head>h2,
 body .service-faq .service-section-head>h2{font-size:min(var(--single-service-section-size,60px),9vw)!important}
 body .service-section .process-list .process-row h3{font-size:min(var(--single-service-process-size,34px),7vw)!important}
}


/* v160 — Typography Studio exact-pixel controls across all public page groups. */
/* Global sizes */
body{font-size:var(--cms-base-size,16px);line-height:var(--cms-body-lh,1.7)}
body header nav a,
body .main-nav a,
body .site-nav a,
body .blog-nav-links a,
body .service-nav nav a{font-size:var(--cms-nav-size,13px)!important}
body :where(.section-label,.eyebrow,.meta,.article-meta,.article-meta-line,.archive-kicker,.service-kicker,.work-index,.global-footer-meta,.global-footer-social>span,.global-footer-time>span){font-size:var(--cms-small-size,12px)!important}
body :where(button,.btn,.cta,.hero-cta,.service-cta,.planner-next,.planner-submit,.feedback-arrow){font-size:var(--cms-button-size,14px)!important}
body :where(.global-footer-social a,.global-footer-meta,.global-footer-time){font-size:var(--cms-footer-size,14px)!important}

/* Homepage — exact desktop values. */
.cms-homepage .hero-title{font-size:var(--home-hero-size,245px)!important}
.cms-homepage .statement h2,
.cms-homepage .work-head h2,
.cms-homepage .mentor h2,
.cms-homepage .manifesto h2,
.cms-homepage .services-head h2,
.cms-homepage .proof-head h2,
.cms-homepage .planner-intro h2{font-size:var(--home-section-size,145px)!important}
.cms-homepage .work-head p,
.cms-homepage .project-title p,
.cms-homepage .mentor-right p,
.cms-homepage .home-blog-card p,
.cms-homepage .services-head>p,
.cms-homepage .service-card p,
.cms-homepage .proof-head>p,
.cms-homepage .planner-intro>p{font-size:var(--home-body-size,16px)!important}

/* Blog archive */
.cms-blog-archive .archive-card h2,
.cms-blog-archive .archive-card h3,
.cms-blog-archive .blog-card h2,
.cms-blog-archive .blog-card h3{font-size:var(--blog-card-title-size,34px)!important}
.cms-blog-archive .archive-card p,
.cms-blog-archive .blog-card p{font-size:var(--blog-excerpt-size,16px)!important}

/* Single blog */
.cms-single-blog .article-hero h1,
.cms-single-blog .article-title{font-size:var(--single-blog-title-size,95px)!important}
.cms-single-blog .article-body{font-size:var(--single-blog-body-size,18px)!important}
.cms-single-blog .article-body h2{font-size:var(--single-blog-h2-size,43px)!important}
.cms-single-blog .article-body h3{font-size:var(--single-blog-h3-size,29px)!important}

/* Responsive caps: desktop remains exact; smaller screens stay readable without overflow. */
@media(max-width:900px){
 .cms-homepage .hero-title{font-size:min(var(--home-hero-size,245px),22vw)!important}
 .cms-homepage .statement h2,
 .cms-homepage .work-head h2,
 .cms-homepage .mentor h2,
 .cms-homepage .manifesto h2,
 .cms-homepage .services-head h2,
 .cms-homepage .proof-head h2,
 .cms-homepage .planner-intro h2{font-size:min(var(--home-section-size,145px),16vw)!important}
 .cms-blog-archive .archive-card h2,
 .cms-blog-archive .archive-card h3{font-size:min(var(--blog-card-title-size,34px),7vw)!important}
 .cms-single-blog .article-hero h1,
 .cms-single-blog .article-title{font-size:clamp(44px,12vw,var(--single-blog-title-size,95px))!important}
 .cms-single-blog .article-body h2{font-size:min(var(--single-blog-h2-size,43px),7vw)!important}
 .cms-single-blog .article-body h3{font-size:min(var(--single-blog-h3-size,29px),5.8vw)!important}
}
@media(max-width:620px){
 .cms-homepage .hero-title{font-size:min(var(--home-hero-size,245px),22vw)!important}
 .cms-homepage .statement h2,
 .cms-homepage .work-head h2,
 .cms-homepage .mentor h2,
 .cms-homepage .manifesto h2,
 .cms-homepage .services-head h2,
 .cms-homepage .proof-head h2,
 .cms-homepage .planner-intro h2{font-size:min(var(--home-section-size,145px),15vw)!important}
 .cms-blog-archive .archive-card h2,
 .cms-blog-archive .archive-card h3{font-size:min(var(--blog-card-title-size,34px),8vw)!important}
 .cms-single-blog .article-body h2{font-size:min(var(--single-blog-h2-size,43px),8.5vw)!important}
 .cms-single-blog .article-body h3{font-size:min(var(--single-blog-h3-size,29px),7vw)!important}
}


/* v162 — one exact Typography Studio size for every Single Service section subtitle. */
body .service-section .service-section-head>span,
body .service-work-showcase .service-section-head>span,
body .service-faq .service-section-head>span,
body .service-final>span{
  font-family:"DM Mono",monospace!important;
  font-size:var(--single-service-label-size,10px)!important;
  line-height:1.2!important;
  letter-spacing:.1em!important;
}

/* v164 — dedicated single-service hero top-label typography */
body .service-hero .service-eyebrow{font-size:var(--single-service-hero-label-size,10px)!important}

/* v164 — reliable project-inquiry submit feedback */
.planner-submit-status{margin:12px 0 0;font:600 12px/1.45 Manrope,sans-serif;color:#9aa3a8;min-height:18px}
.planner-submit-status.is-ok{color:#d9ff52}
.planner-submit-status.is-error{color:#ff8fa3}
.planner-submit:disabled{opacity:.66;cursor:wait;transform:none!important}

/* v171 — invisible form guard + responsive Google reCAPTCHA placement */
.portfolio-honeypot-v171{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
.planner-captcha-v171{min-height:78px;margin:20px 0 0;display:flex;align-items:center;justify-content:flex-start;overflow:hidden}
@media(max-width:380px){.planner-captcha-v171{width:270px;min-height:70px}.planner-captcha-v171>div{transform:scale(.88);transform-origin:left center}}

/* v173 — safe editable footer developer credit link */
.footer-credit-link-v173{color:inherit;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.28);padding-bottom:1px;transition:color .18s ease,border-color .18s ease}
.footer-credit-link-v173:hover{color:#d9ff52;border-color:#d9ff52}