/* extracted 67-70 */

/* ============ GRID ============ */
.container{max-width:1500px;margin:0 auto}
.g12{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(16px,1.8vw,28px)}


/* extracted 448-485 */

/* ============ SERVICES ============ */
.services{background:var(--ink);padding:120px var(--pad-x) 140px}
.sec-head .label{display:block;margin-bottom:22px}
.services h2{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(40px,3.7vw,64px);line-height:.98;letter-spacing:.005em;
  max-width:20ch;margin-bottom:clamp(80px,7vw,100px);
}
.svc{border-top:1px solid var(--line-d);position:relative}
.svc:last-of-type{border-bottom:1px solid var(--line-d)}
.svc::before{content:'';position:absolute;inset:0;background:var(--red);transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease-inout);z-index:0}
.svc:hover::before{transform:scaleY(1)}
.svc a{
  position:relative;z-index:1;
  display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(16px,1.8vw,28px);
  align-items:center;
  padding:54px clamp(20px,2.2vw,32px) 50px;
}
.svc-num{
  grid-column:1/2;
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(20px,1.8vw,28px);
  color:transparent;-webkit-text-stroke:1.2px var(--red);
  transition:color var(--dur-micro) ease,-webkit-text-stroke var(--dur-micro) ease;
}
.svc-title{
  grid-column:2/8;font-family:var(--font-display);font-weight:700;
  font-size:clamp(58px,5.4vw,92px);line-height:.92;white-space:nowrap;
  transition:color var(--dur-micro) ease;
}
.svc-title small{display:block;font-family:var(--font-body);font-weight:600;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--grey-d);margin-top:12px;white-space:normal;transition:color var(--dur-micro) ease}
.svc-desc{grid-column:8/12;margin-left:clamp(8px,1.6vw,24px);color:var(--grey-d);font-size:clamp(16px,1vw,17px);line-height:1.5;max-width:44ch;transition:color var(--dur-micro) ease}
.svc-arrow{grid-column:12/13;justify-self:end;width:30px;height:30px;color:var(--red);transition:color var(--dur-micro) ease,transform var(--dur-micro) var(--ease-out)}
.svc:hover .svc-num{color:var(--ink);-webkit-text-stroke:1.2px var(--ink)}
.svc:hover .svc-title{color:var(--ink)}
.svc:hover .svc-title small{color:rgba(20,20,20,.7)}
.svc:hover .svc-desc{color:rgba(20,20,20,.8)}
.svc:hover .svc-arrow{color:var(--ink);transform:translate(4px,-4px)}

/* extracted 489-491 */

.work h2{max-width:16ch}
.sec-head--split{display:flex;justify-content:space-between;align-items:flex-start;gap:32px}
.sec-head--split .work-more{margin-top:2px;flex-shrink:0}

/* extracted 710-871 */

/* ============ PRODUCT SERVICE PAGE ============ */
:root{--product-bg:#181A1B;--product-accent:#668CA3}
.product-page{background:var(--product-bg)}
/* Product route uses the slate-blue service signal fixed during tint testing. */
.product-page .label--red{color:var(--product-accent)}
.product-page .btn--red{background:var(--product-accent);color:var(--ink)}
.product-page .tlink::after{background:var(--product-accent)}
.product-page .tlink .uc{fill:var(--product-accent)}
.product-page .cs-project-tags,.product-page .cs-kpi-value{color:var(--product-accent)}
.product-page .c-input::after{background:var(--product-accent)}
.nav.service-route-product .nav-links>a[data-page="product"].active::after{background:var(--product-accent)}

/* HERO — homepage composition language with Product-specific copy. */
.product-hero{background:var(--product-bg);padding:clamp(118px,8.4vw,142px) var(--pad-x) clamp(46px,4.5vw,66px);min-height:clamp(700px,92svh,940px);display:flex;overflow:hidden}
.product-hero-grid{position:relative;width:100%;grid-template-rows:auto auto;row-gap:0;align-items:start}
.product-hero-main{grid-column:1/13;grid-row:1;align-self:start}
.product-hero-main .label{display:block;margin-bottom:22px}
.product-hero h1{font-size:clamp(48px,4.8vw,76px);line-height:.99;letter-spacing:.005em;max-width:none}
.product-hero h1 .hl>span{white-space:nowrap}
.product-hero-side{grid-column:1/5;grid-row:2;align-self:start;margin-top:clamp(34px,3.3vw,48px);max-width:39ch}
.product-hero-side p{color:var(--grey-d);font-size:clamp(16px,1.06vw,18px);line-height:1.52;margin-bottom:28px}
.product-hero-actions{display:flex;flex-direction:column;align-items:flex-start;gap:15px}
.product-hero-media{grid-column:5/13;grid-row:2;align-self:start;justify-self:end;width:90%;margin-top:clamp(20px,2.3vw,34px);padding-bottom:4px}
.product-hero-video-wrap{width:100%;aspect-ratio:16/9;overflow:hidden;clip-path:inset(0 0 0 100%);transition:clip-path 1.1s var(--ease-inout) .3s}
.product-hero-video{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.04);transition:transform 1.4s var(--ease-inout) .3s}
.product-hero.reveal .product-hero-video-wrap{clip-path:inset(0 0 0 0)}
.product-hero.reveal .product-hero-video{transform:scale(1)}

/* WHAT WE BUILD — homepage service-row geometry, simplified for Product capability density. */
.product-build{background:var(--ink);padding:clamp(112px,10vw,148px) var(--pad-x)}
.product-sec-head .label{display:block;margin-bottom:22px}
.product-sec-head h2{max-width:none;margin-bottom:clamp(70px,6vw,94px)}
.product-build .product-sec-head h2 .hl>span{white-space:nowrap}
.product-services{border-bottom:1px solid var(--line-d)}
.product-svc a{grid-template-columns:repeat(12,minmax(0,1fr));padding:50px clamp(18px,1.7vw,26px) 48px;align-items:center;min-width:0}
.product-svc .svc-num{grid-column:1/2;color:transparent;-webkit-text-stroke:1.2px var(--product-accent)}
.product-svc .svc-title{grid-column:2/8;min-width:0;margin:0;font-size:clamp(42px,3.35vw,62px);line-height:.94;white-space:normal}
.product-svc-name{display:block;max-width:13ch;overflow-wrap:normal;word-break:normal}
.product-svc .svc-title small{font-family:var(--font-body);font-weight:600;font-size:11px;line-height:1.42;letter-spacing:.18em;text-transform:uppercase;color:var(--grey-d);margin-top:14px;max-width:38ch;white-space:normal}
.product-svc-summary{grid-column:8/12;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin:0;color:var(--grey-d);font-size:clamp(13px,.9vw,14.5px);line-height:1.38;transition:color var(--dur-micro) ease}
.product-svc-summary span{position:relative;min-width:0;padding-left:14px;overflow-wrap:anywhere}
.product-svc-summary span::before{content:'—';position:absolute;left:0;color:var(--product-accent);transition:color var(--dur-micro) ease}
.product-svc .svc-arrow{grid-column:12/13;justify-self:end;width:30px;height:30px;color:var(--product-accent);transition:color var(--dur-micro) ease,transform var(--dur-micro) var(--ease-out)}
/* Keep the approved homepage hover itself UCENA red. */
.product-svc:hover .svc-num{color:var(--ink);-webkit-text-stroke:1.2px var(--ink)}
.product-svc:hover .product-svc-summary{color:rgba(20,20,20,.78)}
.product-svc:hover .product-svc-summary span::before{color:var(--ink)}
.product-svc:hover .svc-arrow{color:var(--ink);transform:translate(4px,-4px)}

/* HOW WE WORK — same line, circular nodes and thin SVG family as homepage. */
.product-how{background:var(--product-bg);padding:clamp(112px,10vw,150px) var(--pad-x) clamp(126px,11vw,168px)}
.product-how .product-sec-head h2{margin-bottom:clamp(66px,5.5vw,82px)}
.product-process{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(54px,6vw,92px);padding-top:0}
.product-process .steps-line{position:absolute;top:112px;left:0;width:100%;height:1px;background:rgba(235,235,235,.14)}
.product-process .steps-line-fill{position:absolute;inset:0 auto 0 0;width:0;height:100%;background:var(--product-accent);transition:width .45s linear}
.product-process .step{width:auto;max-width:none;min-width:0}
.product-process .step-node{border-radius:50%}
.product-process .step-ill{height:88px;margin-bottom:24px}
.product-process .step-ill svg .reddot{fill:var(--product-accent)}
.product-process .step em{color:transparent;-webkit-text-stroke:1.2px var(--product-accent);margin:34px 0 12px}
.product-process .step.current em{color:var(--product-accent)}
.product-process .step.current .step-node{background:var(--product-accent);box-shadow:0 0 0 6px rgba(102,140,163,.18)}
.product-process .step.completed .step-node{background:rgba(235,235,235,.5)}
.product-process .step.current .step-ill svg .reddot{opacity:1}
.product-process .step b{font-size:clamp(18px,1.5vw,20px)}
.product-process .step p{font-size:clamp(15.5px,1vw,17px);max-width:33ch}

/* SELECTED WORK — exact Case Studies archive grid: wide/compact, then compact/wide. */
.product-work{background:var(--ink2);padding:clamp(116px,10.5vw,154px) var(--pad-x) clamp(130px,12vw,180px)}
.product-work .product-sec-head h2{max-width:18ch;margin-bottom:0}
.product-work-more{margin-top:2px;flex-shrink:0}
.product-cs-grid{margin-top:clamp(78px,7vw,104px)}
.product-cs-grid .product-case{cursor:pointer}
.product-cs-grid .product-case:focus-visible{outline:2px solid var(--product-accent);outline-offset:8px}

/* CONSULTATION — strong red closing field, CTA-like but with the full form. */
.product-consultation{background:var(--red);color:var(--ink);padding:clamp(116px,10vw,152px) var(--pad-x) clamp(126px,11vw,168px)}
.product-consultation-grid{align-items:start;row-gap:54px}
.product-consultation-head{grid-column:1/6;position:static;align-self:start;padding-right:clamp(28px,4vw,64px)}
.product-consultation-head .label{display:block;margin-bottom:22px;color:var(--ink)!important}
.product-consultation-head h2{font-size:clamp(48px,4.35vw,70px);line-height:1.01;max-width:10ch;color:var(--ink)}
.product-consultation-head h2 .hl>span{white-space:normal}
.product-form{grid-column:7/13;min-width:0}
.c-field select{width:100%;height:48px;padding:0 2px;background:transparent;border:0;border-radius:0;color:var(--paper);font:400 16px/1.2 var(--font-body);cursor:pointer;color-scheme:dark}
.c-field select:focus{outline:0}
.c-field select option{background:var(--ink2);color:var(--paper)}
.product-form .c-submit-row{align-items:center}
.product-form button[disabled]{opacity:.55;cursor:default}

@media(max-width:1100px){
  .product-hero-main{grid-column:1/9}
  .product-hero-media{width:100%}
  .product-svc a{row-gap:18px}
  .product-svc .svc-num{grid-column:1/2;grid-row:1}
  .product-svc .svc-title{grid-column:1/8;grid-row:2;font-size:clamp(40px,5vw,56px)}
  .product-svc-summary{grid-column:8/12;grid-row:2;align-self:end}
  .product-svc .svc-arrow{grid-column:12/13;grid-row:2;align-self:center}
  .product-process{column-gap:34px}
  .product-consultation-head{grid-column:1/6}
  .product-form{grid-column:6/13}
}
@media(max-width:900px){
  .product-hero{min-height:auto;padding-top:112px;padding-bottom:80px}
  .product-hero-main{grid-column:1/13}
  .product-hero-side{grid-column:1/6;margin-top:52px}
  .product-hero-media{grid-column:6/13;margin-top:48px}
  .product-process{column-gap:24px}
  .product-consultation-grid{display:block}
  .product-consultation-head{padding-right:0;margin-bottom:58px}
  .product-form{width:100%}
}
@media(max-width:767px){
  .product-hero{padding:104px 22px 74px}
  .product-hero-grid{display:block}
  .product-hero h1{font-size:clamp(39px,10.6vw,52px);max-width:none}
  .product-hero h1 .hl>span{white-space:normal}
  .product-hero-side{width:100%;max-width:none;margin-top:42px}
  .product-hero-side p{max-width:none;margin-bottom:26px}
  .product-hero-media{width:100%;margin-top:34px;padding:0}
  .product-hero-video-wrap{aspect-ratio:4/3;clip-path:inset(0 0 0 0)}
  .product-build,.product-how,.product-work,.product-consultation{padding-left:22px;padding-right:22px}
  .product-build{padding-top:88px;padding-bottom:94px}
  .product-how{padding-top:88px;padding-bottom:104px}
  .product-work{padding-top:92px;padding-bottom:110px}
  .product-consultation{padding-top:90px;padding-bottom:106px}
  .product-sec-head h2{font-size:clamp(38px,9.4vw,48px);margin-bottom:56px}
  .product-svc a{display:grid;grid-template-columns:1fr;padding:34px 0 36px;row-gap:13px}
  .product-svc .svc-num{grid-column:1;grid-row:1;font-size:19px}
  .product-svc .svc-title{grid-column:1;grid-row:2;font-size:clamp(31px,8.5vw,40px);margin:0}
  .product-svc-name{max-width:none}
  .product-svc .svc-title small{font-size:10.5px;margin-top:10px}
  .product-build .product-sec-head h2 .hl>span{white-space:normal}
  .product-svc-summary{grid-column:1;grid-row:3;gap:7px;margin-top:4px;font-size:13px}
  .product-svc .svc-arrow{grid-column:1;grid-row:4;justify-self:start;width:24px;height:24px;margin-top:7px}
  /* Stack process vertically on mobile; preserve homepage node geometry, simplify animation. */
  .product-process{display:grid;grid-template-columns:1fr;row-gap:0;padding-left:30px}
  .product-process .steps-line{left:3px;right:auto;top:0;bottom:0;width:1px;height:100%}
  .product-process .steps-line-fill{width:100%;height:0;transition:height .45s linear}
  .product-process .step{padding:0 0 54px 12px}
  .product-process .step:last-child{padding-bottom:0}
  .product-process .step-ill{height:76px;margin-bottom:18px}
  .product-process .step-node{top:94px;left:-30px}
  .product-process .step em{margin:28px 0 10px}
  .product-cs-grid{display:block;margin-top:58px}
  .product-cs-grid .cs-project{margin-bottom:56px}
  .product-cs-grid .cs-project:last-child{margin-bottom:0}
  .product-cs-grid .cs-project .cs-media{clip-path:inset(0 0 0 0)!important}
  .product-consultation-head{margin-bottom:50px}
  .product-consultation-head h2{font-size:clamp(38px,9.5vw,48px)}
  .product-consultation-head h2 .hl>span{white-space:normal}
  .product-form .c-row2{grid-template-columns:1fr;gap:30px}
  .product-form .c-submit-row{align-items:flex-start;flex-direction:column;gap:16px}
}
@media(prefers-reduced-motion:reduce){
  .product-hero-video-wrap{clip-path:inset(0 0 0 0)!important;transition:none!important}
  .product-hero-video{transform:none!important;transition:none!important}
  .product-process .steps-line-fill{width:100%!important;height:100%!important;transition:none!important}
  .product-process .step-node{box-shadow:none!important}
  .product-cs-grid .cs-project{opacity:1!important;transform:none!important}
  .product-cs-grid .cs-media{clip-path:inset(0 0 0 0)!important}
  .product-cs-grid .cs-media-inner{transform:none!important}
}

