[data-work-project=bon-bon]{isolation:isolate;font-family:Arial,Helvetica,sans-serif;line-height:normal}[data-work-project=bon-bon] :where(h1,h2,h3,h4,h5,h6,p,figure,blockquote,ul,ol,dl,dd){margin:revert;font-size:revert;font-weight:revert}[data-work-project=bon-bon] :where(h1,h2,h3,h4,h5,h6){font-family:inherit}[data-work-project=bon-bon] :where(img){width:auto}[data-work-project=bon-bon] :where(ul,ol){list-style:revert;padding:revert}[data-work-project=bon-bon] :where(section[id],div[id]){scroll-margin-top:110px}[data-work-project=bon-bon]{--red:#bd1f2d;--ink:#0b0b0c;--cream:#f3efe7;--warm:#a87543;--line:#d8d5ce}[data-work-project=bon-bon] *{box-sizing:border-box}[data-work-project=bon-bon]{scroll-behavior:smooth;color:var(--ink);background:#fff;margin:0;font-family:Arial,Helvetica,sans-serif}[data-work-project=bon-bon] .wrap{width:min(1460px,100% - 64px);margin:auto}[data-work-project=bon-bon] .kicker{letter-spacing:.18em;text-transform:uppercase;font-size:13px;font-weight:700}[data-work-project=bon-bon] .red{color:var(--red)}[data-work-project=bon-bon] header{z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff0;border-bottom:1px solid #00000014;position:fixed;inset:0 0 auto}[data-work-project=bon-bon] header .bar{justify-content:space-between;align-items:center;gap:32px;height:74px;display:flex}[data-work-project=bon-bon] .brand{letter-spacing:.06em;font-size:17px;font-weight:800}[data-work-project=bon-bon] .nav{text-transform:uppercase;letter-spacing:.14em;gap:24px;font-size:12px;display:flex}[data-work-project=bon-bon] .nav a{color:#111;text-decoration:none}[data-work-project=bon-bon] .hero{color:#fff;background-image:linear-gradient(90deg,#000000e0 0%,#000000a8 31%,#0000000f 67%,#0000 100%),url(/work/bon-bon/converted-aaadb4594578dcc3.jpg);background-position:50% 45%;background-size:cover;align-items:flex-end;min-height:100vh;padding-top:74px;display:flex;position:relative}[data-work-project=bon-bon] .hero .content{max-width:730px;padding:0 0 74px}[data-work-project=bon-bon] .hero h1{letter-spacing:-.05em;margin:12px 0 24px;font-size:clamp(58px,7vw,112px);line-height:.86}[data-work-project=bon-bon] .hero h1 span{color:#fff;display:block}[data-work-project=bon-bon] .hero h1 em{color:var(--red);font-style:normal;display:block}[data-work-project=bon-bon] .hero p{color:#ffffffe6;max-width:610px;font-size:22px;line-height:1.45}[data-work-project=bon-bon] .hero .meta{text-transform:uppercase;letter-spacing:.12em;flex-wrap:wrap;gap:28px;margin-top:38px;font-size:13px;display:flex}[data-work-project=bon-bon] .hero .meta div{border-left:2px solid var(--red);padding-left:12px}[data-work-project=bon-bon] .statement{background:#fff;padding:116px 0 96px}[data-work-project=bon-bon] .statement .grid{grid-template-columns:.92fr 1.08fr;align-items:end;gap:90px;display:grid}[data-work-project=bon-bon] .statement h2{letter-spacing:-.045em;margin:0;font-size:clamp(52px,6vw,94px);line-height:.93}[data-work-project=bon-bon] .statement p{color:#2b2b2b;margin:0 0 10px;font-size:22px;line-height:1.55}[data-work-project=bon-bon] .statement .line{background:var(--red);width:82px;height:5px;margin-top:28px}[data-work-project=bon-bon] .fullimage{background-position:50%;background-size:cover;height:78vh;min-height:620px;position:relative}[data-work-project=bon-bon] .fullimage.retail{background-image:url(/work/bon-bon/converted-e4d1fb4617bca491.jpg)}[data-work-project=bon-bon] .caption{color:#fff;letter-spacing:.12em;text-transform:uppercase;background:#0a0a0a;padding:12px 16px;font-size:12px;position:absolute;bottom:30px;left:34px}[data-work-project=bon-bon] .story{background:var(--cream);padding:110px 0}[data-work-project=bon-bon] .storygrid{grid-template-columns:1.05fr .95fr;align-items:center;gap:80px;display:grid}[data-work-project=bon-bon] .story h3{letter-spacing:-.04em;margin:0 0 24px;font-size:60px;line-height:.98}[data-work-project=bon-bon] .story p{color:#333;max-width:610px;font-size:20px;line-height:1.58}[data-work-project=bon-bon] .facts{background:#cfc9be;border:1px solid #cfc9be;grid-template-columns:repeat(2,1fr);gap:1px;margin-top:38px;display:grid}[data-work-project=bon-bon] .fact{background:var(--cream);padding:24px}[data-work-project=bon-bon] .fact b{margin-bottom:5px;font-size:28px;display:block}[data-work-project=bon-bon] .fact span{letter-spacing:.11em;text-transform:uppercase;font-size:12px}[data-work-project=bon-bon] .collage{grid-template-columns:1.35fr .65fr;gap:14px;display:grid}[data-work-project=bon-bon] .collage .big{background:url(/work/bon-bon/converted-4c80b74ab48ef381.jpg) 50%/cover no-repeat;height:700px}[data-work-project=bon-bon] .collage .side{grid-template-rows:1fr 1fr;gap:14px;display:grid}[data-work-project=bon-bon] .collage .a{background:url(/work/bon-bon/converted-f4503a75d8b6d398.jpg) 50%/cover no-repeat}[data-work-project=bon-bon] .collage .b{background:url(/work/bon-bon/converted-9ddba3cb775e950d.jpg) 50%/cover no-repeat}[data-work-project=bon-bon] .transition{color:#fff;background:#0a0a0a;padding:120px 0}[data-work-project=bon-bon] .transition .grid{grid-template-columns:1fr 1fr;align-items:center;gap:70px;display:grid}[data-work-project=bon-bon] .transition h2{letter-spacing:-.05em;margin:0;font-size:clamp(56px,6vw,95px);line-height:.93}[data-work-project=bon-bon] .transition p{color:#ddd;font-size:21px;line-height:1.55}[data-work-project=bon-bon] .transition .arrow{color:var(--red);font-size:70px;line-height:1}[data-work-project=bon-bon] .warehouse-hero{background:url(/work/bon-bon/converted-ecf0374bc3eef771.jpg) 50%/cover no-repeat;height:82vh;min-height:640px;position:relative}[data-work-project=bon-bon] .warehouse-hero:after{content:"";background:linear-gradient(90deg,#000000ad,#0000 55%);position:absolute;inset:0}[data-work-project=bon-bon] .warehouse-hero .overlay{z-index:1;color:#fff;max-width:590px;position:absolute;top:50%;left:5%;transform:translateY(-50%)}[data-work-project=bon-bon] .warehouse-hero h3{margin:0 0 20px;font-size:70px;line-height:.95}[data-work-project=bon-bon] .warehouse-hero p{color:#eee;font-size:19px;line-height:1.55}[data-work-project=bon-bon] .logistics{padding:110px 0}[data-work-project=bon-bon] .loggrid{grid-template-columns:.8fr 1.2fr;gap:70px;display:grid}[data-work-project=bon-bon] .logistics h3{margin:0 0 28px;font-size:56px;line-height:1}[data-work-project=bon-bon] .logistics p{color:#333;font-size:19px;line-height:1.6}[data-work-project=bon-bon] .cards{grid-template-columns:1fr 1fr;gap:14px;display:grid}[data-work-project=bon-bon] .card{background-position:50%;background-size:cover;min-height:360px;position:relative}[data-work-project=bon-bon] .card.one{background-image:url(/work/bon-bon/converted-9e419b33e4527991.jpg)}[data-work-project=bon-bon] .card.two{background-image:url(/work/bon-bon/converted-912b6966efd2e45e.jpg)}[data-work-project=bon-bon] .card.three{background-image:url(/work/bon-bon/converted-ceac1edef55f46c6.jpg);grid-column:1/-1;min-height:500px}[data-work-project=bon-bon] .card span{color:#fff;text-transform:uppercase;letter-spacing:.12em;background:#111;padding:10px 13px;font-size:11px;position:absolute;bottom:16px;left:16px}[data-work-project=bon-bon] .final{background:#f7f7f5;padding:110px 0 120px}[data-work-project=bon-bon] .final h2{letter-spacing:-.045em;max-width:1050px;margin:0 0 34px;font-size:clamp(52px,6vw,92px);line-height:.95}[data-work-project=bon-bon] .final p{color:#333;max-width:830px;font-size:22px;line-height:1.5}[data-work-project=bon-bon] .strip{border-top:1px solid #bbb;border-bottom:1px solid #bbb;grid-template-columns:repeat(4,1fr);margin-top:54px;display:grid}[data-work-project=bon-bon] .strip div{border-right:1px solid #bbb;padding:24px 20px}[data-work-project=bon-bon] .strip div:last-child{border-right:0}[data-work-project=bon-bon] .strip b{font-size:25px;display:block}[data-work-project=bon-bon] .strip span{letter-spacing:.12em;text-transform:uppercase;color:#555;font-size:11px}[data-work-project=bon-bon] footer{color:#fff;background:#090909;padding:38px 0}[data-work-project=bon-bon] footer .foot{letter-spacing:.11em;text-transform:uppercase;justify-content:space-between;align-items:center;gap:30px;font-size:12px;display:flex}@media (max-width:900px){[data-work-project=bon-bon] .wrap{width:min(100% - 36px,1460px)}[data-work-project=bon-bon] .nav{display:none}[data-work-project=bon-bon] .statement .grid,[data-work-project=bon-bon] .storygrid,[data-work-project=bon-bon] .transition .grid,[data-work-project=bon-bon] .loggrid{grid-template-columns:1fr;gap:38px}[data-work-project=bon-bon] .hero{background-position:58%}[data-work-project=bon-bon] .hero .content{padding-bottom:45px}[data-work-project=bon-bon] .fullimage{height:60vh;min-height:440px}[data-work-project=bon-bon] .collage{grid-template-columns:1fr}[data-work-project=bon-bon] .collage .big{height:520px}[data-work-project=bon-bon] .collage .side{height:540px}[data-work-project=bon-bon] .warehouse-hero h3{font-size:52px}[data-work-project=bon-bon] .cards{grid-template-columns:1fr}[data-work-project=bon-bon] .card.three{grid-column:auto}[data-work-project=bon-bon] .strip{grid-template-columns:1fr 1fr}[data-work-project=bon-bon] .strip div:nth-child(2){border-right:0}[data-work-project=bon-bon] footer .foot{flex-direction:column;align-items:flex-start}}
