@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Fraunces:opsz,wght@9..144,300;9..144,700&display=swap');
:root{--acid:#22d118;--coral:#ff5a42;--ink:#10110f;--bone:#f1eee5;--paper:#faf8f1;--blue:#b8d7ff;--yellow:#f6df63;--line:#c8c5bb}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bone);color:var(--ink);font-family:"DM Sans",Arial,sans-serif;overflow-x:hidden}a{color:inherit}.topbar{height:86px;padding:0 3vw;display:flex;align-items:center;gap:25px;border-bottom:2px solid var(--ink);position:sticky;top:0;background:rgba(241,238,229,.96);z-index:30}.brand{width:175px;height:64px;overflow:hidden;display:flex;align-items:center}.brand img{width:175px}.topbar>p{font-size:9px;line-height:1.3;text-transform:uppercase;letter-spacing:.12em;border-left:1px solid;padding-left:18px}.topbar nav{display:flex;gap:24px;margin-left:auto}.topbar nav a{font-size:12px;text-decoration:none;font-weight:700}.talk{background:var(--acid);border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:12px 17px;text-decoration:none;font-weight:700;font-size:12px}.talk span{margin-left:15px}.menu-button{display:none}.hero{min-height:810px;display:grid;grid-template-columns:1.1fr .9fr;border-bottom:2px solid var(--ink)}.hero-copy{padding:75px 5vw}.label{font-size:10px;font-weight:700;letter-spacing:.15em}.hero h1{font:700 clamp(68px,8.2vw,130px)/.78 "Fraunces",Georgia,serif;letter-spacing:-.07em;margin:55px 0 25px}.hero h1 span{color:var(--coral);font-style:italic}.scribble{display:inline-block;background:var(--acid);border:2px solid var(--ink);transform:rotate(-2deg);font:700 21px "Fraunces",serif;padding:10px 18px;box-shadow:5px 5px 0 var(--ink)}.intro{font-size:18px;line-height:1.55;max-width:650px;margin:45px 0}.hero-actions{display:flex;gap:12px}.hero-actions a{min-width:230px;border:2px solid var(--ink);padding:16px;text-decoration:none;font-weight:700;display:flex;justify-content:space-between}.hero-actions a:first-child{background:var(--ink);color:white}.hero-stage{border-left:2px solid var(--ink);background:var(--blue);position:relative;overflow:hidden;min-height:724px}.card{position:absolute;border:2px solid var(--ink);padding:23px;width:285px;min-height:145px;display:flex;flex-direction:column;box-shadow:8px 8px 0 var(--ink)}.card small{font-size:9px;letter-spacing:.15em}.card strong{font:700 28px "Fraunces";margin:22px 0 8px}.card span{font-size:11px}.card-a{background:var(--yellow);top:75px;left:35px;transform:rotate(-5deg)}.card-b{background:white;top:280px;right:30px;transform:rotate(6deg)}.card-c{background:var(--acid);bottom:55px;left:50px;transform:rotate(-2deg)}.not-package{position:absolute;right:-18px;top:55px;background:var(--coral);border:2px solid;padding:13px;font-weight:700;transform:rotate(8deg)}.orbit{position:absolute;width:150px;height:150px;border:3px solid;border-radius:50%;display:grid;place-items:center;font:700 95px "Fraunces";left:45%;top:44%;transform:translate(-50%,-50%)}.ticker{border-bottom:2px solid var(--ink);background:var(--acid);overflow:hidden;white-space:nowrap;padding:13px 0;font-weight:700;font-size:13px;letter-spacing:.08em}.ticker div{width:max-content;animation:ticker 23s linear infinite}@keyframes ticker{to{transform:translateX(-50%)}}.diagnose{padding:110px 5vw;background:var(--paper);border-bottom:2px solid}.diagnose>header{display:grid;grid-template-columns:.4fr 1fr .7fr;gap:50px}.diagnose>header>span,.case-head>span,.portfolio-head>span,.process-title>span{font-size:10px;font-weight:700;letter-spacing:.15em}.diagnose h2,.case h2,.portfolio h2,.process-title h2,.contact h2{font:700 clamp(58px,7vw,105px)/.82 "Fraunces";letter-spacing:-.055em;margin:0}.diagnose h2 em,.process-title em,.contact h2 em{color:var(--coral)}.diagnose>header>p{line-height:1.6}.diagnose-buttons{display:grid;grid-template-columns:1fr 1fr;margin-top:70px;border:1px solid}.diagnose-buttons button{min-height:210px;padding:25px;text-align:left;border:1px solid;background:var(--bone);display:grid;grid-template-columns:45px 1fr 25px;cursor:pointer}.diagnose-buttons button:hover,.diagnose-buttons button.active{background:var(--yellow)}.diagnose-buttons span{font-size:10px}.diagnose-buttons strong{font:700 27px "Fraunces"}.diagnose-buttons small{grid-column:2;font-size:12px;line-height:1.5;max-width:350px}.diagnose-buttons i{font-style:normal;font-size:22px}.diagnosis{margin-top:14px;background:var(--ink);color:white;padding:35px;display:grid;grid-template-columns:120px 1fr;gap:35px}.diagnosis-id{width:100px;height:100px;border:2px solid var(--acid);border-radius:50%;display:grid;place-items:center;color:var(--acid);font:700 55px "Fraunces"}.diagnosis small{color:var(--acid);letter-spacing:.15em}.diagnosis h3{font:700 40px "Fraunces";margin:10px 0}.diagnosis p{color:#b6bdb6;line-height:1.6;max-width:800px}.diagnosis a{display:inline-block;background:var(--acid);color:var(--ink);padding:12px 15px;font-weight:700;text-decoration:none}.manifesto{min-height:600px;padding:100px 6vw;background:var(--coral);display:grid;grid-template-columns:70px 1.2fr .55fr;gap:60px;border-bottom:2px solid}.vertical{writing-mode:vertical-rl;transform:rotate(180deg);font-size:10px;font-weight:700;letter-spacing:.18em}.manifesto span{font-size:10px;font-weight:700;letter-spacing:.15em}.manifesto h2{font:300 clamp(56px,6vw,94px)/.93 "Fraunces";letter-spacing:-.05em;margin:45px 0}.manifesto h2 b{background:var(--yellow);padding:0 8px}.manifesto h2 i{color:white}.manifesto aside{align-self:end;border-top:2px solid;padding-top:20px;line-height:1.6}.capabilities{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:2px solid}.cap{min-height:620px;padding:35px;position:relative;overflow:hidden;border-right:2px solid}.cap>span{font-size:10px}.cap>p{font-size:11px;font-weight:700;letter-spacing:.15em;margin-top:50px}.cap h3{font:700 42px/1 "Fraunces";max-width:350px;margin:25px 0 80px}.cap ul{list-style:none;padding:0;position:relative;z-index:2}.cap li{padding:12px 0;border-top:1px solid}.cap-symbol{position:absolute;font:700 320px/.8 "Fraunces";right:-30px;bottom:-25px;opacity:.12}.cap-one{background:var(--yellow)}.cap-two{background:var(--blue)}.cap-three{background:var(--acid)}.case{padding:110px 5vw;background:var(--ink);color:white;border-bottom:2px solid var(--ink)}.case-head{display:grid;grid-template-columns:.4fr 1fr .55fr;gap:50px}.case-head p{line-height:1.6;align-self:end;color:#adb5ae}.case-flow{display:grid;grid-template-columns:.75fr 1.25fr;gap:70px;margin-top:85px}.pool-shape{background:var(--blue);height:440px;border-radius:48% 52% 35% 65%/55% 35% 65% 45%;display:grid;place-items:center;color:var(--ink);text-align:center;font:700 27px/1.1 "Fraunces";transform:rotate(-4deg)}.case ol{list-style:none;padding:0}.case li{display:grid;grid-template-columns:65px 1fr;border-top:1px solid #424842;padding:22px 0;font-size:18px}.case li b{color:var(--acid);font-size:11px}.case blockquote{font:300 clamp(37px,4vw,64px)/1.1 "Fraunces";margin:75px 0 0;text-align:center;color:#c8cec8}.case blockquote strong{color:var(--acid)}.portfolio{padding:110px 5vw;background:var(--paper)}.portfolio-head{display:grid;grid-template-columns:.4fr 1fr .6fr;gap:50px;margin-bottom:70px}.portfolio-head p{line-height:1.6}.work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.work-grid a{position:relative;text-decoration:none;border:2px solid;padding:13px;background:var(--bone);box-shadow:6px 6px 0 var(--ink);transition:.2s;opacity:0;transform:translateY(35px)}.work-grid a.reveal{opacity:1;transform:none}.work-grid a:hover{transform:translate(-3px,-3px);box-shadow:10px 10px 0 var(--coral)}.work-grid a:nth-child(1){grid-column:1/7}.work-grid a:nth-child(2){grid-column:7/13;margin-top:80px}.work-grid a:nth-child(3){grid-column:2/6}.work-grid a:nth-child(4){grid-column:6/10;margin-top:55px}.work-grid a:nth-child(5){grid-column:9/13}.work-grid img{width:100%;height:280px;object-fit:cover;filter:saturate(.8)}.work-grid span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.14em;margin-top:15px}.work-grid h3{font:700 27px "Fraunces";margin:7px 0}.work-grid i{position:absolute;right:18px;bottom:20px;font-style:normal;color:var(--coral)}.process-section{padding:110px 5vw;background:var(--blue);display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;border-top:2px solid;border-bottom:2px solid}.process-title h2{margin-top:40px}.process-list article{display:grid;grid-template-columns:60px 1fr;gap:15px;border-top:2px solid;padding:24px 0}.process-list b{font-size:11px}.process-list h3{font:700 27px "Fraunces";margin:0}.process-list p{grid-column:2;line-height:1.5;margin:0}.promise{padding:100px 6vw;background:var(--acid);display:grid;grid-template-columns:.35fr 1fr .7fr;gap:70px;align-items:center;border-bottom:2px solid}.stamp{width:180px;height:180px;border:4px solid;border-radius:50%;display:grid;place-items:center;text-align:center;font-weight:700;transform:rotate(-9deg);box-shadow:inset 0 0 0 8px var(--acid),inset 0 0 0 10px var(--ink)}.promise span{font-size:10px;font-weight:700;letter-spacing:.15em}.promise h2{font:700 58px/.95 "Fraunces";margin:25px 0}.promise ul{list-style:none;padding:0}.promise li{border-top:2px solid;padding:13px 0}.contact{padding:120px 6vw;background:var(--bone)}.contact>p{font-size:10px;font-weight:700;letter-spacing:.15em}.contact h2{font-size:clamp(70px,10vw,155px);margin:45px 0}.contact-bottom{display:grid;grid-template-columns:1fr 1fr;gap:8vw}.contact-bottom>p{font-size:20px;line-height:1.5}.contact-bottom>div{display:flex;flex-direction:column}.contact-bottom a{font:700 28px "Fraunces";padding:18px 0;border-top:2px solid;text-decoration:none;display:flex;justify-content:space-between}.contact-bottom b{color:var(--coral)}footer{padding:35px 4vw;background:var(--ink);color:white;display:flex;align-items:center;gap:35px}footer img{width:145px}footer>span{font-size:10px}footer div{margin-left:auto;display:flex;gap:20px;font-size:10px;align-items:center}section:not(.hero){opacity:.01;transform:translateY(35px);transition:.6s ease}section.reveal{opacity:1;transform:none}
@media(max-width:900px){.topbar>p,.topbar nav,.talk{display:none}.menu-button{display:block;margin-left:auto;background:var(--acid);border:2px solid;padding:9px;font-weight:700}.topbar nav.open{display:flex;position:absolute;top:86px;left:0;right:0;background:var(--ink);color:white;padding:25px;flex-direction:column}.hero{grid-template-columns:1fr}.hero-stage{border-left:0;border-top:2px solid;min-height:620px}.diagnose>header,.case-head,.portfolio-head{grid-template-columns:1fr}.diagnose-buttons{grid-template-columns:1fr}.manifesto{grid-template-columns:1fr}.vertical{writing-mode:initial;transform:none}.capabilities{grid-template-columns:1fr}.cap{min-height:500px;border-right:0;border-bottom:2px solid}.case-flow,.process-section,.promise,.contact-bottom{grid-template-columns:1fr}.work-grid{grid-template-columns:1fr}.work-grid a:nth-child(n){grid-column:auto;margin-top:0}.portfolio-head{gap:25px}.promise{gap:35px}.hero h1{font-size:76px}.hero-copy{padding:55px 25px}.hero-actions{flex-direction:column}.ticker{font-size:11px}footer{flex-direction:column;align-items:flex-start}footer div{margin-left:0;flex-wrap:wrap}}
@media(max-width:560px){.brand,.brand img{width:145px}.hero h1{font-size:59px}.card{width:250px}.card-a{left:15px}.card-b{right:15px}.card-c{left:25px}.diagnose,.case,.portfolio,.process-section,.promise,.contact{padding:75px 22px}.diagnosis{grid-template-columns:1fr}.manifesto{padding:75px 22px}.manifesto h2{font-size:55px}.work-grid img{height:220px}.contact-bottom a{font-size:21px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}section:not(.hero),.work-grid a{opacity:1;transform:none}}

/* Final layout pass */
section:not(.hero),section.reveal{opacity:1;transform:none}.portfolio{border-bottom:2px solid var(--ink)}.portfolio-head{align-items:end}.portfolio-head>p{max-width:420px}.portfolio-head h2{max-width:760px}.work-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}.work-grid a{opacity:1;transform:none;display:flex;flex-direction:column;min-width:0;margin-top:0!important}.work-grid a:nth-child(1){grid-column:1/8}.work-grid a:nth-child(2){grid-column:8/13;background:var(--blue)}.work-grid a:nth-child(3){grid-column:1/5;background:var(--yellow)}.work-grid a:nth-child(4){grid-column:5/9;background:var(--acid)}.work-grid a:nth-child(5){grid-column:9/13;background:var(--bone)}.work-grid a:nth-child(-n+2) img{height:420px}.work-grid a:nth-child(n+3) img{height:245px}.work-grid h3{padding-right:35px}.work-grid i{font-size:22px}.diagnose>header,.case-head,.portfolio-head,.process-section,.promise,.contact-bottom{max-width:1500px;margin-left:auto;margin-right:auto}.diagnosis,.diagnose-buttons,.case-flow,.case blockquote,.work-grid{max-width:1500px;margin-left:auto;margin-right:auto}.capabilities{max-width:1800px;margin-left:auto;margin-right:auto}.process-list{align-self:start}.topbar{backdrop-filter:blur(10px)}.contact-bottom{align-items:end}
@media(max-width:900px){.work-grid{grid-template-columns:1fr}.work-grid a:nth-child(n){grid-column:auto}.work-grid a:nth-child(n) img{height:280px}.portfolio-head{align-items:start}}