/* extracted 1238-1325 */

  .ph img,.ph video{transform:none!important}
  .sys-state{transition:none}
  .il .il-svg{clip-path:inset(0 0 0 0)!important;transition:none!important}
  .il{transition:none!important}
  .m-visual{clip-path:inset(0 0 0 0)!important}
  .m-img{transform:none!important;opacity:1!important}
  .cta-arrow-field *{transition:none}
  html{scroll-behavior:auto}
}




/* ============ INSIGHTS — EDITORIAL ARCHIVE ============ */
.insights-page{background:var(--ink2);min-height:100vh}
.insights-intro{min-height:clamp(390px,46vw,540px)}
/* Let the authored hero lines use the archive grid width. The previous 12ch cap
   clipped the longer second line inside the headline mask. */
.insights-intro .cs-intro-copy{grid-column:1/12;min-width:0}
.insights-intro h1{font-size:clamp(42px,4.55vw,70px);width:100%;max-width:none}
.insights-intro h1 .hl{width:100%;max-width:100%}
.insights-intro h1 .hl>span{white-space:nowrap}
.insights-filter-shell .cs-filter-groups{grid-column:1/11}
.insights-filter-shell .cs-filter-row{grid-template-columns:82px minmax(0,1fr)}
.insights-filter-shell .cs-filter-meta{grid-column:11/13}
.insights-card{cursor:default}
/* Insight headlines are editorial reading titles, not display moments. Hanken
   keeps long article names readable while Bristone remains reserved for the page hero. */
.insights-card .cs-project-name{
  font-family:var(--font-body);font-weight:600;
  font-size:clamp(24px,2vw,32px);line-height:1.14;letter-spacing:-.018em;
  max-width:27ch;
}
.insights-card.cs-pos-2 .cs-project-name{font-size:clamp(22px,1.75vw,28px);max-width:22ch}
.insight-read-time{
  margin-top:14px;color:var(--grey-d);font:600 10.5px/1.2 var(--font-body);
  letter-spacing:.13em;text-transform:uppercase;
}
.insights-card .cs-project-tags{margin-bottom:12px}
.insights-card .cs-media-inner{transform:scale(1)}
.insights-card:hover .cs-media-inner{transform:scale(1.02)}

.insights-newsletter{
  background:var(--red);color:var(--ink);padding:clamp(88px,9vw,132px) var(--pad-x);
}
.insights-newsletter .container{align-items:start}
.insights-newsletter-copy{grid-column:1/7}
.insights-newsletter-copy .label{color:var(--ink);margin-bottom:18px;display:block}
.insights-newsletter h2{font-size:clamp(42px,4.5vw,68px);line-height:.98;max-width:10ch;color:var(--ink)}
.insights-newsletter-form{grid-column:8/13;align-self:end;padding-top:clamp(36px,5vw,72px)}
.insights-newsletter-field{display:block;border-bottom:1px solid rgba(20,20,20,.38);padding-bottom:12px}
.insights-newsletter-field span{display:block;font:600 10.5px/1.2 var(--font-body);letter-spacing:.15em;text-transform:uppercase;margin-bottom:9px}
.insights-newsletter-field input{
  width:100%;border:0;outline:0;background:transparent;color:var(--ink);
  font:500 clamp(18px,1.45vw,22px)/1.35 var(--font-body);padding:0 0 4px;
}
.insights-newsletter-field input::placeholder{color:rgba(20,20,20,.5)}
.insights-newsletter-field:focus-within{border-bottom-color:var(--ink)}
.insights-newsletter-actions{display:flex;align-items:center;gap:18px;margin-top:24px;flex-wrap:wrap}
.insights-newsletter .btn{background:var(--ink);color:var(--paper)}
.insights-newsletter .btn::before{background:var(--paper)}
.insights-newsletter .btn:hover{color:var(--ink)}
.insights-newsletter-note{font-size:12px;color:rgba(20,20,20,.64);min-height:1.2em}

@media (min-width:768px) and (max-width:1100px){
  .insights-intro .cs-intro-copy{grid-column:1/12}
  .insights-intro h1{font-size:clamp(40px,5.45vw,58px)}
  .insights-filter-shell .cs-filter-groups{grid-column:1/10}
  .insights-filter-shell .cs-filter-meta{grid-column:10/13}
  .insights-newsletter-copy{grid-column:1/7}
  .insights-newsletter-form{grid-column:7/13}
}

@media(max-width:767px){
  .insights-intro{min-height:0;padding-bottom:46px}
  .insights-intro .cs-intro-copy{width:100%}
  .insights-intro h1{font-size:clamp(34px,10vw,45px);line-height:1;max-width:none}
  .insights-intro h1 .hl>span{white-space:normal}
  .insights-filter-shell .cs-filter-row{display:block}
  .insights-card .cs-project-name,.insights-card.cs-pos-2 .cs-project-name{font-size:clamp(23px,7vw,29px);line-height:1.16;max-width:27ch}
  .insight-read-time{margin-top:12px;font-size:10px}
  .insights-newsletter{padding:76px 22px 82px}
  .insights-newsletter .container{display:block}
  .insights-newsletter-copy,.insights-newsletter-form{width:100%}
  .insights-newsletter h2{font-size:clamp(38px,11vw,50px);max-width:8ch}
  .insights-newsletter-form{padding-top:44px}
  .insights-newsletter-actions{align-items:flex-start;flex-direction:column}
  .insights-newsletter .btn{width:100%;justify-content:center}
}

/* extracted 1331-1465 */

/* ============ INSIGHT DETAIL — EDITORIAL ARTICLE ============ */
.insight-detail-page{background:var(--ink2);color:var(--paper);min-height:100vh}
.insight-detail-hero{padding:clamp(142px,14vw,206px) var(--pad-x) clamp(70px,8vw,112px)}
.insight-detail-hero-grid{align-items:end}
.insight-detail-back{grid-column:1/4;align-self:start;display:inline-flex;align-items:center;gap:10px;color:var(--grey-d);font:600 12px/1.2 var(--font-body);text-decoration:none}
.insight-detail-back .uc{width:11px;height:11px;transform:rotate(225deg)}
.insight-detail-meta{grid-column:1/3;margin-top:clamp(62px,8vw,110px)}
.insight-detail-meta .label{display:block;margin-bottom:12px}
.insight-detail-read{display:block;font:600 10.5px/1.2 var(--font-body);letter-spacing:.13em;text-transform:uppercase;color:var(--grey-d)}
.insight-detail-author{display:block;margin-top:12px;font:500 12px/1.45 var(--font-body);color:rgba(235,235,235,.5)}
.insight-detail-author strong{font-weight:600;color:rgba(235,235,235,.82)}
.insight-detail-title-wrap{grid-column:3/13;min-width:0}
.insight-detail-title{font-family:var(--font-body);font-weight:600;font-size:clamp(48px,5.6vw,86px);line-height:.98;letter-spacing:-.045em;max-width:none;margin:0}
.insight-detail-media{padding:0 var(--pad-x)}
.insight-detail-media .container{max-width:1500px}
.insight-detail-media-frame{aspect-ratio:16/8.8;overflow:hidden;background:#111}
.insight-detail-media-frame img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.015);transition:transform 1s var(--ease-out)}
.insight-detail-media-frame:hover img{transform:scale(1.03)}
.insight-article{padding:clamp(90px,10vw,150px) var(--pad-x)}
.insight-article-grid{align-items:start}
.insight-article-rail{grid-column:1/4;position:sticky;top:120px}
.insight-article-rail .label{display:block;margin-bottom:16px}
.insight-article-rail p{max-width:24ch;color:var(--grey-d);font-size:13px;line-height:1.65}
.insight-toc-nav{display:flex;flex-direction:column;align-items:flex-start;border-top:1px solid var(--line-d);max-width:250px}
.insight-toc-link{appearance:none;border:0;border-bottom:1px solid var(--line-d);background:transparent;color:rgba(235,235,235,.46);width:100%;padding:11px 0;text-align:left;font:500 12px/1.35 var(--font-body);cursor:pointer;transition:color .25s ease,padding-left .25s ease}
.insight-toc-link[data-level="3"]{padding-left:13px;font-size:11px;color:rgba(235,235,235,.34)}
.insight-toc-link:hover,.insight-toc-link.is-active{color:var(--paper);padding-left:7px}
.insight-toc-link[data-level="3"]:hover,.insight-toc-link[data-level="3"].is-active{padding-left:19px;color:rgba(235,235,235,.78)}
.insight-toc-link.is-active::before{content:"—";display:inline-block;margin-right:11px;color:var(--red)}
.insight-article-copy{grid-column:5/11}
.insight-source-gap{border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d);padding:34px 0;color:var(--grey-d);font-size:clamp(17px,1.35vw,20px);line-height:1.6}
.insight-source-gap strong{display:block;color:var(--paper);font:600 11px/1.2 var(--font-body);letter-spacing:.15em;text-transform:uppercase;margin-bottom:12px}

