.attention-intro{padding:160px 0 100px;background:#101011}.attention-heading{position:relative;min-height:390px}.attention-heading h1{font-size:clamp(45px,6vw,84px);position:relative;z-index:1;display:inline-block;background:#101011;padding-right:30px}.attention-heading h2{position:absolute;right:0;bottom:0;font-size:clamp(42px,5vw,70px);background:#101011;padding-left:30px}.attention-heading h2 span{color:#ff5b16}.attention-rail{position:absolute;left:0;top:70px;width:100%;height:230px;overflow:visible;fill:none;stroke-width:2}.rail-base{stroke:#ff5b1630}.rail-light{stroke:#ff5b16;filter:drop-shadow(0 0 4px #ff5b16);stroke-dasharray:1;stroke-dashoffset:0}.rail-arrow{stroke:#ff5b16;stroke-width:3}.attention-intro.is-entering .rail-light{animation:trace-rail 1.7s .35s ease-in-out both}.attention-intro.is-entering .rail-arrow{animation:arrow-arrive .4s 1.8s both}.attention-intro.is-entering h1{animation:arrive-text .7s both}.attention-intro.is-entering h2{animation:arrive-text .7s 1.9s both}.attention-copy{max-width:710px;margin:75px auto 0}.attention-copy p{font-size:24px;line-height:1.65;color:#d0c9c6}.attention-copy p+p{font-size:18px;color:#a9a5ad;margin-top:24px}.attention-copy a{margin-top:35px}.more-work,.lab-invite{padding-block:110px;border-top:1px solid #ffffff20}.more-work>p,.lab-invite>p{font-size:18px;max-width:630px;color:#aaa6af;margin:28px 0 40px}.category-picker{border-block:1px solid #ffffff25;padding:25px 0;max-width:950px}.category-picker summary{font-size:23px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:25px;align-items:center;min-height:44px}.category-picker summary::-webkit-details-marker{display:none}.category-picker summary>span{color:#ff5b16;font-size:30px}.category-picker[open] summary>span{transform:rotate(45deg)}.category-picker nav{display:grid;grid-template-columns:1fr 1fr;gap:0 50px;padding-top:25px}.category-picker a{padding:18px 0;font-size:15px;color:#ddd6d3;border-bottom:1px solid #ffffff15}.category-picker a:hover{color:#ff5b16}.lab-invite h2{font-size:clamp(35px,5vw,62px)}.catalog-intro{padding-top:170px;padding-bottom:65px}.catalog-intro h1{max-width:1100px}.catalog-intro h1 span{color:#aaa7af}.catalog-intro>p{max-width:720px;font-size:18px;color:#b8b3bc;margin:32px 0}.catalog-filters{display:flex;gap:10px;flex-wrap:wrap;padding-block:20px;border-block:1px solid #ffffff20}.catalog-filters button{background:none;color:#d4ced4;border:1px solid #ffffff25;border-radius:30px;padding:12px 17px;min-height:44px;font-size:12px}.catalog-filters button[aria-pressed=true]{background:#f0ebe7;color:#191719}.catalog-status{color:#aaa4af;font-size:12px;margin:25px 0}.catalog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:60px 28px;padding-bottom:100px}.catalog-item[hidden]{display:none}.catalog-cover{height:230px;border-radius:12px;overflow:hidden;background:#242327}.catalog-cover img{width:100%;height:100%;object-fit:cover}.catalog-wordmark{height:100%;display:flex;align-items:end;padding:28px;background:#242224;color:#ff5b16}.catalog-wordmark span{font-size:30px;line-height:1.2;letter-spacing:-.025em}.catalog-kind{font-size:11px;color:#ff5b16;margin:23px 0 12px}.catalog-item h2{font-size:24px;line-height:1.2}.catalog-item h3{font-size:16px;margin:18px 0 12px;line-height:1.5}.catalog-item>p:not(.catalog-kind){font-size:14px;line-height:1.7;color:#aaa5b1}.catalog-item a{font-size:13px;margin-top:22px;min-height:44px}.lab-register{display:grid;grid-template-columns:1fr 1fr;gap:0 90px;padding-bottom:60px}.lab-register article{padding:42px 0;border-top:1px solid #ffffff25;scroll-margin-top:110px}.lab-register article>span{font-size:12px;color:#ff5b16}.lab-register h2{font-size:29px;margin-top:16px}.lab-register p{font-size:16px;color:#b9b4bd;margin-top:22px}.lab-register summary{font-size:13px;cursor:pointer;padding:20px 0;min-height:44px;color:#e0dad6}.lab-register details p{font-size:14px;margin-top:0}.light-feature{background:#f3ede5;color:#201c1a}.light-feature .featured-heading p{color:#994a20}.light-feature .featured-heading h2 span{color:#776352}.light-feature .pinned-narrative p,.light-feature .project-outcome p{color:#61574e}.light-feature .problem-pane h3{color:#372921}.light-feature .solution-pane h3{color:#a74416}.light-feature .project-outcome{border-color:#0002}.light-feature .client-voice h3{color:#71645b}.light-feature .client-voice blockquote{color:#30271f}.light-feature .client-voice>p{color:#9f461e}.light-feature .client-voice>p>span{color:#75665b}.light-feature .client-voice a{color:#6d402a}.light-feature .scene-progress{color:#776152}.light-feature .scene-progress span:first-child{color:#9f461e}.light-feature .scene-progress i{background:#9f461e40}.proskin-cover{background:#d9c7b3;padding:38px 42px;color:#34271f;min-height:370px;border-radius:12px;position:relative}.proskin-cover img{width:64px;height:64px;object-fit:cover;border-radius:50%;position:absolute;right:35px;top:30px}.proskin-cover>p{font-size:12px;margin-bottom:55px}.proskin-cover strong{font-size:clamp(48px,5vw,74px);line-height:1.05;font-weight:500;letter-spacing:-.04em}.proskin-cover em{font-family:Lora,Georgia,serif;color:inherit}.proskin-cover>span{display:block;font-size:13px;margin-top:35px}.problem-pane h3{color:#ff5b16}.solution-pane h3{color:#ff5b16}.client-voice{overflow:clip}.catalog-empty{padding:30px 0;color:#aaa}.catalog-intro+.catalog{min-height:50vh}@keyframes trace-rail{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}@keyframes arrow-arrive{from{opacity:0}to{opacity:1}}@keyframes arrive-text{from{opacity:.1;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(max-width:950px){.catalog-grid{grid-template-columns:1fr 1fr}.attention-heading{min-height:350px}.attention-rail{top:55px;height:210px}.attention-heading h2{font-size:46px}.lab-register{gap:0 45px}.light-feature .device-scene{max-width:650px}}
@media(max-width:600px){.attention-intro{padding-top:125px;padding-bottom:65px}.attention-heading{min-height:330px}.attention-heading h1{font-size:39px;padding-right:10px}.attention-heading h2{font-size:39px;bottom:0;padding-left:15px}.attention-rail{top:55px;height:195px}.attention-copy{margin-top:40px}.attention-copy p{font-size:20px}.attention-copy p+p{font-size:16px}.attention-copy a{font-size:12px}.more-work,.lab-invite{padding-block:75px}.category-picker summary{font-size:19px}.category-picker nav{grid-template-columns:1fr}.catalog-intro{padding-top:130px;padding-bottom:40px}.catalog-intro h1{font-size:43px}.catalog-intro>p{font-size:16px}.catalog-grid,.lab-register{grid-template-columns:1fr}.catalog-grid{gap:40px}.catalog-cover{height:240px}.catalog-filters{gap:8px}.catalog-filters button{font-size:11px;padding:11px 13px}.proskin-cover{padding:25px;min-height:340px}.proskin-cover img{right:22px;top:23px;width:55px;height:55px}.proskin-cover strong{font-size:48px}.light-feature .device-scene{padding-right:0}.light-feature .device-scene figcaption{font-size:10px;color:#71645b}}
@media(prefers-reduced-motion:reduce){.attention-intro *{animation:none!important}.client-voice blockquote{opacity:1!important;transform:none!important}}

.attention-heading h1{padding-right:0}.attention-heading h2{padding-left:0}.attention-heading h2 .attention-end{color:inherit}.attention-rail{top:0;height:100%;pointer-events:none}

.attention-heading{min-height:450px}.attention-heading h1{font-size:clamp(32px,5.3vw,72px)}.attention-heading h2{font-size:clamp(34px,4.5vw,62px);line-height:1.12;text-align:left;letter-spacing:-.035em}.attention-heading h1 .attention-start{color:#ffffff}@media(max-width:600px){.attention-heading{min-height:375px}.attention-heading h1{font-size:31px}.attention-heading h2{font-size:35px}}

/* The opening sequence follows native scrolling in both directions. */
.attention-intro.is-scroll-led{height:320svh;padding:0;position:relative}
.is-scroll-led>.wrap{position:sticky;top:80px;height:calc(100svh - 80px);padding-top:40px;padding-bottom:22px}
.is-scroll-led .attention-heading{min-height:0;height:min(45svh,405px)}
.is-scroll-led .attention-heading h1{opacity:calc(.12 + var(--intro-start,0)*.88);transform:translateY(calc((1 - var(--intro-start,0))*28px))}
.is-scroll-led .rail-light{stroke-dashoffset:calc(1 - var(--intro-rail,0));animation:none}
.is-scroll-led .rail-arrow{opacity:var(--intro-end,0);animation:none}
.is-scroll-led .attention-heading h2{opacity:var(--intro-end,0);transform:translateY(calc((1 - var(--intro-end,0))*28px));animation:none}
.is-scroll-led .attention-copy{margin-top:30px;opacity:var(--intro-copy,0);transform:translateY(calc((1 - var(--intro-copy,0))*40px))}
.is-scroll-led .attention-copy p{font-size:20px;line-height:1.5}.is-scroll-led .attention-copy p+p{font-size:16px;margin-top:16px}.is-scroll-led .attention-copy a{margin-top:20px}
@media(max-width:600px){.is-scroll-led>.wrap{top:70px;height:calc(100svh - 70px);padding-top:32px}.is-scroll-led .attention-heading{height:40svh}.is-scroll-led .attention-copy{margin-top:28px}.is-scroll-led .attention-copy p{font-size:17px}.is-scroll-led .attention-copy p+p{font-size:14px}.is-scroll-led .attention-heading h2{font-size:32px}.is-scroll-led .attention-heading h1{font-size:30px}}

:root{--orange:#ff5b16;--paper:#ffffff}.attention-heading h2 span{color:#ff5b16}.attention-heading h2 .attention-end{color:#ffffff}.attention-heading h1 .attention-start{color:#ffffff}.rail-light,.rail-arrow{stroke:#ff5b16}.rail-base{stroke:#ff5b1630}.rail-light{filter:drop-shadow(0 0 4px #ff5b16)}.light-feature{background:#ffffff}.light-feature .problem-pane h3,.light-feature .solution-pane h3{color:#201c1a}.client-voice blockquote{color:#ffffff}.light-feature .client-voice blockquote{color:#201c1a}



/* ========================================================
   PORTFOLIO MOBILE OPTIMIZATION
   ======================================================== */
@media (max-width: 650px) {
  .attention-intro { padding-top: 100px !important; padding-bottom: 40px !important; }
  .attention-heading { min-height: 280px !important; }
  .attention-heading h1 { font-size: 34px !important; }
  .attention-heading h2 { font-size: 34px !important; }
  
 
  .attention-summary { padding-block: 40px 60px !important; }
  .summary-stage > p { font-size: 20px !important; }
  .summary-stage > p + p { font-size: 15px !important; margin-top: 16px !important; }
  
  .more-work, .lab-invite { padding-block: 50px !important; }
  .catalog-intro { padding-top: 90px !important; padding-bottom: 30px !important; }
}

.rail-arrow, svg .rail-arrow {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}