/* Complete responsive refinement */
.portfolio h2{font-size:clamp(52px,6.2vw,92px)}
.work-grid a{padding:14px 14px 18px;overflow:hidden}
.project-copy{padding:2px 2px 0;display:flex;flex:1;flex-direction:column}
.work-grid .project-copy span{min-height:13px}
.work-grid .project-copy p{font-size:13px;line-height:1.5;margin:2px 42px 0 0;max-width:520px}
.work-grid i{bottom:19px}
.work-grid a:nth-child(-n+2) .project-copy{min-height:138px}
.work-grid a:nth-child(n+3) .project-copy{min-height:160px}
.process-list article:last-child,.promise li:last-child,.contact-bottom a:last-child{border-bottom:2px solid}
.topbar nav a,.talk,.hero-actions a,.diagnose-buttons button,.contact-bottom a{transition:transform .18s ease,background-color .18s ease,color .18s ease}
.topbar nav a:hover{color:var(--coral)}
.talk:hover,.hero-actions a:hover{transform:translate(-2px,-2px)}
.diagnose-buttons button:focus-visible,.menu-button:focus-visible,a:focus-visible{outline:4px solid var(--coral);outline-offset:4px}

@media(max-width:1100px){
  .topbar{padding:0 24px}.topbar nav{gap:16px}
  .hero{grid-template-columns:1fr 44%}.hero-copy{padding:65px 4vw}
  .hero h1{font-size:clamp(66px,8vw,96px)}
  .diagnose>header,.case-head,.portfolio-head{grid-template-columns:150px 1fr}.diagnose>header>p,.case-head>p,.portfolio-head>p{grid-column:2}
  .cap{padding:28px}.cap h3{font-size:36px}
}
@media(max-width:900px){
  .topbar{height:76px;padding:0 20px}.topbar nav.open{top:76px}.brand{height:56px}
  .hero{display:block;min-height:0}.hero-copy{padding:54px 30px 60px}.hero-stage{min-height:560px}
  .hero h1{font-size:clamp(66px,14vw,94px);margin:44px 0 22px}
  .diagnose>header,.case-head,.portfolio-head{grid-template-columns:1fr}.diagnose>header>p,.case-head>p,.portfolio-head>p{grid-column:auto}
  .diagnose-buttons button{min-height:170px}
  .manifesto{gap:18px}.manifesto aside{margin-top:15px}
  .capabilities{display:block}.cap{min-height:440px;padding:34px 30px}
  .case-flow{gap:38px}.pool-shape{height:360px;max-width:600px;width:100%;margin:auto}
  .work-grid{gap:22px}.work-grid a:nth-child(n){width:100%}.work-grid a:nth-child(n) img{height:auto;aspect-ratio:16/9}
  .work-grid a:nth-child(n) .project-copy{min-height:0;padding-bottom:8px}
  .process-section{gap:55px}.promise{justify-items:start}
  .stamp{width:150px;height:150px}
}
@media(max-width:560px){
  .topbar{padding:0 16px}.brand,.brand img{width:138px}.menu-button{font-size:11px}
  .hero-copy{padding:44px 20px 48px}.hero h1{font-size:clamp(56px,17vw,76px);line-height:.82}
  .scribble{font-size:18px;padding:9px 13px}.intro{font-size:16px;margin:34px 0}.hero-actions a{min-width:0;width:100%}
  .hero-stage{min-height:520px}.card{width:225px;min-height:132px;padding:18px;box-shadow:6px 6px 0 var(--ink)}
  .card strong{font-size:24px;margin:18px 0 7px}.card-a{top:55px;left:12px}.card-b{top:225px;right:12px}.card-c{bottom:38px;left:20px}
  .orbit{width:115px;height:115px;font-size:72px}.not-package{font-size:12px}
  .diagnose,.case,.portfolio,.process-section,.promise,.contact{padding:70px 20px}
  .diagnose h2,.case h2,.portfolio h2,.process-title h2{font-size:clamp(50px,14vw,66px)}
  .diagnose>header,.portfolio-head{gap:22px}.diagnose-buttons{margin-top:44px}
  .diagnose-buttons button{min-height:155px;padding:20px;grid-template-columns:34px 1fr 22px}.diagnose-buttons strong{font-size:24px}
  .diagnosis{padding:25px 20px;gap:20px}.diagnosis-id{width:76px;height:76px;font-size:44px}.diagnosis h3{font-size:32px}
  .manifesto{padding:70px 20px}.manifesto h2{font-size:clamp(48px,14vw,60px);margin:32px 0}
  .cap{padding:32px 20px;min-height:410px}.cap h3{font-size:36px;margin-bottom:55px}.cap-symbol{font-size:250px}
  .case-flow{margin-top:55px}.pool-shape{height:270px}.case li{grid-template-columns:45px 1fr;font-size:16px}.case blockquote{margin-top:55px}
  .portfolio-head{margin-bottom:45px}.work-grid{gap:20px}.work-grid a{padding:10px 10px 16px;box-shadow:5px 5px 0 var(--ink)}
  .work-grid h3{font-size:25px;margin-top:8px}.work-grid .project-copy p{margin-right:28px;font-size:12px}.work-grid i{right:15px;bottom:17px}
  .process-section{gap:42px}.process-list article{grid-template-columns:40px 1fr}.process-list p{font-size:14px}
  .promise{gap:32px}.promise h2{font-size:45px}.promise ul{width:100%;margin:0}
  .contact h2{font-size:clamp(58px,18vw,82px);line-height:.84;margin:38px 0 48px}.contact-bottom{gap:35px}.contact-bottom>p{font-size:17px}.contact-bottom a{font-size:19px;overflow-wrap:anywhere}
}