.insight-article-copy{font-family:var(--font-body);font-size:clamp(17px,1.18vw,19px);line-height:1.76;color:var(--paper)}
.insight-article-copy .article-lead{font-size:clamp(22px,1.8vw,28px);line-height:1.48;letter-spacing:-.018em;color:var(--paper);margin:0 0 clamp(46px,5vw,70px)}
.insight-article-copy h2{font-family:var(--font-body);font-weight:600;font-size:clamp(30px,2.8vw,44px);line-height:1.12;letter-spacing:-.032em;color:var(--paper);margin:clamp(62px,7vw,94px) 0 24px;max-width:none;width:100%;scroll-margin-top:120px}
.insight-article-copy h3{font-family:var(--font-body);font-weight:600;font-size:clamp(21px,1.75vw,27px);line-height:1.25;letter-spacing:-.02em;color:var(--paper);margin:42px 0 14px;max-width:none;width:100%;scroll-margin-top:120px}
.insight-article-copy p{margin:0 0 26px;max-width:none;width:100%;color:rgba(235,235,235,.84)}
.insight-article-copy strong{font-weight:600;color:var(--paper)}
.insight-article-copy .article-pullquote{margin:clamp(54px,6vw,80px) 0;padding:0 0 0 clamp(22px,2.4vw,34px);border-left:2px solid var(--red);font-size:clamp(27px,2.6vw,40px);line-height:1.25;letter-spacing:-.032em;color:var(--paper);max-width:21ch}
.insight-article-copy .article-list{list-style:none;margin:34px 0 0;border-top:1px solid var(--line-d)}
.insight-article-copy .article-list li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:18px;padding:22px 0;border-bottom:1px solid var(--line-d);color:rgba(235,235,235,.82)}
.insight-article-copy .article-list li::before{content:attr(data-n);font:600 11px/1.4 var(--font-body);letter-spacing:.08em;color:var(--red);padding-top:4px}
.insight-article-copy .article-list strong{display:block;margin-bottom:4px;font-size:17px;line-height:1.35}
.insight-article-copy .article-note{margin:clamp(52px,6vw,78px) 0;padding:28px 0;border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d)}
.insight-article-copy .article-note .label{display:block;margin-bottom:14px;color:var(--red)}
.insight-article-copy .article-note p{font-size:clamp(18px,1.35vw,21px);line-height:1.58;margin:0;max-width:56ch;color:var(--paper)}
.insight-article-copy .article-bullets{margin:26px 0 38px;padding:0;list-style:none;max-width:63ch}
.insight-article-copy .article-bullets li{position:relative;padding:10px 0 10px 34px;color:rgba(235,235,235,.82);border-bottom:1px solid rgba(235,235,235,.08)}
.insight-article-copy .article-bullets li::before{content:"—";position:absolute;left:0;top:10px;color:var(--red)}
.insight-article-copy .article-ordered{counter-reset:article-step;list-style:none;margin:30px 0 46px;padding:0;border-top:1px solid var(--line-d)}
.insight-article-copy .article-ordered li{counter-increment:article-step;display:grid;grid-template-columns:42px minmax(0,1fr);gap:14px;padding:18px 0;border-bottom:1px solid var(--line-d);color:rgba(235,235,235,.82)}
.insight-article-copy .article-ordered li::before{content:counter(article-step,decimal-leading-zero);font:600 10.5px/1.4 var(--font-body);letter-spacing:.08em;color:var(--red);padding-top:3px}
.article-quote{margin:clamp(58px,6vw,82px) 0;padding:0}
.article-quote blockquote{margin:0;font:500 clamp(27px,2.6vw,40px)/1.25 var(--font-body);letter-spacing:-.032em;color:var(--paper);max-width:22ch}
.article-quote figcaption{margin-top:18px;font:600 10px/1.3 var(--font-body);letter-spacing:.13em;text-transform:uppercase;color:var(--grey-d)}
.article-quote::before{content:"“";display:block;color:var(--red);font:500 48px/1 var(--font-body);height:28px;margin-bottom:16px}
.article-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:clamp(52px,6vw,76px) 0;border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d)}
.article-stat{padding:22px 20px 23px 0;border-right:1px solid var(--line-d)}
.article-stat:last-child{border-right:0;padding-left:20px}
.article-stat:nth-child(2){padding-left:20px}
.article-stat strong{display:block;font:600 clamp(26px,2.3vw,36px)/1 var(--font-body);letter-spacing:-.035em;color:var(--paper);margin-bottom:8px}
.article-stat span{display:block;font:600 10px/1.4 var(--font-body);letter-spacing:.11em;text-transform:uppercase;color:var(--grey-d)}
.article-figure,.article-gallery{width:min(72vw,1040px);margin-left:50%;transform:translateX(-50%)}
.article-figure{margin-top:clamp(58px,7vw,92px);margin-bottom:clamp(58px,7vw,92px)}
.article-figure-media{overflow:hidden;background:#111;aspect-ratio:16/9}
.article-figure-media img,.article-gallery-media img{width:100%;height:100%;object-fit:cover;display:block}
.article-caption{display:flex;justify-content:space-between;gap:22px;margin-top:12px;color:var(--grey-d);font:500 10.5px/1.45 var(--font-body)}
.article-caption span:first-child{max-width:60ch}
.article-caption span:last-child{white-space:nowrap;text-transform:uppercase;letter-spacing:.1em;font-size:9.5px}
.article-gallery{display:grid;grid-template-columns:1.28fr .72fr;grid-template-rows:auto auto;gap:clamp(20px,1.6vw,28px);margin-top:clamp(60px,7vw,94px);margin-bottom:clamp(60px,7vw,94px)}
.article-gallery-item{margin:0;min-width:0}
.article-gallery-item:first-child{grid-row:1/3}
.article-gallery-media{overflow:hidden;background:#111;height:100%;min-height:220px}
.article-gallery-item:first-child .article-gallery-media{aspect-ratio:4/5}
.article-gallery-item:not(:first-child) .article-gallery-media{aspect-ratio:16/10}
.article-gallery .article-caption{display:block;margin-top:9px;font-size:10px}
.article-kicker{display:block;margin:0 0 13px;color:var(--red);font:600 10px/1.2 var(--font-body);letter-spacing:.14em;text-transform:uppercase}
.article-divider{height:1px;background:var(--line-d);border:0;margin:clamp(58px,7vw,88px) 0}
.insight-more{padding:0 var(--pad-x) clamp(100px,10vw,150px)}
.insight-more-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:34px}
.insight-more-head h2{font-size:clamp(38px,4vw,58px);line-height:1}
.insight-more-head .tlink{color:var(--paper)}
.insight-more-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2vw,30px)}
.insight-more-card{display:block;color:inherit;text-decoration:none;cursor:pointer}
.insight-more-media{aspect-ratio:16/9;overflow:hidden;background:#111;margin-bottom:18px}
.insight-more-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s var(--ease-out)}
.insight-more-card:hover img{transform:scale(1.02)}
.insight-more-meta{font:600 10px/1.2 var(--font-body);letter-spacing:.13em;text-transform:uppercase;color:var(--red);margin-bottom:9px}
.insight-more-title{font-family:var(--font-body);font-weight:600;font-size:clamp(22px,2vw,30px);line-height:1.14;letter-spacing:-.02em;max-width:28ch}
.insights-card[role="link"]{cursor:pointer}
.insights-card[role="link"]:focus-visible{outline:1px solid var(--red);outline-offset:8px}

@media(max-width:900px){
  .insight-detail-back{grid-column:1/5}
  .insight-detail-meta{grid-column:1/5}
  .insight-detail-title-wrap{grid-column:5/13}
  .insight-detail-title{font-size:clamp(44px,7vw,64px)}
  .insight-article-rail{grid-column:1/4}
  .insight-article-copy{grid-column:4/12}
}
@media(max-width:767px){
  .insight-detail-hero{padding:104px 22px 54px}
  .insight-detail-hero-grid{display:block}
  .insight-detail-back{margin-bottom:54px}
  .insight-detail-meta{margin:0 0 22px}
  .insight-detail-title{font-size:clamp(38px,11vw,50px);line-height:1.02;max-width:none;letter-spacing:-.035em}
  .insight-detail-media{padding:0 22px}
  .insight-detail-media-frame{aspect-ratio:4/3}
  .insight-article{padding:72px 22px 82px}
  .insight-article-grid{display:block}
  .insight-article-rail{position:static;margin-bottom:38px}
  .insight-article-copy{width:100%}
  .insight-source-gap{font-size:16px;padding:26px 0}

  .insight-article-copy{font-size:16.5px;line-height:1.72}
  .insight-article-copy .article-lead{font-size:21px;line-height:1.48;margin-bottom:48px}
  .insight-article-copy h2{font-size:30px;max-width:none;margin-top:58px}
  .insight-article-copy h3{font-size:22px;margin-top:34px;max-width:none}
  .insight-toc-nav{max-width:none;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line-d)}
  .insight-toc-link{padding:11px 10px 11px 0}
  .insight-toc-link:nth-child(odd){border-right:1px solid var(--line-d)}
  .insight-toc-link:nth-child(even){padding-left:12px}
  .insight-toc-link[data-level="3"]{display:none}
  .insight-toc-link:hover,.insight-toc-link.is-active{padding-left:0}
  .insight-toc-link:nth-child(even):hover,.insight-toc-link:nth-child(even).is-active{padding-left:12px}
  .insight-article-copy .article-pullquote{font-size:28px;max-width:none;margin:48px 0;padding-left:18px}
  .insight-article-copy .article-list li{grid-template-columns:26px minmax(0,1fr);gap:12px;padding:19px 0}
  .insight-article-copy .article-note{margin:48px 0;padding:24px 0}
  .article-quote blockquote{font-size:28px;max-width:none}
  .article-stats{grid-template-columns:1fr;margin:48px 0}
  .article-stat,.article-stat:nth-child(2),.article-stat:last-child{padding:17px 0;border-right:0;border-bottom:1px solid var(--line-d)}
  .article-stat:last-child{border-bottom:0}
  .article-figure,.article-gallery{width:100%;margin-left:0;transform:none}
  .article-figure{margin-top:52px;margin-bottom:52px}

/* extracted 1498-1578 */

.cs-intro h1 .hl>span{white-space:nowrap}
.cs-intro-sub{
  grid-column:8/13;grid-row:2;align-self:end;justify-self:end;
  color:var(--grey-d);font-size:clamp(16px,1.05vw,17.5px);line-height:1.52;
  max-width:38ch;padding-bottom:2px;
}

/* Case-study filters — compact two-dimension editorial filter. */
.cs-filter-shell{position:relative;z-index:2;background:var(--ink2);padding-inline:var(--pad-x)}
.cs-filter-inner{
  display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(16px,1.8vw,28px);
  align-items:start;padding-top:clamp(28px,2.5vw,36px);padding-bottom:clamp(28px,2.5vw,36px);
}
.cs-filter-groups{
  grid-column:1/12;display:flex;flex-direction:column;gap:clamp(16px,1.5vw,22px);min-width:0;
}
.cs-filter-row{
  min-width:0;display:grid;grid-template-columns:82px minmax(0,1fr);
  column-gap:clamp(18px,1.7vw,28px);align-items:start;
}
.cs-filter-label{
  display:block;color:var(--paper);font-size:14px;font-weight:600;line-height:1.25;letter-spacing:-.01em;
  white-space:nowrap;padding-top:1px;
}
.cs-filters{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px clamp(14px,1.25vw,22px);min-width:0}
.cs-filter{
  appearance:none;border:0;background:transparent;color:rgba(150,160,171,.72);font:500 13.5px/1.25 var(--font-body);
  letter-spacing:-.01em;cursor:pointer;padding:0;position:relative;text-align:left;white-space:nowrap;
  transition:color .2s ease;
}
.cs-filter:hover{color:var(--paper)}
.cs-filter.is-active{color:var(--red);font-weight:600}
.cs-filter:disabled,.cs-filter.is-unavailable{color:rgba(150,160,171,.24);cursor:default}
.cs-filter:disabled:hover,.cs-filter.is-unavailable:hover{color:rgba(150,160,171,.24)}
.cs-filter:focus-visible{outline:2px solid var(--red);outline-offset:4px}
.cs-filter-meta{
  grid-column:12/13;justify-self:end;display:flex;flex-direction:column;align-items:flex-end;gap:8px;min-width:max-content;
}
.cs-filter-clear{
  appearance:none;border:0;background:transparent;color:var(--grey-d);font:500 12px/1.2 var(--font-body);
  cursor:pointer;padding:0;transition:color .2s ease;white-space:nowrap;
}
.cs-filter-clear:hover{color:var(--red)}
.cs-filter-clear[hidden]{display:none}
.cs-count{color:var(--grey-d);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}

.cs-archive{padding:clamp(66px,6vw,92px) var(--pad-x) clamp(120px,12vw,180px)}
.cs-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(16px,1.8vw,28px);row-gap:clamp(72px,7vw,108px);align-items:start}
.cs-project{min-width:0;opacity:1;transform:translate3d(0,0,0);transition:opacity .22s ease,transform .38s var(--ease-out);will-change:transform,opacity}
.cs-project.is-fading{opacity:0;transform:scale(.985)}
.cs-project[hidden]{display:none!important}

/* Case archive reveal: same restrained clip + rise language used across UCENA. */
.cs-project.cs-reveal-target{opacity:0;transform:translateY(24px);transition:opacity .82s var(--ease-out),transform .82s var(--ease-out)}
.cs-project.cs-reveal-target .cs-media{transition:clip-path 1.02s var(--ease-inout)}
.cs-project.cs-reveal-target.cs-pos-1 .cs-media,
.cs-project.cs-reveal-target.cs-pos-3 .cs-media{clip-path:inset(0 100% 0 0)}
.cs-project.cs-reveal-target.cs-pos-2 .cs-media,
.cs-project.cs-reveal-target.cs-pos-4 .cs-media{clip-path:inset(0 0 0 100%)}
.cs-project.cs-reveal-target.cs-pos-5 .cs-media{clip-path:inset(0 0 100% 0)}
.cs-project.cs-reveal-target .cs-media-inner{transform:scale(1.035);transition:transform 1.15s var(--ease-out)}
.cs-project.cs-reveal-target .cs-project-meta{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease-out) .14s,transform .7s var(--ease-out) .14s}
.cs-project.cs-reveal-target.in{opacity:1;transform:none}
.cs-project.cs-reveal-target.in .cs-media{clip-path:inset(0 0 0 0)}
.cs-project.cs-reveal-target.in .cs-media-inner{transform:scale(1)}
.cs-project.cs-reveal-target.in .cs-project-meta{opacity:1;transform:none}
.cs-project.cs-reveal-target.in.is-fading{opacity:0;transform:scale(.985)}
.cs-project.cs-reveal-target.in:hover .cs-media-inner{transform:scale(1.02)}
.cs-pos-1{grid-column:1/9}
.cs-pos-2{grid-column:9/13}
.cs-pos-3{grid-column:1/5}
.cs-pos-4{grid-column:5/13}
.cs-pos-5{grid-column:1/13}

.cs-media{position:relative;overflow:hidden;background:var(--slate-2)}
.cs-media-inner{position:absolute;inset:0;transition:transform .48s var(--ease-out)}
.cs-media img,.cs-media video{width:100%;height:100%;object-fit:cover;display:block}
.cs-project:hover .cs-media-inner{transform:scale(1.02)}
/* restrained editorial proportions: asymmetry comes from column span, not excessive image height */
.cs-ratio-wide .cs-media{aspect-ratio:16/9.7}
.cs-ratio-compact .cs-media{aspect-ratio:4/3}

/* extracted 2561-2674 */

.csn-section-shell{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:stretch
}
.csn-section-rail{
  grid-column:1/3;position:relative;min-width:0
}
.csn-section-rail .csn-label{
  position:-webkit-sticky;
  position:sticky;
  top:var(--csn-sticky-top);
  z-index:5;
  width:max-content;
  max-width:100%;
  transition:opacity .3s ease
}

/* HERO */
.csn-hero{
  background:var(--ink2);
  padding:clamp(108px,7.7vw,132px) var(--pad-x) clamp(78px,7vw,108px)
}
.csn-hero-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-back{grid-column:1/4;width:max-content;margin-bottom:clamp(58px,6vw,86px)}
.csn-title{
  grid-column:1/12;margin:0;font-family:var(--font-display);font-weight:700;
  font-size:clamp(54px,6.15vw,96px);line-height:.97;letter-spacing:-.038em;
  text-transform:uppercase;color:var(--paper)
}
.csn-title .hl{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.csn-title .hl>span{
  display:block;transform:translateY(115%);
  transition:transform 1.05s var(--ease-out)
}
.csn-detail.is-ready .csn-title .hl>span{transform:none}
.csn-detail.is-ready .csn-title .hl:nth-child(1)>span{transition-delay:.06s}
.csn-detail.is-ready .csn-title .hl:nth-child(2)>span{transition-delay:.2s}
.csn-detail.is-ready .csn-title .hl:nth-child(3)>span{transition-delay:.34s}
.csn-hero-lower{
  grid-column:1/13;margin-top:clamp(44px,4.6vw,68px);
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-hero-copy{grid-column:1/6;padding-top:clamp(4px,.5vw,8px)}
.csn-intro{
  margin:0;font-family:var(--font-body);font-size:clamp(17px,1.32vw,20px);
  line-height:1.6;font-weight:500;color:var(--grey-d);max-width:43ch
}
.csn-hero-meta{
  margin-top:clamp(28px,2.7vw,38px);display:grid;
  grid-template-columns:minmax(0,.72fr) minmax(0,1.3fr);
  column-gap:clamp(22px,2.6vw,38px);align-items:start
}
.csn-meta-row{display:flex;flex-direction:column;gap:8px}
.csn-meta-row span{
  font-size:9.5px;line-height:1.35;font-weight:650;letter-spacing:.15em;text-transform:uppercase
}
.csn-meta-values{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.csn-meta-row strong{
  display:block;font-family:var(--font-body);font-size:12.5px;line-height:1.45;
  font-weight:560;color:var(--paper)
}
.csn-hero-media{grid-column:6/13;aspect-ratio:16/10;background:var(--slate-2)}

/* PROBLEM — label remains sticky through text + gallery */
.csn-problem{background:var(--ink2);padding:clamp(104px,9.5vw,144px) var(--pad-x) clamp(112px,10.5vw,158px)}
.csn-problem-main{grid-column:3/13;min-width:0}
.csn-problem-head{
  display:grid;grid-template-columns:repeat(10,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-problem-title{
  grid-column:1/6;margin:0;font-family:var(--font-body);
  font-size:clamp(32px,2.85vw,44px);line-height:1.18;font-weight:540;
  letter-spacing:-.028em;color:var(--paper)
}
.csn-problem-context{
  grid-column:7/11;margin:0;font-family:var(--font-body);
  font-size:clamp(15.5px,1.08vw,17.5px);line-height:1.65;color:var(--grey-d)
}
.csn-problem-points{
  margin-top:clamp(62px,6vw,90px);
  border-top:1px solid var(--line-d)
}
.csn-problem-point{
  display:grid;grid-template-columns:36px minmax(0,1fr);
  gap:clamp(20px,2.2vw,34px);align-items:start;
  padding:clamp(19px,1.8vw,26px) 0;border-bottom:1px solid var(--line-d)
}
.csn-problem-index{display:block;width:32px;height:1px;margin-top:.78em}
.csn-problem-point p{
  margin:0;font-family:var(--font-body);font-size:clamp(18px,1.45vw,23px);
  line-height:1.4;font-weight:520;letter-spacing:-.012em;color:var(--paper);max-width:58ch
}

/* Problem gallery begins exactly on the Problem's main content column. */
.csn-problem-gallery-grid{
  margin-top:clamp(72px,7vw,106px);
  display:grid;grid-template-columns:repeat(10,minmax(0,1fr));
  column-gap:clamp(12px,1.2vw,18px);row-gap:clamp(14px,1.5vw,22px);align-items:start
}
.csn-problem-media{overflow:hidden;background:var(--slate-2)}
.csn-problem-gallery-1 .csn-problem-media-solo{grid-column:1/11;aspect-ratio:2.05/1}
.csn-problem-gallery-2 .csn-problem-media-main{grid-column:1/7;aspect-ratio:16/9.7}
.csn-problem-gallery-2 .csn-problem-media-small{grid-column:7/11;aspect-ratio:4/3}
.csn-problem-gallery-3 .csn-problem-media-main{grid-column:1/7;aspect-ratio:16/9.7}
.csn-problem-gallery-3 .csn-problem-media-small{grid-column:7/11;aspect-ratio:4/3}
.csn-problem-gallery-3 .csn-problem-media-wide{grid-column:1/11;aspect-ratio:2.05/1}
.csn-problem-gallery.is-crop-fallback .csn-problem-crop-1 img{object-position:38% 50%;transform:scale(1.03)}
.csn-problem-gallery.is-crop-fallback .csn-problem-crop-2 img{object-position:74% 48%;transform:scale(1.18)}
.csn-problem-gallery.is-crop-fallback .csn-problem-crop-3 img{object-position:52% 72%;transform:scale(1.1)}

/* extracted 3225-3410 */

  --growth-line:rgba(235,235,235,.16);
  --growth-accent:var(--red);
}

/* MARKETING — identical color family to the homepage. */
#page-marketing{background:var(--ink2);color:var(--paper)}
.service-page-hero--marketing{
  --service-accent:var(--red);
  background:var(--ink2);
  color:var(--paper)
}
.service-page-hero--marketing .label{color:var(--red)}
.service-page-hero--marketing .service-page-hero-side p{color:var(--grey-d)}
.service-page-hero--marketing .service-page-cta{background:var(--red);color:var(--ink)}
.nav.service-route-marketing .nav-marketing-trigger.active::after{background:var(--red)}

/* PRODUCT — one continuous off-white environment with core UCENA red as signal. */
#page-product,
.product-page,
.product-hero,
.product-build,
.product-how,
.product-work{
  background:var(--product-bg);
  color:var(--product-ink)
}
.product-page .label--red{color:var(--red)}
.product-hero-side p{color:var(--product-muted)}
.product-page .btn--red{background:var(--red);color:var(--product-ink)}
.product-page .btn--red::before{background:var(--product-ink)}
.product-page .btn--red:hover{color:var(--paper)}
.product-page .tlink{color:var(--product-ink)}
.product-page .tlink::after{background:var(--red)}
.product-page .tlink .uc{fill:var(--red)}
.nav.service-route-product .nav-links>a[data-page="product"].active::after{background:var(--red)}

/* Product / What We Build — preserve homepage row behavior, retuned for light surface. */
.product-services{border-bottom-color:var(--product-line)}
.product-services .svc{border-top-color:var(--product-line)}
.product-services .svc:last-of-type{border-bottom-color:var(--product-line)}
.product-svc .svc-num{color:transparent;-webkit-text-stroke:1.2px var(--red)}
.product-svc .svc-title{color:var(--product-ink)}
.product-svc .svc-title small{color:var(--product-muted)}
.product-svc-summary{color:var(--product-muted)}
.product-svc-summary span::before{color:var(--red)}
.product-svc-cta{color:var(--product-ink)}
.product-svc-cta .uc{fill:var(--red)}
.product-svc::before{background:var(--red)}
.product-svc:hover .svc-title{color:var(--product-ink)}
.product-svc:hover .svc-title small{color:rgba(20,20,20,.70)}
.product-svc:hover .product-svc-summary{color:rgba(20,20,20,.78)}
.product-svc:hover .product-svc-summary span::before{color:var(--product-ink)}
.product-svc:hover .product-svc-cta{color:var(--product-ink)}
.product-svc:hover .product-svc-cta .uc{fill:var(--product-ink)}

/* Product / How We Work — same homepage line + nodes, now legible on off-white. */
.product-process .steps-line{background:var(--product-line)}
.product-process .steps-line-fill{background:var(--red)}
.product-process .step-node{background:rgba(20,20,20,.16)}
.product-process .step.completed .step-node{background:rgba(20,20,20,.46)}
.product-process .step.current .step-node{
  background:var(--red);
  box-shadow:0 0 0 6px rgba(239,73,63,.14)
}
.product-process .step-ill svg .s{stroke:rgba(20,20,20,.58)}
.product-process .step-ill svg .s2{stroke:rgba(20,20,20,.30)}
.product-process .step-ill svg .dot{fill:rgba(20,20,20,.50)}
.product-process .step-ill svg .reddot{fill:var(--red)}
.product-process .step em{color:transparent;-webkit-text-stroke:1.2px var(--red)}
.product-process .step.current em{color:var(--red)}
.product-process .step b{color:var(--product-ink)}
.product-process .step p{color:var(--product-muted)}

/* Product / archive-derived case grid on light editorial surface. */
.product-work .cs-project-tags,
.product-work .cs-kpi-value{color:var(--red)}
.product-work .cs-project-name{color:var(--product-ink)}
.product-work .cs-project-desc,
.product-work .cs-kpi-label{color:var(--product-muted)}
.product-work .cs-project-cta{color:var(--product-ink)}
.product-work .cs-project-cta::after{background:var(--red)}
.product-work .cs-project-cta .uc{fill:var(--red)}
.product-cs-grid .product-case:focus-visible{outline-color:var(--red)}

/* Product consultation form — dark Contact mechanics on the red closing surface. */
.product-consultation .c-field label{color:rgba(20,20,20,.72)}
.product-consultation .c-optional{color:rgba(20,20,20,.50)}
.product-consultation .c-input::before{background:rgba(20,20,20,.28)}
.product-consultation .c-input::after{background:var(--ink)}
.product-consultation .c-field input,
.product-consultation .c-field textarea,
.product-consultation .c-field select{
  color:var(--ink);
  color-scheme:light
}
.product-consultation .c-field input::placeholder,
.product-consultation .c-field textarea::placeholder{color:rgba(20,20,20,.46)}
.product-consultation .c-field select option{background:var(--red);color:var(--ink)}
.product-consultation .btn--cta{background:var(--ink);color:var(--paper)}
.product-consultation .btn--cta::before{background:#000}

/* GROWTH — deep Primary slate-charcoal from the UCENA color system.
   Darkened further so core UCENA red reads as a clean accent without vibrating against the surface. */
#page-growth{background:var(--growth-bg);color:var(--growth-ink)}
.service-page-hero--growth{
  --service-accent:var(--growth-accent);
  background:var(--growth-bg);
  color:var(--growth-ink)
}
.service-page-hero--growth .label{color:var(--growth-accent)}
.service-page-hero--growth .service-page-hero-side p{color:var(--growth-muted)}
.service-page-hero--growth .service-page-cta{
  background:var(--growth-accent);
  color:var(--growth-dark)
}
.service-page-hero--growth .service-page-cta::before{background:var(--growth-dark)}
.service-page-hero--growth .service-page-cta:hover{color:var(--paper)}
.service-page-hero--growth .service-page-cta:focus-visible{outline-color:var(--growth-dark)}
.nav.service-route-growth .nav-links>a[data-page="growth"].active::after{background:var(--growth-accent)}

@media (max-width:767px){
  /* Preserve the light Product process as a vertical version of the same line/node system. */
  .product-process .steps-line{background:var(--product-line)}
  .product-process .step-node{background:rgba(20,20,20,.28)!important}
  .product-process .step.current .step-node{
    background:var(--red)!important;
    box-shadow:0 0 0 6px rgba(239,73,63,.14)!important
  }
}


/* ============ GROWTH SERVICE PAGE — sibling of approved Product page ============ */
#page-growth .product-hero,#page-growth .product-build,#page-growth .product-how,#page-growth .product-work{background:var(--growth-bg);color:var(--growth-ink)}
#page-growth .label--red{color:var(--growth-accent)}
#page-growth .product-hero-side p,#page-growth .growth-build-intro{color:var(--growth-muted)}
#page-growth .btn--red{background:var(--growth-accent);color:var(--growth-dark)}
#page-growth .btn--red::before{background:var(--growth-dark)}
#page-growth .btn--red:hover{color:var(--paper)}
#page-growth .tlink{color:var(--growth-ink)}
#page-growth .tlink::after{background:var(--growth-accent)}
#page-growth .tlink .uc{fill:var(--growth-accent)}
.growth-build-intro{max-width:54ch;margin-top:-44px;margin-bottom:clamp(54px,5vw,74px);font-size:clamp(15.5px,1vw,17px);line-height:1.55}
.growth-services{border-bottom-color:var(--growth-line)}
.growth-services .svc{border-top-color:var(--growth-line)}
.growth-services .svc:last-of-type{border-bottom-color:var(--growth-line)}
.growth-svc .svc-num{color:transparent;-webkit-text-stroke:1.2px var(--growth-accent)}
.growth-svc .svc-title{color:var(--growth-ink)}
.growth-svc .svc-title small{color:var(--growth-muted);max-width:45ch}
.growth-svc .svc-title small strong{color:var(--growth-ink);font-weight:600}
.growth-svc-summary{color:var(--growth-muted)}
.growth-svc-summary span::before{color:var(--growth-accent)}
.growth-svc .svc-arrow{color:var(--growth-accent)}
.growth-svc::before{background:var(--growth-accent)}
.growth-svc:hover .svc-title,.growth-svc:hover .svc-title small,.growth-svc:hover .svc-title small strong,.growth-svc:hover .growth-svc-summary{color:var(--growth-dark)}
.growth-svc:hover .growth-svc-summary span::before,.growth-svc:hover .svc-arrow{color:var(--growth-dark)}
.growth-svc-name{max-width:15ch}
/* Growth refinement: quieter descriptors, controlled second-service title, authored work headline. */
.growth-svc .svc-title small{
  font-size:10px;line-height:1.34;letter-spacing:.145em;max-width:52ch;margin-top:12px;
  color:rgba(235,235,235,.58);
}
.growth-svc:nth-child(2) .growth-svc-name{max-width:13ch;font-size:.88em;line-height:.94}
.growth-work-title{max-width:13ch}
.growth-work-title .hl>span{white-space:nowrap}
.growth-consultation-title{
  font-size:clamp(48px,4.35vw,70px);line-height:1.01;max-width:10ch;color:var(--ink);
}
.growth-process{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(32px,3.5vw,58px)}
.growth-process .steps-line{background:var(--growth-line)}
.growth-process .steps-line-fill{background:var(--growth-accent)}
.growth-process .step-node{background:rgba(235,235,235,.16)}
.growth-process .step.completed .step-node{background:rgba(235,235,235,.5)}
.growth-process .step.current .step-node{background:var(--growth-accent);box-shadow:0 0 0 6px rgba(239,73,63,.16)}
.growth-process .step-ill svg .s{stroke:rgba(235,235,235,.60)}
.growth-process .step-ill svg .s2{stroke:rgba(235,235,235,.32)}
.growth-process .step-ill svg .dot{fill:rgba(235,235,235,.55)}
.growth-process .step-ill svg .reddot{fill:var(--growth-accent)}
.growth-process .step em{color:transparent;-webkit-text-stroke:1.2px var(--growth-accent)}
.growth-process .step.current em{color:var(--growth-accent)}
.growth-process .step b{color:var(--growth-ink)}
.growth-process .step p{color:var(--growth-muted)}
.growth-work .cs-project-tags,.growth-work .cs-kpi-value{color:var(--growth-accent)}
.growth-work .cs-project-name{color:var(--growth-ink)}
.growth-work .cs-project-desc,.growth-work .cs-kpi-label{color:var(--growth-muted)}
.growth-work .cs-project-cta{color:var(--growth-ink)}
.growth-work .cs-project-cta::after{background:var(--growth-accent)}

/* extracted 3549-3600 */

.marketing-problem{background:var(--ink);padding:clamp(112px,10vw,150px) var(--pad-x)}
.marketing-problem-grid{align-items:end;row-gap:42px}
.marketing-problem-head{grid-column:1/9}
.marketing-problem-head .label{display:block;margin-bottom:22px}
.marketing-problem-head h2{max-width:15ch;margin:0}
.marketing-problem-copy{grid-column:9/13;align-self:end;padding-bottom:7px}
.marketing-problem-copy p{color:var(--grey-d);font-size:clamp(17px,1.25vw,20px);line-height:1.5;max-width:38ch}
.marketing-problem-copy p+p{margin-top:18px;color:var(--paper)}

/* What We Build — exact homepage service-row interaction, simplified to title + descriptor + arrow. */
.marketing-build{background:var(--ink);padding:clamp(112px,10vw,148px) var(--pad-x)}
.marketing-build .product-sec-head h2{max-width:none}
.marketing-build .product-sec-head h2 .hl>span{white-space:nowrap}
.marketing-services{border-bottom:1px solid var(--line-d)}
.marketing-services .marketing-svc{border-top:1px solid var(--line-d)}
.marketing-services .marketing-svc:last-of-type{border-bottom:1px solid var(--line-d)}
.marketing-svc a{grid-template-columns:repeat(12,minmax(0,1fr));padding:48px clamp(18px,1.7vw,26px) 46px;align-items:center;min-width:0}
.marketing-svc .svc-num{grid-column:1/2;color:transparent;-webkit-text-stroke:1.2px var(--red)}
.marketing-svc .svc-title{grid-column:2/11;min-width:0;margin:0;font-size:clamp(42px,3.35vw,62px);line-height:.94;white-space:normal;color:var(--paper)}
.marketing-svc-name{display:block;max-width:18ch;overflow-wrap:normal;word-break:normal}
.marketing-svc .svc-title small{font-family:var(--font-body);font-weight:500;font-size:clamp(14px,.95vw,16px);line-height:1.45;letter-spacing:0;text-transform:none;color:var(--grey-d);margin-top:13px;max-width:54ch;white-space:normal}
.marketing-svc .svc-arrow{grid-column:12/13;justify-self:end;width:30px;height:30px;color:var(--red)}
.marketing-svc::before{background:var(--red)}
.marketing-svc:hover .svc-num{color:var(--ink);-webkit-text-stroke:1.2px var(--ink)}
.marketing-svc:hover .svc-title,.marketing-svc:hover .svc-title small{color:var(--ink)}
.marketing-svc:hover .svc-arrow{color:var(--ink);transform:translate(4px,-4px)}

/* How We Work — homepage line/dot language expanded cleanly to five source steps. */
.marketing-how{background:var(--ink2);padding:clamp(112px,10vw,150px) var(--pad-x) clamp(126px,11vw,168px)}
.marketing-process{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:clamp(26px,2.8vw,48px)}
.marketing-process .steps-line{position:absolute;top:112px;left:0;width:100%;height:1px;background:rgba(235,235,235,.14)}
.marketing-process .steps-line-fill{position:absolute;inset:0 auto 0 0;width:0;height:100%;background:var(--red);transition:width .45s linear}
.marketing-process .step{width:auto;max-width:none;min-width:0}
.marketing-process .step-node{border-radius:50%}
.marketing-process .step-ill{height:88px;margin-bottom:24px}
.marketing-process .step.current .step-node{background:var(--red);box-shadow:0 0 0 6px rgba(239,73,63,.16)}
.marketing-process .step.completed .step-node{background:rgba(235,235,235,.5)}
.marketing-process .step.current .step-ill svg .reddot{opacity:1}
.marketing-process .step em{color:transparent;-webkit-text-stroke:1.2px var(--red);margin:34px 0 12px}
.marketing-process .step.current em{color:var(--red)}
.marketing-process .step b{font-size:clamp(17px,1.25vw,19px);line-height:1.22;min-height:2.45em}
.marketing-process .step p{font-size:clamp(14.5px,.9vw,16px);max-width:28ch}

/* Who We Help — typographic editorial grid, no cards. */
.marketing-help{background:var(--ink);padding:clamp(112px,10vw,150px) var(--pad-x)}
.marketing-help-head .label{display:block;margin-bottom:22px}
.marketing-help-head h2{max-width:19ch;margin-bottom:clamp(68px,6vw,90px)}
.marketing-help-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(38px,5vw,78px)}
.marketing-help-item{display:grid;grid-template-columns:52px minmax(0,1fr);gap:20px;align-items:start;padding:34px 0;border-top:1px solid var(--line-d)}
.marketing-help-item:nth-last-child(-n+2){border-bottom:1px solid var(--line-d)}
.marketing-help-num{font-family:var(--font-body);font-weight:600;font-size:13px;color:var(--red);padding-top:5px}
.marketing-help-item p{font-family:var(--font-body);font-weight:500;font-size:clamp(20px,1.65vw,27px);line-height:1.28;color:var(--paper);max-width:27ch}

.hero-grid{position:relative;z-index:2;width:100%;max-width:1500px;margin-inline:auto;display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:auto auto 1fr;column-gap:clamp(16px,1.8vw,28px);row-gap:0;flex:1}
.hero-inner{grid-column:1/13;grid-row:1;align-self:start}
.hero-kicker{display:block;margin-bottom:18px}
.hero h1{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(36px,4.8vw,76px);
  line-height:1.05;letter-spacing:.005em;
  max-width:none;text-wrap:balance;
}
.hero-bottom{grid-column:1/5;grid-row:2;align-self:start;margin-top:clamp(28px,3.2vw,40px);display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:38ch}
.hero-bottom p{color:var(--grey-d);font-size:16px}
.hero-actions{display:flex;flex-direction:column;align-items:flex-start;gap:12px}

.hero-media{grid-column:5/13;grid-row:2/4;align-self:start;justify-self:end;width:80%;margin-top:clamp(14px,1.8vw,24px);padding-bottom:clamp(18px,2vw,28px)}
.hero-video-wrap{width:100%;aspect-ratio:16/9;overflow:hidden}
.hero-video{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.04);transition:transform 1.4s var(--ease-inout) .3s}
.hero.reveal .hero-video{transform:scale(1)}

/* ============ PROCESS ============ */
.process{background:var(--ink2);padding:clamp(96px,10vw,130px) var(--pad-x)}
.process h2{margin-bottom:0}
.steps-mobile-hud{display:none}
.steps-wrap{position:relative;margin-top:clamp(16px,2vw,28px);height:115vh}
.steps-pin{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden}
.steps-line{position:absolute;top:112px;left:0;width:100%;height:1px;background:rgba(235,235,235,.14)}
.steps-line-fill{position:absolute;top:0;left:0;height:100%;width:0;background:var(--red);transition:width .3s linear}
.steps{display:flex;gap:clamp(48px,5vw,80px);position:relative;min-width:max-content;will-change:transform;padding-left:var(--pad-x);padding-right:var(--pad-x)}
.step{position:relative;flex:0 0 auto;width:clamp(240px,34vw,380px)}
.step-node{position:absolute;top:112px;left:0;width:9px;height:9px;border-radius:50%;background:rgba(235,235,235,.16);transform:translateY(-50%);transition:background .5s ease .1s,box-shadow .5s ease .1s;z-index:2}
.step.completed .step-node{background:rgba(235,235,235,.5)}
.step.current .step-node{background:var(--red);box-shadow:0 0 0 6px rgba(239,73,63,.16)}

.step-ill{height:88px;display:flex;align-items:center;justify-content:flex-start;margin-bottom:24px}
.step-ill svg{width:auto;height:100%;max-width:100%;overflow:visible}
.step-ill svg .s{fill:none;stroke:rgba(235,235,235,.6);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
.step-ill svg .s2{fill:none;stroke:rgba(235,235,235,.32);stroke-width:1.1;stroke-linecap:round}
.step-ill svg .dash{stroke-dasharray:2.6 3.6}
.step-ill svg .dot{fill:rgba(235,235,235,.55);stroke:none}
.step-ill svg .reddot{fill:var(--red);stroke:none}
/* illustrations shown fully drawn by default — no scroll gating */
.step-ill svg [class]{stroke-dasharray:var(--len);stroke-dashoffset:0;transition:stroke-dashoffset .5s var(--ease-inout)}
.step-ill svg [class*="dot"]{stroke-dasharray:none!important;stroke-dashoffset:0!important;opacity:1;transition:opacity .3s ease .1s}
.step-ill svg .reddot{opacity:0;transition:opacity .5s ease .2s}
.step.current .step-ill svg .reddot{opacity:1}
.step-ill svg{opacity:1;transition:opacity .5s ease}

.step em{font-style:normal;font-family:var(--font-body);font-weight:600;font-size:clamp(20px,1.8vw,28px);letter-spacing:.01em;color:transparent;-webkit-text-stroke:1.2px var(--red);display:block;margin:34px 0 12px;opacity:1;transition:opacity .5s ease .3s,color .4s ease}
.step.current em{color:var(--red);opacity:1}
.step b{font-family:var(--font-body);font-weight:600;font-size:clamp(18px,1.5vw,20px);display:block;margin-bottom:8px;color:var(--paper);opacity:1;transition:opacity .5s ease .3s}
.step p{font-size:clamp(16px,1vw,17px);color:var(--grey-d);line-height:1.45;opacity:1;transition:opacity .5s ease .3s}
.step.current em,.step.current b,.step.current p{opacity:1}
.step.completed em{opacity:.7}
.step.completed b,.step.completed p{opacity:.8}

/* restrained editorial proportions: asymmetry comes from column span, not excessive image height */
.cs-ratio-wide .cs-media{aspect-ratio:16/9.7}
.cs-ratio-compact .cs-media{aspect-ratio:4/3}
.cs-ratio-pano .cs-media{aspect-ratio:2.05/1}

/* content follows reference hierarchy: categories → title → explanation → KPI → button */
.cs-project-meta{padding-top:18px}
.cs-project-tags{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:11px;color:var(--red);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.cs-project-tags span+span::before{content:'·';margin-right:12px;color:var(--grey-d)}
.cs-project-name{font-family:var(--font-display);font-weight:700;font-size:clamp(22px,1.9vw,30px);line-height:1.04;letter-spacing:.005em;color:var(--paper)}
.cs-project-desc{margin-top:11px;max-width:50ch;color:var(--grey-d);font-family:var(--font-body);font-size:clamp(15px,1vw,17px);line-height:1.5}
.cs-project-kpis{display:flex;flex-wrap:wrap;gap:22px;margin-top:17px;padding-top:0;border-top:0}
.cs-kpi{display:flex;align-items:baseline;gap:8px;min-width:0}
.cs-kpi-value{font-family:var(--font-body);font-weight:600;font-size:16px;line-height:1.1;color:var(--red);white-space:nowrap}
.cs-kpi-label{font-family:var(--font-body);font-size:12px;line-height:1.25;color:var(--grey-d)}
.cs-project-cta{margin-top:18px}
.cs-project-cta:focus-visible{outline:2px solid var(--red);outline-offset:4px}

  .cs-filter-inner{display:block;padding:23px 0 25px}
  .cs-filter-groups{display:flex;flex-direction:column;gap:21px;min-width:0}
  .cs-filter-row{display:block;min-width:0}
  .cs-filter-label{font-size:13px;margin-bottom:10px}
  .cs-filters{
    flex-wrap:nowrap;gap:0 20px;overflow-x:auto;overflow-y:hidden;
    padding:1px 22px 5px 0;margin-right:-22px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-inline:contain;
  }
  .cs-filters::-webkit-scrollbar{display:none}
  .cs-filter{font-size:13.5px;line-height:1.3;flex:0 0 auto;min-height:28px;display:inline-flex;align-items:center}
  .cs-filter-meta{margin-top:18px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;width:100%}
  .cs-filter-clear{font-size:12px;grid-column:1;justify-self:start}

/* aliases + service page foundation */
.display{font-family:var(--font-display);font-weight:700;line-height:1.04;letter-spacing:.01em}
.h-b{font-size:clamp(36px,4.1vw,64px)}
.h-c{font-size:clamp(38px,3.6vw,58px)}
.label{font-size:11.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.label--red{color:var(--red)}
.service-page{min-height:100vh}
.marketing-hero.product-hero,
.marketing-hero{
  background:#E9E8E4!important;
  color:#141414
}
.marketing-hero h1,
.marketing-hero .display{color:#141414}
.marketing-hero .product-hero-side p,.marketing-hero-side p{color:rgba(20,20,20,.72)}
.marketing-page,.page-marketing{background:var(--ink2)}
.product-hero-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(16px,1.8vw,28px)}
.product-hero.reveal .product-hero-video-wrap,.hero.reveal .hero-video-wrap{clip-path:inset(0 0 0 0)}
.insights-title-mobile{display:none}
.cs-filter-shell .cs-filter,
.insights-filter-shell .cs-filter{
  appearance:none;border:0;background:transparent;border-radius:0;box-shadow:none
}
.insight-detail-meta-top{display:flex;flex-direction:column;gap:10px}
.insight-detail-author-row{display:flex;align-items:center;gap:10px;margin-top:16px;font:500 12px/1.45 var(--font-body);color:rgba(235,235,235,.5)}
.insight-detail-author-thumb{width:28px;height:28px;border-radius:50%;overflow:hidden;background:var(--slate-2);flex-shrink:0}
.insight-detail-author-thumb img{width:100%;height:100%;object-fit:cover}
.insight-detail-author-name{color:rgba(235,235,235,.82);font-weight:600}
.cs-intro.insights-intro{padding:clamp(142px,14vw,206px) var(--pad-x) clamp(36px,4vw,56px)}
.insights-intro .cs-intro-copy{grid-column:1/13}
.insights-intro h1{font-size:clamp(48px,5.4vw,86px);line-height:.98;letter-spacing:.005em}
.insights-intro h1 .hl>span{white-space:nowrap}
.insights-filter-shell .cs-filter-groups{grid-column:1/11}
.insights-filter-shell .cs-filter-meta{grid-column:11/13}
.growth-problem{background:var(--ink);padding:clamp(112px,10vw,150px) var(--pad-x)}
.growth-problem-shell{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(16px,1.8vw,28px);align-items:start}
.growth-problem-rail{grid-column:1/3}
.growth-problem-main{grid-column:3/13}
.growth-problem-title{font-family:var(--font-display);font-size:clamp(36px,3.6vw,58px);line-height:1.04;margin-bottom:18px}
.growth-problem-context{color:var(--grey-d);max-width:48ch;margin-bottom:36px}
.growth-problem-points{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,48px)}
.growth-problem-point{display:grid;grid-template-columns:32px 1fr;gap:16px}
.growth-problem-index{display:block;width:32px;height:1px;margin-top:.8em;background:var(--red)}
.growth-problem-point strong{display:block;margin-bottom:8px}
.growth-problem-point p{color:var(--grey-d)}
.growth-detail{padding:clamp(96px,9vw,140px) var(--pad-x);background:var(--ink2)}
.growth-detail-head{max-width:22ch;margin-bottom:48px}
.growth-detail-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,4vw,72px)}
.growth-detail-group-title{display:block;font:600 11px/1.2 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:18px}
.growth-detail-list{list-style:none;border-top:1px solid var(--line-d)}
.growth-detail-list li{padding:14px 0;border-bottom:1px solid var(--line-d);color:rgba(235,235,235,.82)}
.growth-detail-cta{margin-top:36px;display:inline-flex}
.rs-svc a{align-items:center}
.rs-svc-summary{grid-column:8/12;display:flex;flex-direction:column;gap:8px;color:var(--grey-d);font-size:clamp(13px,.9vw,14.5px)}
.rs-svc-summary span{padding-left:14px;position:relative}
.rs-svc-summary span::before{content:"—";position:absolute;left:0;color:var(--red)}
.rs-why-grid{align-items:start;row-gap:40px}
.rs-why-head{grid-column:1/6}
.rs-why-principles{grid-column:7/13}
.rs-why-list{list-style:none}
.rs-why-item{display:flex;gap:18px;padding:22px 0;border-bottom:1px solid var(--line-d);font-size:clamp(17px,1.3vw,22px)}
.rs-why-num{font-style:normal;color:var(--red);font:600 12px/1.2 var(--font-body);letter-spacing:.08em}
.rs-faq{padding:clamp(96px,9vw,140px) var(--pad-x);background:var(--ink)}
.rs-faq-grid{align-items:start}
.rs-faq-head{grid-column:1/6}
.rs-faq-list{grid-column:7/13}
.rs-faq-item{border-bottom:1px solid var(--line-d)}
.rs-faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;cursor:pointer;list-style:none;font-weight:600}
.rs-faq-item summary::-webkit-details-marker{display:none}
.rs-faq-item .uc{width:11px;height:11px;transition:transform .3s var(--ease-out)}
.rs-faq-item[open] .uc{transform:rotate(45deg)}
.rs-faq-answer{padding:0 0 22px;color:var(--grey-d);max-width:52ch}
.product-consultation .uc-lead-form,.product-consultation .repraesent-lead-form{grid-column:7/13}
.product-consultation-head{grid-column:1/6}
.ucena-consult-form{grid-column:7/13;min-width:0}
.who-mosaic{margin-top:clamp(56px,6vw,88px)}
.who-band{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,1.8vw,28px)}
.rs-audience .who-band{grid-template-columns:1fr 1fr}
.m-item{min-width:0}
.m-visual{overflow:hidden;aspect-ratio:4/5;background:var(--slate-2)}
.m-img{width:100%;height:100%;background-size:cover;background-position:center}
.m-cap{margin-top:12px;font-size:14px;color:var(--grey-d);max-width:28ch}
.marketing-help,.rs-audience{padding:clamp(112px,10vw,150px) var(--pad-x);background:var(--ink2)}
@media(max-width:767px){
  .insights-title-desktop{display:none!important}
  .insights-title-mobile{display:block!important}
  .insights-intro h1 .hl>span{white-space:nowrap}
  .growth-problem-shell,.growth-problem-points,.growth-detail-body,.who-band,.rs-audience .who-band{display:block}
  .growth-problem-rail,.growth-problem-main{width:100%}
  .growth-problem-rail{margin-bottom:28px}
  .m-item{margin-bottom:28px}
  .rs-faq-head,.rs-faq-list,.rs-why-head,.rs-why-principles{grid-column:1/13}
  .uc-hero h1,
  .hero h1,
  .uc-hero .rb-block-heading:is(h1),
  .uc-hero .rb-block-heading:is(h1){
    font-size:clamp(26px,6.8vw,38px)!important;
    text-wrap:unset!important;
  }
  .uc-hero h1 .hl>span,
  .hero h1 .hl>span{white-space:nowrap!important}
}

/* case-studies intro */
.case-studies-page{background:var(--ink2);min-height:100vh}

/* compact CTA-like hero: message upper-left, supporting copy lower-right */
.cs-intro{
  min-height:clamp(360px,44vw,520px);
  padding:clamp(122px,9vw,148px) var(--pad-x) clamp(46px,4vw,60px);
  display:flex;
}
.cs-intro-grid{width:100%;grid-template-rows:auto 1fr;align-items:start}

/* ============ CASE STUDIES — TABLET ============ */
@media (min-width:768px) and (max-width:1100px){
  .cs-intro{min-height:clamp(350px,45vw,430px);padding:118px var(--pad-x) 46px}
  .cs-intro-copy{grid-column:1/9}
  .cs-intro h1{font-size:clamp(44px,6vw,62px)}
  .cs-intro-sub{grid-column:7/13;max-width:34ch;font-size:16px}

  .cs-filter-inner{grid-template-columns:repeat(12,1fr);padding-top:26px;padding-bottom:28px}
  .cs-filter-groups{grid-column:1/11;gap:18px}
  .cs-filter-row{grid-template-columns:78px minmax(0,1fr);column-gap:18px}
  .cs-filter-label{font-size:13.5px}
  .cs-filters{gap:7px 17px}
  .cs-filter{font-size:13.25px}
  .cs-filter-meta{grid-column:11/13;gap:7px}

  .cs-archive{padding:62px var(--pad-x) 128px}
  .cs-grid{grid-template-columns:repeat(8,1fr);column-gap:20px;row-gap:72px}
  .cs-pos-1,.cs-pos-4,.cs-pos-5{grid-column:1/9}
  .cs-pos-2{grid-column:1/5}
  .cs-pos-3{grid-column:5/9}
  .cs-ratio-wide .cs-media{aspect-ratio:16/9.4}
  .cs-ratio-compact .cs-media{aspect-ratio:4/3}
  .cs-ratio-pano .cs-media{aspect-ratio:16/8.4}
  .cs-project-meta{padding-top:16px}
  .cs-project-name{font-size:clamp(23px,2.8vw,29px)}
  .cs-project-desc{font-size:15.5px;max-width:46ch}
  .cs-project-tags{gap:10px;font-size:10px;letter-spacing:.14em}
  .cs-project-kpis{gap:18px;margin-top:15px}
}

/* ============ CASE STUDIES — MOBILE ============ */
@media(max-width:767px){
  .cs-intro{min-height:0;padding:104px 22px 40px;display:block}
  .cs-intro-grid{display:flex;flex-direction:column}
  .cs-intro-copy{width:100%}
  .cs-intro h1{font-size:clamp(35px,10.4vw,47px);line-height:1;max-width:none}
  .cs-intro h1 .hl>span{white-space:nowrap}
  .cs-intro .label{margin-bottom:14px}
  .cs-intro-sub{align-self:flex-end;margin-top:40px;max-width:29ch;padding:0;font-size:15.5px;line-height:1.48}

  .cs-filter-inner{display:block;padding:23px 0 25px}
  .cs-filter-groups{display:flex;flex-direction:column;gap:21px;min-width:0}
  .cs-filter-row{display:block;min-width:0}
  .cs-filter-label{font-size:13px;margin-bottom:10px}
  .cs-filters{
    flex-wrap:nowrap;gap:0 20px;overflow-x:auto;overflow-y:hidden;
    padding:1px 22px 5px 0;margin-right:-22px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-inline:contain;
  }
  .cs-filters::-webkit-scrollbar{display:none}
  .cs-filter{font-size:13.5px;line-height:1.3;flex:0 0 auto;min-height:28px;display:inline-flex;align-items:center}
  .cs-filter-meta{margin-top:18px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;width:100%}
  .cs-filter-clear{font-size:12px;grid-column:1;justify-self:start}
  .cs-count{font-size:9.5px;grid-column:2;justify-self:end;text-align:right}

  .cs-archive{padding:48px 22px 96px}
  .cs-grid{display:block}
  .cs-project{grid-column:auto!important;margin-bottom:56px}
  .cs-project:last-child{margin-bottom:0}
  .cs-ratio-wide .cs-media{aspect-ratio:16/10}
  .cs-ratio-compact .cs-media{aspect-ratio:4/3}
  .cs-ratio-pano .cs-media{aspect-ratio:16/9}
  .cs-project-meta{padding-top:14px}
  .cs-project-tags{gap:8px;font-size:9.5px;letter-spacing:.13em;margin-bottom:9px}
  .cs-project-tags span+span::before{margin-right:8px}
  .cs-project-name{font-size:clamp(23px,7.2vw,29px);line-height:1.06}
  .cs-project-desc{font-size:15px;line-height:1.48;margin-top:10px;max-width:100%}
  .cs-project-kpis{gap:14px 18px;margin-top:14px}
  .cs-kpi{gap:7px}
  .cs-kpi-value{font-size:15.5px}
  .cs-kpi-label{font-size:11.5px}
  .cs-project-cta{margin-top:15px}

/* ============ CASE DETAIL — INTERACTION + RESPONSIVE REFINEMENT ============ */
.csn-detail{
  --csn-sticky-top:88px;
  background:var(--ink2);color:var(--paper)
}

/* Red logic:
   dark sections -> UCENA red;
   light Results chapter -> safe dark red;
   no secondary decorative reds beyond structural dashes/metadata. */
.csn-detail .csn-label,
.csn-detail .csn-meta-row span,
.csn-detail .csn-services>span{color:var(--red)}
.csn-detail .csn-problem-index,
.csn-detail .csn-services>div::before{background:var(--red)}
.csn-results-chapter .csn-label,
.csn-results-chapter .csn-result-group h3{color:var(--red-text-safe)}
.csn-results-chapter .csn-result-facts p::before{background:var(--red-text-safe)}

/* Homepage reveal language: same 24px rise / .85s text timing. */
.csn-detail .csd-rv{
  opacity:0;transform:translateY(24px);
  transition:opacity .85s var(--ease-out),transform .85s var(--ease-out)
}
.csn-detail .csd-rv.in{opacity:1;transform:none}

/* Homepage/case-list media language: directional clip + 1.035 settle. */
.csn-detail .csn-media-reveal.csd-rv{opacity:1;transform:none}
.csn-detail .csn-media-inner{
  width:100%;height:100%;transform:scale(1.035);
  transition:transform 1.15s var(--ease-out)
}
.csn-detail .csn-media-reveal.in .csn-media-inner{transform:scale(1)}
.csn-detail .csn-media-inner img,
.csn-detail .csn-media-inner video{
  display:block;width:100%;height:100%;object-fit:cover;
  visibility:visible!important;opacity:1!important
}
.csn-detail .csn-media-reveal{
  overflow:hidden;will-change:clip-path;
  transition:clip-path 1.05s var(--ease-inout)
}
.csn-detail .csn-reveal-l{clip-path:inset(0 100% 0 0)}
.csn-detail .csn-reveal-r{clip-path:inset(0 0 0 100%)}
.csn-detail .csn-reveal-t{clip-path:inset(100% 0 0 0)}
.csn-detail .csn-media-reveal.in{clip-path:inset(0)}

/* Section label typography */
.csn-detail .csn-label{
  font-family:var(--font-body);font-size:10.5px;line-height:1.2;font-weight:650;
  letter-spacing:.18em;text-transform:uppercase
}

/* Dedicated sticky rail used by all narrative sections.
   The rail's containing block is the full section, so the label pins
   reliably for the entire reading span and releases at section end. */
.csn-section-shell{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:stretch
}
.csn-section-rail{
  grid-column:1/3;position:relative;min-width:0
}
.csn-section-rail .csn-label{
  position:-webkit-sticky;
  position:sticky;
  top:var(--csn-sticky-top);
  z-index:5;
  width:max-content;
  max-width:100%;
  transition:opacity .3s ease
}

/* HERO */
.csn-hero{
  background:var(--ink2);
  padding:clamp(108px,7.7vw,132px) var(--pad-x) clamp(78px,7vw,108px)
}
.csn-hero-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-back{grid-column:1/4;width:max-content;margin-bottom:clamp(58px,6vw,86px)}
.csn-title{
  grid-column:1/12;margin:0;font-family:var(--font-display);font-weight:700;
  font-size:clamp(54px,6.15vw,96px);line-height:.97;letter-spacing:-.038em;
  text-transform:uppercase;color:var(--paper)
}
.csn-title .hl{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.csn-title .hl>span{
  display:block;transform:translateY(115%);
  transition:transform 1.05s var(--ease-out)
}
.csn-detail.is-ready .csn-title .hl>span{transform:none}
.csn-detail.is-ready .csn-title .hl:nth-child(1)>span{transition-delay:.06s}
.csn-detail.is-ready .csn-title .hl:nth-child(2)>span{transition-delay:.2s}
.csn-detail.is-ready .csn-title .hl:nth-child(3)>span{transition-delay:.34s}
.csn-hero-lower{
  grid-column:1/13;margin-top:clamp(44px,4.6vw,68px);
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-hero-copy{grid-column:1/6;padding-top:clamp(4px,.5vw,8px)}
.csn-intro{
  margin:0;font-family:var(--font-body);font-size:clamp(17px,1.32vw,20px);
  line-height:1.6;font-weight:500;color:var(--grey-d);max-width:43ch
}
.csn-hero-meta{
  margin-top:clamp(28px,2.7vw,38px);display:grid;
  grid-template-columns:minmax(0,.72fr) minmax(0,1.3fr);
  column-gap:clamp(22px,2.6vw,38px);align-items:start
}
.csn-meta-row{display:flex;flex-direction:column;gap:8px}
.csn-meta-row span{
  font-size:9.5px;line-height:1.35;font-weight:650;letter-spacing:.15em;text-transform:uppercase
}
.csn-meta-values{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.csn-meta-row strong{
  display:block;font-family:var(--font-body);font-size:12.5px;line-height:1.45;
  font-weight:560;color:var(--paper)
}
.csn-hero-media{grid-column:6/13;aspect-ratio:16/10;background:var(--slate-2)}

/* PROBLEM — label remains sticky through text + gallery */
.csn-problem{background:var(--ink2);padding:clamp(104px,9.5vw,144px) var(--pad-x) clamp(112px,10.5vw,158px)}
.csn-problem-main{grid-column:3/13;min-width:0}
.csn-problem-head{
  display:grid;grid-template-columns:repeat(10,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-problem-title{
  grid-column:1/6;margin:0;font-family:var(--font-body);
  font-size:clamp(32px,2.85vw,44px);line-height:1.18;font-weight:540;
  letter-spacing:-.028em;color:var(--paper)
}
.csn-problem-context{
  grid-column:7/11;margin:0;font-family:var(--font-body);
  font-size:clamp(15.5px,1.08vw,17.5px);line-height:1.65;color:var(--grey-d)
}
.csn-problem-points{
  margin-top:clamp(62px,6vw,90px);
  border-top:1px solid var(--line-d)
}
.csn-problem-point{
  display:grid;grid-template-columns:36px minmax(0,1fr);
  gap:clamp(20px,2.2vw,34px);align-items:start;
  padding:clamp(19px,1.8vw,26px) 0;border-bottom:1px solid var(--line-d)
}
.csn-problem-index{display:block;width:32px;height:1px;margin-top:.78em}
.csn-problem-point p{
  margin:0;font-family:var(--font-body);font-size:clamp(18px,1.45vw,23px);
  line-height:1.4;font-weight:520;letter-spacing:-.012em;color:var(--paper);max-width:58ch
}

/* Problem gallery begins exactly on the Problem's main content column. */
.csn-problem-gallery-grid{
  margin-top:clamp(72px,7vw,106px);
  display:grid;grid-template-columns:repeat(10,minmax(0,1fr));
  column-gap:clamp(12px,1.2vw,18px);row-gap:clamp(14px,1.5vw,22px);align-items:start
}
.csn-problem-media{overflow:hidden;background:var(--slate-2)}
.csn-problem-gallery-1 .csn-problem-media-solo{grid-column:1/11;aspect-ratio:2.05/1}
.csn-problem-gallery-2 .csn-problem-media-main{grid-column:1/7;aspect-ratio:16/9.7}
.csn-problem-gallery-2 .csn-problem-media-small{grid-column:7/11;aspect-ratio:4/3}
.csn-problem-gallery-3 .csn-problem-media-main{grid-column:1/7;aspect-ratio:16/9.7}
.csn-problem-gallery-3 .csn-problem-media-small{grid-column:7/11;aspect-ratio:4/3}
.csn-problem-gallery-3 .csn-problem-media-wide{grid-column:1/11;aspect-ratio:2.05/1}
.csn-problem-gallery.is-crop-fallback .csn-problem-crop-1 img{object-position:38% 50%;transform:scale(1.03)}
.csn-problem-gallery.is-crop-fallback .csn-problem-crop-2 img{object-position:74% 48%;transform:scale(1.18)}
.csn-problem-gallery.is-crop-fallback .csn-problem-crop-3 img{object-position:52% 72%;transform:scale(1.1)}

/* INSIGHT */
.csn-insight{background:var(--ink2);padding:clamp(124px,12vw,178px) var(--pad-x)}
.csn-insight-main{grid-column:3/13;min-width:0}
.csn-insight-statement{
  margin:0;
  max-width:none;
  width:100%;
  font-family:var(--font-body);
  font-weight:520;
  font-size:clamp(35px,3.65vw,56px);
  line-height:1.14;
  letter-spacing:-.035em;
  color:var(--paper)
}
.csn-insight-support{
  width:55%;
  margin:clamp(34px,3.4vw,48px) 0 0 auto;
  font-family:var(--font-body);
  font-size:clamp(15.5px,1.08vw,17.5px);
  line-height:1.65;
  color:var(--grey-d)
}

/* EXECUTION — label remains sticky through copy + gallery */
.csn-execution{background:var(--ink2);padding:clamp(104px,10vw,152px) var(--pad-x)}
.csn-execution-content{grid-column:3/13;min-width:0}
.csn-execution-head{
  display:grid;grid-template-columns:repeat(10,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-execution-main{grid-column:1/7}
.csn-execution-title{
  margin:0;font-family:var(--font-display);font-weight:700;
  font-size:clamp(38px,4.1vw,62px);line-height:1.02;letter-spacing:-.037em;color:var(--paper)
}
.csn-execution-copy{
  margin:clamp(28px,3vw,42px) 0 0;max-width:51ch;
  font-family:var(--font-body);font-size:clamp(16.5px,1.18vw,19px);
  line-height:1.65;color:var(--grey-d)
}
.csn-services{grid-column:8/11}
.csn-services>span{
  display:block;margin-bottom:15px;font-family:var(--font-body);
  font-size:9.5px;font-weight:650;letter-spacing:.15em;text-transform:uppercase
}
.csn-services>div{
  position:relative;padding:9px 0 9px 28px;
  font-family:var(--font-body);font-size:12.5px;line-height:1.45;color:var(--paper)
}
.csn-services>div::before{
  content:'';position:absolute;left:0;top:16px;width:16px;height:1px
}
.csn-execution-gallery{
  margin-top:clamp(70px,7vw,106px);
  display:grid;grid-template-columns:repeat(10,minmax(0,1fr));
  column-gap:clamp(12px,1.2vw,18px);row-gap:clamp(14px,1.5vw,22px);align-items:start
}
.csn-exec-media{background:var(--slate-2)}
.csn-gallery-1 .csn-exec-solo{grid-column:1/11;aspect-ratio:2.05/1}
.csn-gallery-2 .csn-exec-main{grid-column:1/7;aspect-ratio:16/9.7}
.csn-gallery-2 .csn-exec-small{grid-column:7/11;aspect-ratio:4/3}
.csn-gallery-3 .csn-exec-main{grid-column:1/7;aspect-ratio:16/9.7}
.csn-gallery-3 .csn-exec-small{grid-column:7/11;aspect-ratio:4/3}
.csn-gallery-3 .csn-exec-wide{grid-column:1/11;aspect-ratio:2.05/1}
.csn-execution-gallery.is-crop-fallback .csn-crop-1 img{object-position:38% 50%;transform:scale(1.02)}
.csn-execution-gallery.is-crop-fallback .csn-crop-2 img{object-position:76% 48%;transform:scale(1.24)}
.csn-execution-gallery.is-crop-fallback .csn-crop-3 img{object-position:52% 72%;transform:scale(1.12)}

/* RESULTS — one off-white chapter with sticky label */
.csn-results-chapter{
  background:var(--paper);color:var(--ink);
  padding:clamp(108px,10vw,154px) var(--pad-x) clamp(110px,10vw,152px)
}
.csn-results-main{grid-column:3/13;min-width:0}
.csn-results-detail-head{
  display:grid;grid-template-columns:repeat(10,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-results-detail-title{
  grid-column:1/7;margin:0;font-family:var(--font-display);font-weight:700;
  font-size:clamp(38px,4.1vw,62px);line-height:1.03;letter-spacing:-.038em;color:var(--ink)
}
.csn-results-detail-summary{
  grid-column:7/11;margin:0;font-family:var(--font-body);
  font-size:clamp(15.5px,1.08vw,17.5px);line-height:1.65;color:var(--grey-l)
}
.csn-results-metrics{
  margin-top:clamp(56px,5.5vw,82px);
  display:grid;grid-template-columns:repeat(var(--kpi-cols,2),minmax(0,1fr));
  column-gap:clamp(26px,3.5vw,54px);row-gap:34px
}
.csn-result-metric{min-width:0}
.csn-result-value{
  font-family:var(--font-display);font-size:clamp(56px,5.8vw,86px);line-height:.9;
  font-weight:700;letter-spacing:-.05em;color:var(--ink);white-space:nowrap
}
.csn-result-label{
  margin-top:15px;font-family:var(--font-body);font-size:10.5px;line-height:1.35;
  font-weight:650;color:var(--grey-l)
}
.csn-results-metrics[data-count="1"]{--kpi-cols:1;max-width:38%}
.csn-results-metrics[data-count="2"]{--kpi-cols:2;max-width:68%}
.csn-results-metrics[data-count="3"]{--kpi-cols:3}
.csn-results-metrics[data-count="4"]{--kpi-cols:4}
.csn-results-metrics[data-count="5"]{--kpi-cols:5}
.csn-results-metrics[data-count="4"] .csn-result-value{font-size:clamp(48px,4.8vw,72px)}
.csn-results-metrics[data-count="5"] .csn-result-value{font-size:clamp(42px,4.2vw,64px)}
.csn-result-groups{
  margin-top:clamp(70px,7vw,104px);
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(34px,4vw,64px)
}
.csn-result-group{padding-top:18px;border-top:1px solid var(--line-l)}
.csn-result-group h3{
  margin:0 0 20px;font-family:var(--font-body);font-size:10px;font-weight:650;
  letter-spacing:.15em;text-transform:uppercase
}
.csn-result-facts{display:flex;flex-direction:column}
.csn-result-facts p{
  position:relative;margin:0;padding:11px 0 11px 24px;border-bottom:1px solid var(--line-l);
  font-family:var(--font-body);font-size:13.5px;line-height:1.55;color:var(--grey-l)
}
.csn-result-facts p::before{
  content:'';position:absolute;left:0;top:20px;width:14px;height:1px
}
.csn-result-body{margin-top:18px}
.csn-result-body p{
  margin:0 0 13px;font-family:var(--font-body);font-size:14px;line-height:1.6;color:var(--grey-l)
}
.csn-result-body p:last-child{margin-bottom:0}

/* CLOSING — intentionally darker than the rest */
.csn-closing{background:var(--ink);padding:clamp(116px,11vw,172px) var(--pad-x)}
.csn-closing-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-closing-title{
  grid-column:1/7;margin:0;font-family:var(--font-display);font-weight:700;
  font-size:clamp(42px,4.7vw,72px);line-height:1;letter-spacing:-.04em;color:var(--paper)
}
.csn-closing-copy{grid-column:8/13}
.csn-closing-copy p{
  margin:0 0 17px;font-family:var(--font-body);font-size:clamp(16px,1.18vw,19px);
  line-height:1.65;color:var(--grey-d)
}
.csn-closing-copy p:last-child{margin-bottom:0}

/* OPTIONAL VERIFIED TESTIMONIAL */
.csn-testimonial{
  background:var(--paper);color:var(--ink);
  padding:clamp(108px,10vw,152px) var(--pad-x)
}
.csn-testimonial-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:clamp(16px,1.8vw,28px);align-items:start
}
.csn-testimonial-quote{
  grid-column:3/10;margin:0;font-family:var(--font-display);font-weight:700;
  font-size:clamp(36px,4vw,60px);line-height:1.08;letter-spacing:-.035em;color:var(--ink)
}
.csn-testimonial-attr{
  grid-column:10/13;padding-top:8px;font-family:var(--font-body);
  font-size:10.5px;line-height:1.5;font-weight:650;letter-spacing:.12em;
  text-transform:uppercase;color:var(--grey-l)
}
.csn-testimonial-grid.has-portrait .csn-testimonial-portrait{grid-column:1/3;aspect-ratio:4/5;background:#d8d8d8}
.csn-testimonial-grid.has-portrait .csn-testimonial-quote{grid-column:4/10}

/* PREVIOUS / NEXT */
.csn-pagination{background:var(--ink2);padding:0 var(--pad-x)}
.csn-pagination-grid{
  display:grid;grid-template-columns:1fr 1fr;
  border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d)
}
.csn-page-link{
  display:grid;grid-template-columns:minmax(0,1fr);gap:20px;
  padding:clamp(30px,3vw,44px) 0;text-decoration:none;color:var(--paper);min-width:0
}
.csn-page-prev{padding-right:clamp(28px,4vw,62px)}
.csn-page-next{padding-left:clamp(28px,4vw,62px);border-left:1px solid var(--line-d);text-align:right}
.csn-page-direction{
  font-family:var(--font-body);font-size:9.5px;font-weight:650;
  letter-spacing:.15em;text-transform:uppercase;color:var(--grey-d)
}
.csn-page-media{height:clamp(150px,14vw,210px);overflow:hidden;background:var(--slate-2)}
.csn-page-media>div{width:100%;height:100%}
.csn-page-media img,.csn-page-media video{
  display:block;width:100%;height:100%;object-fit:cover;transition:transform .65s var(--ease-out)
}
.csn-page-next .csn-page-media img,.csn-page-next .csn-page-media video{object-position:62% 50%}
.csn-page-link:hover .csn-page-media img,.csn-page-link:hover .csn-page-media video{transform:scale(1.025)}
.csn-page-copy{min-width:0}
.csn-page-link strong{
  display:block;font-family:var(--font-display);font-size:clamp(30px,3.2vw,49px);
  line-height:1;font-weight:700;letter-spacing:-.035em;transition:color .25s ease
}
.csn-page-link small{
  display:block;margin-top:11px;font-family:var(--font-body);font-size:10.5px;
  line-height:1.4;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--grey-d)
}
.csn-page-link:hover strong{color:var(--red)}

/* TABLET */
@media(max-width:1100px){
  .csn-detail{--csn-sticky-top:84px}
  .csn-title{font-size:clamp(48px,7vw,76px)}
  .csn-problem-title{font-size:clamp(30px,3.5vw,40px)}
  .csn-insight-statement{font-size:clamp(32px,4.5vw,48px);max-width:none}
  .csn-result-value{font-size:clamp(52px,6vw,76px)}
  .csn-results-metrics[data-count="4"] .csn-result-value{font-size:clamp(44px,5vw,62px)}
  .csn-results-metrics[data-count="5"] .csn-result-value{font-size:clamp(38px,4.4vw,56px)}
}

/* SMALL TABLET */
@media(max-width:820px){
  .csn-detail{--csn-sticky-top:80px}
  .csn-title{grid-column:1/9;font-size:clamp(44px,8.2vw,64px)}
  .csn-hero-copy{grid-column:1/4}
  .csn-hero-media{grid-column:4/9}
  .csn-problem-gallery-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .csn-problem-gallery-1 .csn-problem-media-solo{grid-column:1/7}
  .csn-problem-gallery-2 .csn-problem-media-main,
  .csn-problem-gallery-3 .csn-problem-media-main{grid-column:1/5}
  .csn-problem-gallery-2 .csn-problem-media-small,
  .csn-problem-gallery-3 .csn-problem-media-small{grid-column:5/7}
  .csn-problem-gallery-3 .csn-problem-media-wide{grid-column:1/7}
  .csn-execution-gallery{grid-template-columns:repeat(6,minmax(0,1fr))}
  .csn-gallery-1 .csn-exec-solo{grid-column:1/7}
  .csn-gallery-2 .csn-exec-main,.csn-gallery-3 .csn-exec-main{grid-column:1/5}
  .csn-gallery-2 .csn-exec-small,.csn-gallery-3 .csn-exec-small{grid-column:5/7}
  .csn-gallery-3 .csn-exec-wide{grid-column:1/7}
  .csn-results-detail-head{grid-template-columns:repeat(6,minmax(0,1fr))}
  .csn-results-detail-title{grid-column:1/5}
  .csn-results-detail-summary{grid-column:5/7}
  .csn-results-metrics[data-count="1"]{max-width:60%}
  .csn-results-metrics[data-count="2"]{max-width:none}
  .csn-results-metrics[data-count="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
  .csn-results-metrics[data-count="4"],
  .csn-results-metrics[data-count="5"]{grid-template-columns:repeat(2,minmax(0,1fr))}
  .csn-result-groups{grid-template-columns:repeat(2,minmax(0,1fr))}

  .csn-closing-title{grid-column:1/5}
  .csn-closing-copy{grid-column:5/9}
}

/* MOBILE — intentional recomposition, no sticky labels or clip initial states */
@media(max-width:760px){
  .csn-detail{--csn-sticky-top:0}

  .csn-hero,.csn-problem,.csn-insight,.csn-execution,.csn-results-chapter,
  .csn-closing,.csn-testimonial{
    padding-left:22px;padding-right:22px
  }
  .csn-hero{padding-top:94px;padding-bottom:72px}
  .csn-hero-grid,.csn-hero-lower,.csn-problem-grid,.csn-insight-grid,.csn-execution-grid,
  .csn-results-chapter-grid,.csn-closing-grid,.csn-testimonial-grid{
    display:block
  }

  .csn-back{margin-bottom:44px}
  .csn-title{font-size:clamp(39px,11.5vw,54px);line-height:.99}
  .csn-hero-lower{margin-top:28px}
  .csn-intro{font-size:16.5px;line-height:1.58}
  .csn-hero-meta{margin-top:26px;display:grid;grid-template-columns:1fr;gap:18px}
  .csn-meta-row{gap:6px}
  .csn-hero-media{margin-top:32px;aspect-ratio:4/3}

  .csn-detail .csn-label{margin-bottom:20px}
  .csn-problem{padding-top:88px;padding-bottom:94px}
  .csn-problem-title{font-size:clamp(28px,8.2vw,36px);line-height:1.22}
  .csn-problem-context{margin-top:24px;font-size:15.5px}
  .csn-problem-points{margin-top:38px}
  .csn-problem-point{grid-template-columns:28px minmax(0,1fr);gap:14px;padding:16px 0}
  .csn-problem-index{width:28px}
  .csn-problem-point p{font-size:16.5px;line-height:1.45}
  .csn-problem-gallery-grid{
    margin-top:46px;display:grid;grid-template-columns:1fr;gap:14px
  }
  .csn-problem-gallery-1 .csn-problem-media-solo,
  .csn-problem-gallery-2 .csn-problem-media-main,
  .csn-problem-gallery-2 .csn-problem-media-small,
  .csn-problem-gallery-3 .csn-problem-media-main,
  .csn-problem-gallery-3 .csn-problem-media-small,
  .csn-problem-gallery-3 .csn-problem-media-wide{grid-column:1}
  .csn-problem-gallery-1 .csn-problem-media-solo,
  .csn-problem-gallery-2 .csn-problem-media-main,
  .csn-problem-gallery-3 .csn-problem-media-main,
  .csn-problem-gallery-3 .csn-problem-media-wide{aspect-ratio:16/10}
  .csn-problem-gallery-2 .csn-problem-media-small,
  .csn-problem-gallery-3 .csn-problem-media-small{aspect-ratio:4/5}

  .csn-insight{padding-top:92px;padding-bottom:96px}
  .csn-insight-statement{font-size:clamp(29px,8.8vw,40px);line-height:1.18}
  .csn-insight-support{width:100%;margin:26px 0 0;font-size:15.5px}

  .csn-execution{padding-top:92px;padding-bottom:98px}
  .csn-execution-title{font-size:clamp(33px,9.8vw,46px)}
  .csn-execution-copy{margin-top:24px;font-size:16px}
  .csn-services{margin-top:30px}
  .csn-execution-gallery{
    margin-top:44px;display:grid;grid-template-columns:1fr;gap:14px
  }
  .csn-gallery-1 .csn-exec-solo,
  .csn-gallery-2 .csn-exec-main,.csn-gallery-2 .csn-exec-small,
  .csn-gallery-3 .csn-exec-main,.csn-gallery-3 .csn-exec-small,.csn-gallery-3 .csn-exec-wide{grid-column:1}
  .csn-gallery-1 .csn-exec-solo,.csn-gallery-2 .csn-exec-main,
  .csn-gallery-3 .csn-exec-main,.csn-gallery-3 .csn-exec-wide{aspect-ratio:16/10}
  .csn-gallery-2 .csn-exec-small,.csn-gallery-3 .csn-exec-small{aspect-ratio:4/5}

  .csn-results-chapter{padding-top:92px;padding-bottom:100px}
  .csn-results-main{display:block}
  .csn-results-detail-head{display:block}
  .csn-results-detail-title{font-size:clamp(33px,9.7vw,46px)}
  .csn-results-detail-summary{margin-top:24px;font-size:15.5px}
  .csn-results-metrics,
  .csn-results-metrics[data-count]{
    margin-top:44px;max-width:none;
    grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px
  }
  .csn-results-metrics[data-count="1"]{grid-template-columns:1fr}
  .csn-result-value,
  .csn-results-metrics[data-count="4"] .csn-result-value,
  .csn-results-metrics[data-count="5"] .csn-result-value{
    font-size:clamp(43px,12.5vw,60px);white-space:normal
  }
  .csn-result-groups{margin-top:52px;grid-template-columns:1fr;gap:34px}

  .csn-closing{padding-top:94px;padding-bottom:100px}
  .csn-closing-title{font-size:clamp(37px,10.8vw,52px)}
  .csn-closing-copy{margin-top:28px}

  .csn-testimonial{padding-top:92px;padding-bottom:96px}
  .csn-testimonial-portrait{width:min(64vw,230px);margin:0 0 32px}
  .csn-testimonial-quote{font-size:clamp(32px,9.2vw,44px)}
  .csn-testimonial-attr{margin-top:22px}

  .csn-pagination{padding-left:22px;padding-right:22px}
  .csn-pagination-grid{display:block}
  .csn-page-link{padding:28px 0}
  .csn-page-prev{padding-right:0}
  .csn-page-next{padding-left:0;border-left:0;border-top:1px solid var(--line-d);text-align:left}
  .csn-page-media{height:auto;aspect-ratio:16/9}
  .csn-page-link strong{font-size:clamp(29px,8.8vw,40px)}

  /* Mobile must never depend on clipped initial media states. */
  .csn-detail .csn-media-reveal{clip-path:none!important}
}

@media(max-width:390px){
  .csn-title{font-size:clamp(37px,11vw,49px)}
  .csn-results-metrics[data-count]{grid-template-columns:1fr}
  .csn-result-value,
  .csn-results-metrics[data-count="4"] .csn-result-value,
  .csn-results-metrics[data-count="5"] .csn-result-value{
    font-size:clamp(42px,12vw,56px)
  }
}

@media(prefers-reduced-motion:reduce){
  .csn-detail .csd-rv{opacity:1!important;transform:none!important;transition:none!important}
  .csn-detail .csn-media-reveal{clip-path:none!important;transition:none!important}
  .csn-detail .csn-media-inner{transform:none!important;transition:none!important}
  .csn-title .hl>span{transform:none!important;transition:none!important}
}



/* case-studies intro missing from earlier extract */
.case-studies-page{background:var(--ink2);min-height:100vh}
.cs-intro{
  min-height:clamp(360px,44vw,520px);
  padding:clamp(122px,9vw,148px) var(--pad-x) clamp(46px,4vw,60px);
  display:flex;
}
.cs-intro-grid{width:100%;grid-template-rows:auto 1fr;align-items:start}
.cs-intro-copy{grid-column:1/10;grid-row:1}
.cs-intro .label{display:block;margin-bottom:18px}
.cs-intro h1{font-size:clamp(42px,4.9vw,74px);line-height:.98;max-width:none}
.insights-intro .cs-intro-copy{grid-column:1/13}

/* consultation / contact form — HTML .c-form chrome on live Repraesent fields */
.c-form,
.repraesent-lead-form.c-form,
.ucena-consult-form .repraesent-lead-form{
  max-width:none;
  display:flex;
  flex-direction:column;
  gap:30px;
}
.c-form>*,
.repraesent-lead-form.c-form>*{
  opacity:0;
  transform:translateY(16px);
  transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);
}
.c-form>*.in,
.repraesent-lead-form.c-form>*.in{opacity:1;transform:none}
.c-row2,.uc-form-row.c-row2{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:0}
.c-field,.uc-form .c-field,.repraesent-lead-form .c-field{
  display:flex;flex-direction:column;gap:7px;margin:0
}
.c-field label,.uc-form .c-field label,.repraesent-lead-form .c-field label{
  font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(235,235,235,.55);margin:0
}
.c-input{position:relative;display:block}
.c-input::before,.c-input::after{
  content:'';position:absolute;left:0;right:0;bottom:0;pointer-events:none
}
.c-input::before{height:1px;background:rgba(235,235,235,.16)}
.c-input::after{
  height:1px;background:var(--red);transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease-out)
}
.c-input:focus-within::after{transform:scaleX(1)}
.c-field input,.c-field textarea,
.repraesent-lead-form .c-field input,
.repraesent-lead-form .c-field textarea{
  width:100%;background:transparent;border:none;border-radius:0;border-bottom:0;
  font-family:var(--font-body);font-size:16px;color:var(--paper);padding:0
}
.c-field input{height:48px;padding:0 2px}
.c-field textarea{min-height:118px;padding:9px 2px 14px;resize:vertical;line-height:1.5}
.c-field input::placeholder,.c-field textarea::placeholder{color:rgba(235,235,235,.35)}
.c-field input:focus,.c-field textarea:focus{outline:none}
.c-submit-row,.uc-form-submit.c-submit-row{
  display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:4px
}
.c-note,.c-submit-row .uc-form-note{color:var(--grey-d);font-size:13.5px}
.repraesent-lead-form.c-form button[type="submit"]{
  background:var(--red);color:var(--ink);border:none;padding:0
}

.product-consultation .c-field label,
.product-consultation .uc-field label{color:rgba(20,20,20,.72)}
.product-consultation .c-input::before{background:rgba(20,20,20,.28)}
.product-consultation .c-input::after{background:var(--ink)}
.product-consultation .c-field input,
.product-consultation .c-field textarea{
  color:var(--ink);color-scheme:light
}
.product-consultation .c-field input::placeholder,
.product-consultation .c-field textarea::placeholder{color:rgba(20,20,20,.46)}
.product-consultation .btn--red,
.product-consultation .btn--cta{background:var(--ink);color:var(--paper)}
.product-consultation .c-note,
.product-consultation .uc-form-note{color:rgba(20,20,20,.62)}

@media(max-width:767px){
  .c-row2,.uc-form-row.c-row2{grid-template-columns:1fr;gap:26px}
  .c-submit-row,.uc-form-submit.c-submit-row{flex-direction:column;align-items:flex-start;gap:16px}
  .product-consultation .c-submit-row .btn{width:100%;justify-content:center}
}