@font-face{font-family:Unica;src:url('./assets/fonts/neue-haas-unica-light.ttf') format('truetype');font-weight:300;font-display:swap}@font-face{font-family:Unica;src:url('./assets/fonts/neue-haas-unica-bold.ttf') format('truetype');font-weight:700;font-display:swap}@font-face{font-family:Unica;src:url('./assets/fonts/neue-haas-unica-extra-black.ttf') format('truetype');font-weight:900;font-display:swap}
:root{--black:#000;--white:#f5f5f2;--green:#95ff47;--line:#343434;--pad:clamp(24px,4vw,70px)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--white);font:300 16px/1.35 Unica,Arial,sans-serif}button,input,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--green);outline-offset:3px}.skip-link{position:absolute;z-index:30;top:-100px;left:1rem;background:var(--green);color:#000;padding:.65rem 1rem}.skip-link:focus{top:1rem}.site{min-height:100svh;display:grid;grid-template-rows:64px minmax(0,1fr) auto}.header{display:flex;justify-content:space-between;align-items:center;padding:0 var(--pad);border-bottom:1px solid var(--line)}.brand{width:155px;display:block}.brand img{width:100%;display:block;filter:invert(1)}.header-right{display:flex;align-items:center;gap:clamp(20px,4vw,60px);font-size:10px;font-weight:700;letter-spacing:.05em}.language{display:flex;align-items:center;gap:8px}.language button{border:0;border-bottom:1px solid transparent;background:none;color:var(--white);opacity:.5;font-size:10px;font-weight:700;padding:8px 0}.language button[aria-pressed="true"]{opacity:1;border-color:var(--white)}.holding{min-height:0;display:flex;align-items:center;padding:clamp(45px,7vh,100px) var(--pad);position:relative}.hero{max-width:1000px}.kicker{display:block;color:var(--green);font-size:11px;font-weight:700;letter-spacing:.08em}.hero h1{font-size:clamp(58px,7.4vw,128px);line-height:.89;letter-spacing:-.065em;font-weight:900;margin:26px 0 33px}.dot{color:#fff}.hero p{max-width:550px;font-size:clamp(16px,1.35vw,20px);line-height:1.35;margin:0}.hero-actions,.welcome-actions{display:flex;align-items:center;gap:32px;flex-wrap:wrap;margin-top:33px}.primary-action{border:0;background:var(--green);color:#000;font-size:14px;font-weight:900;min-height:52px;padding:12px 20px}@media(hover:hover) and (pointer:fine){.primary-action:hover,.next:hover{background:var(--white)}}.text-action{border:0;border-bottom:1px solid currentColor;background:none;color:var(--white);font-size:14px;font-weight:700;padding:8px 0}@media(hover:hover) and (pointer:fine){.text-action:hover{color:var(--green)}}.hero-index{position:absolute;right:var(--pad);bottom:35px;font-size:11px;font-weight:700;letter-spacing:.06em;writing-mode:vertical-rl}.hero-index span{color:var(--green)}.footer{border-top:1px solid var(--line);padding:22px var(--pad);display:flex;justify-content:space-between;align-items:center;gap:30px}.footer>span{font-size:clamp(19px,2vw,30px);font-weight:900;letter-spacing:-.045em}.footer-links{display:flex;gap:clamp(15px,3vw,45px);flex-wrap:wrap}.footer-links a{font-size:12px;font-weight:700;border-bottom:1px solid currentColor;padding-bottom:3px;white-space:nowrap}@media(hover:hover) and (pointer:fine){.footer-links a:hover,.work-more:hover{color:var(--green)}}
.welcome[hidden]{display:none}.welcome{position:fixed;z-index:10;inset:64px 0 0;background:#000;display:flex;align-items:center;padding:var(--pad)}.welcome-inner{max-width:1000px}.welcome h2{font-size:clamp(70px,11vw,175px);line-height:.87;letter-spacing:-.07em;font-weight:900;margin:23px 0 30px}.welcome p{max-width:500px;font-size:clamp(17px,1.55vw,22px);margin:0}.welcome-note{position:absolute;bottom:30px;left:var(--pad);font-size:11px;opacity:.55}
dialog{color:var(--white);background:#000;border:0;padding:0;max-width:none;max-height:none;width:100vw;height:100dvh;margin:0}dialog::backdrop{background:#000}.dialog-head{height:64px;border-bottom:1px solid var(--line);padding:0 var(--pad);display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:700;letter-spacing:.07em}.close{border:0;background:none;color:var(--white);font-size:20px;padding:10px}@media(hover:hover) and (pointer:fine){.close:hover{color:var(--green)}}.work-layout{height:calc(100dvh - 64px);display:grid;grid-template-columns:minmax(285px,30%) minmax(0,1fr)}.work-sidebar{padding:clamp(28px,4vw,60px) var(--pad);border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:start}.work-sidebar h2{font-size:clamp(45px,4.3vw,78px);line-height:.93;letter-spacing:-.06em;margin:20px 0 45px;font-weight:900}.work-tabs{display:flex;gap:25px}.work-tabs button{background:none;border:0;border-bottom:1px solid transparent;color:var(--white);opacity:.55;font-size:14px;font-weight:700;padding:0 0 7px}.work-tabs button[aria-pressed="true"]{border-color:var(--green);opacity:1}.work-numbers{display:flex;gap:17px;margin-top:auto}.work-numbers button{border:0;border-bottom:1px solid transparent;background:none;color:var(--white);opacity:.55;padding:0 0 5px;font-size:12px;font-weight:700}.work-numbers button[aria-pressed="true"]{opacity:1;color:var(--green);border-color:var(--green)}.work-more{font-size:12px;font-weight:700;border-bottom:1px solid currentColor;padding-bottom:3px;margin-top:25px}.work-display{min-width:0;display:grid;grid-template-rows:minmax(0,1fr) auto;padding:clamp(22px,3vw,45px)}.media-stage{min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;position:relative;background:#0d0d0d}.media-stage img{display:block;width:100%;height:100%;object-fit:contain}.video-tag{position:absolute;left:18px;bottom:18px;background:#000;color:var(--green);padding:8px 10px;font-size:10px;font-weight:700;letter-spacing:.07em}.video-tag[hidden]{display:none}.work-caption{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding-top:20px}.work-caption>div{display:flex;align-items:baseline;gap:20px}.work-caption span{font-size:11px;font-weight:700;opacity:.65}.work-caption strong{font-size:clamp(20px,2vw,32px);font-weight:700}.work-caption a{font-size:12px;font-weight:700;border-bottom:1px solid currentColor;padding-bottom:3px;white-space:nowrap}@media(hover:hover) and (pointer:fine){.work-caption a:hover{color:var(--green)}}
.brief-dialog{overflow:auto}.brief-content{min-height:calc(100dvh - 64px);max-width:900px;padding:clamp(30px,6vh,80px) var(--pad) 35px;display:flex;flex-direction:column}.brief-progress{display:flex;align-items:center;gap:20px;font-size:12px;font-weight:700;color:var(--green)}.progress-track{width:145px;height:2px;background:#444}.progress-track span{display:block;width:25%;height:100%;background:var(--green);transition:width .25s}.brief-content form{flex:1;display:flex;align-items:center}.brief-step{width:100%}.brief-step[hidden]{display:none}.brief-step h2{font-size:clamp(42px,5.5vw,86px);line-height:.95;letter-spacing:-.06em;font-weight:900;margin:20px 0 38px}.field-label{display:block;font-size:12px;font-weight:700;margin:27px 0 10px}.brief-step>input,.brief-step textarea{display:block;width:min(100%,640px);border:0;border-bottom:1px solid #777;background:transparent;color:var(--white);padding:12px 0;font-size:18px;border-radius:0;resize:vertical}.brief-step textarea{min-height:130px}.brief-step input::placeholder,.brief-step textarea::placeholder{color:#777}.choice-row,.choice-grid{display:flex;flex-wrap:wrap;gap:10px}.choice-grid{max-width:700px}.choice-row label,.choice-grid label{cursor:pointer}.choice-row input,.choice-grid input{position:absolute;opacity:0;width:1px;height:1px}.choice-row span,.choice-grid span{display:block;border:1px solid #666;padding:12px 16px;font-size:14px;transition:background .15s,color .15s}.choice-row input:checked+span,.choice-grid input:checked+span{background:var(--green);border-color:var(--green);color:#000;font-weight:700}.choice-row input:focus-visible+span,.choice-grid input:focus-visible+span{outline:2px solid var(--green);outline-offset:3px}@media(hover:hover) and (pointer:fine){.choice-row span:hover,.choice-grid span:hover{border-color:var(--green)}}.step-hint{font-size:14px;color:#aaa;margin:0 0 25px}.brief-nav{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:30px}.back{border:0;background:none;color:var(--white);font-size:14px;font-weight:700;padding:12px 0}@media(hover:hover) and (pointer:fine){.back:hover{color:var(--green)}}.back:disabled{opacity:.3;cursor:default}.next{display:inline-flex;align-items:center;justify-content:center;border:0;background:var(--green);color:#000;min-height:50px;padding:12px 25px;font-size:14px;font-weight:900}.next[hidden]{display:none}.skip-brief{border:0;border-bottom:1px solid #777;background:none;color:#aaa;font-size:12px;margin-top:25px;padding:0 0 3px;align-self:start}@media(hover:hover) and (pointer:fine){.skip-brief:hover{color:var(--white)}}
@media(max-width:760px){.site{grid-template-rows:62px minmax(0,1fr) auto}.header-right>span{display:none}.brand{width:145px}.holding{padding:55px var(--pad) 80px}.hero h1{font-size:clamp(54px,10.8vw,84px);margin:20px 0 26px}.hero p{font-size:16px}.hero-index{display:none}.hero-actions,.welcome-actions{gap:18px;margin-top:26px}.footer{display:block}.footer-links{margin-top:18px}.welcome{inset:62px 0 0}.welcome h2{font-size:clamp(65px,12vw,105px)}.welcome p{font-size:16px}.work-layout{height:auto;min-height:calc(100dvh - 64px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}.work-sidebar{border-right:0;padding:20px var(--pad) 15px}.work-sidebar h2{font-size:42px;margin:10px 0 16px}.work-tabs{gap:20px}.work-numbers{margin-top:18px}.work-more{position:absolute;right:var(--pad);top:138px;margin:0}.work-display{min-height:55dvh;padding:12px var(--pad) 26px}.work-caption strong{font-size:20px}.work-caption a{font-size:11px}.brief-content{min-height:calc(100dvh - 64px)}.brief-content form{align-items:start;padding-top:45px}.brief-step h2{font-size:clamp(42px,9vw,65px)}.choice-row span,.choice-grid span{font-size:13px;padding:10px 12px}}
@media(max-width:430px){.hero h1{font-size:clamp(47px,11vw,58px)}.primary-action,.text-action{font-size:13px}.footer-links{gap:17px}.welcome h2{font-size:61px}.work-more{position:static;margin-top:14px}.work-display{min-height:50dvh}.work-caption span{display:none}.work-caption strong{font-size:17px}.brief-content form{padding-top:35px}.brief-step h2{margin-bottom:25px}}
@media(prefers-reduced-motion:reduce){.progress-track span,.choice-row span,.choice-grid span{transition:none}}
@media(min-width:761px){.work-layout{grid-template-rows:minmax(0,1fr)}.work-display{min-height:0;overflow:hidden}}
.choice-grid.priced{max-width:760px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.choice-grid.priced span{min-height:66px;display:flex;flex-direction:column;justify-content:center;gap:3px}.choice-grid.priced b{font-size:14px;font-weight:700}.choice-grid.priced small{font-size:11px;opacity:.7}.choice-grid.priced input:checked+span small{opacity:1}.budget-grid{max-width:760px}.investment-feedback,.field-feedback{min-height:18px;font-size:12px;color:#aaa;margin:20px 0 0}.investment-feedback.below{color:var(--green)}.revise-services{border:0;border-bottom:1px solid currentColor;background:none;color:var(--white);font-size:12px;font-weight:700;margin-top:12px;padding:0 0 3px}.revise-services[hidden]{display:none}.next:disabled{opacity:.35;cursor:not-allowed}@media(hover:hover) and (pointer:fine){.next:disabled:hover{background:var(--green)}}
@media(max-width:760px){.choice-grid.priced{grid-template-columns:1fr 1fr}.choice-grid.priced span{min-height:62px}}
@media(max-width:430px){.choice-grid.priced{grid-template-columns:1fr}.choice-grid.priced span{min-height:55px}}

/* The project questionnaire reads as a separate white working sheet. */
.brief-dialog{background:#fff;color:#000}
.brief-dialog .dialog-head{border-color:#d6d6d6}
.brief-dialog .close,.brief-dialog .back{color:#000}
@media(hover:hover) and (pointer:fine){.brief-dialog .close:hover,.brief-dialog .back:hover{color:#000}}
.brief-dialog .kicker,.brief-dialog .brief-progress{color:#000}
.brief-dialog .progress-track{background:#d2d2d2}
.brief-dialog .brief-step>input,.brief-dialog .brief-step textarea{color:#000;border-color:#777}
.brief-dialog .brief-step input::placeholder,.brief-dialog .brief-step textarea::placeholder{color:#777}
.brief-dialog .choice-row span,.brief-dialog .choice-grid span{border-color:#999}
@media(hover:hover) and (pointer:fine){.brief-dialog .choice-row span:hover,.brief-dialog .choice-grid span:hover{border-color:#000}}
.brief-dialog .choice-row input:checked+span,.brief-dialog .choice-grid input:checked+span{background:var(--green);border-color:#000;color:#000}
.brief-dialog .choice-row input:focus-visible+span,.brief-dialog .choice-grid input:focus-visible+span{outline-color:#000}
.brief-dialog .step-hint,.brief-dialog .investment-feedback,.brief-dialog .field-feedback{color:#555}
.brief-dialog .investment-feedback.below{color:#000}
.brief-dialog .revise-services{color:#000}
.brief-dialog .skip-brief{color:#555;border-color:#777}
@media(hover:hover) and (pointer:fine){.brief-dialog .skip-brief:hover{color:#000}}

/* Draw direction marks as crisp vector shapes, never font glyphs or emoji. */
:is(.primary-action,.text-action,.footer-links a,.work-more,#work-link,.next)::after{content:"";display:inline-block;width:14px;height:14px;margin-left:.45em;vertical-align:-2px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2 12 12 2M4 2h8v8' fill='none' stroke='black' stroke-width='1.7'/%3E%3C/svg%3E") center/contain no-repeat}
.back::before{content:"";display:inline-block;width:14px;height:14px;margin-right:.35em;vertical-align:-2px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M12 7H2m5-5L2 7l5 5' fill='none' stroke='black' stroke-width='1.7'/%3E%3C/svg%3E") center/contain no-repeat}

/* Stage and service questions reveal only the relevant branch. */
.brief-dialog .stage-details,.brief-dialog .service-detail,.brief-dialog .product-details{border-top:1px solid #d6d6d6;margin-top:26px;padding-top:4px;max-width:760px}
.brief-dialog .service-detail{margin-top:32px}
.brief-dialog .detail-label{display:block;font-size:11px;font-weight:700;letter-spacing:.08em;margin-top:20px}
.brief-dialog .stage-details .field-label,.brief-dialog .service-detail .field-label,.brief-dialog .product-question .field-label{margin-top:19px}
.brief-dialog .stage-details input[type="text"],.brief-dialog .service-detail input[type="text"],.brief-dialog .service-detail input[type="url"],.brief-dialog .product-details input[type="text"],.brief-dialog .product-details input[type="number"]{display:block;width:min(100%,640px);border:0;border-bottom:1px solid #777;border-radius:0;background:transparent;color:#000;padding:10px 0;font-size:17px}
.brief-dialog .product-question{max-width:760px;margin-top:32px}
.brief-dialog .product-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.brief-dialog .product-fields input{width:100%}
.brief-dialog :is(.stage-details,.service-detail,.product-question,.product-details,.name-check,#food-advisory,#hub-other,#merch-other)[hidden]{display:none}
@media(max-width:600px){.brief-dialog .product-fields{grid-template-columns:1fr;gap:0}}

.brief-dialog [data-when][hidden]{display:none}
.brief-dialog [data-when] input:is([type="text"],[type="url"]){
  display:block;width:min(100%,640px);border:0;border-bottom:1px solid #777;
  border-radius:0;background:transparent;color:#000;padding:10px 0;font-size:17px
}
.brief-dialog .service-detail h3{margin:22px 0 8px;font-size:clamp(20px,3vw,28px);line-height:1.15}

/* One card at a time, with a stable frame across chapters. */
.brief-dialog{
  --brief-ink:#111;--brief-paper:#fff;--brief-muted:#505050;--brief-line:#b3b3b3;
  color:var(--brief-ink);background:var(--brief-paper);
  transition:background-color .25s ease,color .25s ease
}
.brief-dialog[data-theme="black"]{
  --brief-ink:#fff;--brief-paper:#101010;--brief-muted:#c4c4c4;--brief-line:#737373
}
.brief-dialog[data-theme="green"]{
  --brief-ink:#111;--brief-paper:var(--green);--brief-muted:#303030;--brief-line:#4e702f
}
.brief-dialog :is(.dialog-head,.close,.back,.brief-progress){color:var(--brief-ink);border-color:var(--brief-line)}
@media(hover:hover) and (pointer:fine){.brief-dialog :is(.close,.back,.skip-brief):hover{color:var(--brief-ink)}}
.brief-dialog .progress-track{background:var(--brief-line)}
.brief-dialog[data-theme="green"] #progress-fill{background:#111}
.brief-dialog .brief-content{
  width:min(100%,1280px);max-width:none;margin-inline:auto;
  min-height:calc(100dvh - 64px);padding-block:clamp(20px,5dvh,55px) 24px
}
.brief-dialog .brief-content form{align-items:center;padding-top:16px}
.brief-dialog .brief-step{width:100%}
.brief-dialog .brief-step > :is(.kicker,h2),.brief-dialog .brief-step h3{display:none}
.brief-dialog .brief-step :is(.stage-details,.service-detail,.product-details,.product-question,.product-fields){
  display:block;border:0;margin:0;padding:0;max-width:none
}
.brief-dialog .brief-step :is([data-card],[data-when],[data-stage-detail],.product-details)[hidden]{display:none}
.brief-dialog .brief-card{
  padding-block:clamp(18px,5dvh,60px);
  animation:brief-card-in .28s ease both
}
@keyframes brief-card-in{
  from{opacity:0;transform:translateX(12px)}
  to{opacity:1;transform:translateX(0)}
}
.brief-dialog .brief-card .field-label{
  color:inherit;font-size:clamp(23px,4vw,48px);line-height:1.05;
  letter-spacing:-.045em;margin:0 0 22px
}
.brief-dialog .brief-card:has(#your-whatsapp) .field-label{
  font-size:15px;letter-spacing:0;margin:16px 0 5px
}
.brief-dialog .brief-card input:not([type="radio"],[type="checkbox"]),.brief-dialog .brief-card textarea{
  display:block;width:min(100%,880px);border:0;border-bottom:1px solid var(--brief-line);
  border-radius:0;background:transparent;color:var(--brief-ink);padding:10px 0;font-size:17px
}
.brief-dialog .brief-card textarea{min-height:86px}
.brief-dialog .brief-card :is(input,textarea)::placeholder{color:var(--brief-muted)}
.brief-dialog .brief-card :is(.choice-row,.choice-grid) span{border-color:var(--brief-line);border-radius:3px}
@media(hover:hover) and (pointer:fine){.brief-dialog .brief-card :is(.choice-row,.choice-grid) span:hover{border-color:var(--brief-ink)}}
.brief-dialog .brief-card :is(.choice-row,.choice-grid) input:focus-visible + span{outline-color:var(--brief-ink)}
.brief-dialog[data-theme="green"] .brief-card input:checked + span{background:#111;color:#fff}
.brief-dialog .step-hint,.brief-dialog .skip-brief{color:var(--brief-muted)}
.brief-dialog .brief-card .step-hint{margin-top:14px;max-width:56ch}
.brief-dialog .brief-nav{margin-top:14px}
.brief-dialog .skip-brief{margin-top:12px}
.brief-dialog .skip-brief[hidden]{display:none}
.brief-dialog[data-theme="green"] .next{background:#111;color:#fff}
@media(prefers-reduced-motion:reduce){
  .brief-dialog,.brief-dialog .brief-card{animation:none;transition:none}
}

.brief-dialog .brief-card[data-layout="center"]{
  max-width:1040px;margin-inline:auto;text-align:center
}
.brief-dialog .brief-card[data-layout="center"] .choice-row{justify-content:center}
.brief-dialog .brief-card[data-layout="center"] :is(.step-hint,.brief-question-note){margin-inline:auto}
.brief-dialog .brief-card[data-layout="stacked"] .field-label{
  max-width:24ch;font-size:clamp(38px,6.5vw,94px);line-height:1.13
}
.brief-dialog .brief-card[data-layout="stacked"] :is(.choice-row,.choice-grid){
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,175px),1fr))
}
.brief-dialog .brief-card[data-layout="stacked"] :is(.choice-row,.choice-grid) span{
  display:flex;align-items:center;min-height:56px;height:100%
}
.brief-dialog .brief-card .brief-contact-title{
  display:block;margin:0 0 18px;font-size:clamp(31px,5vw,55px);
  line-height:1;letter-spacing:-.05em
}
.brief-dialog .brief-question-note{
  max-width:54ch;margin-top:24px;padding:10px 0 10px 14px;
  border-left:2px solid var(--brief-line);text-align:left;color:var(--brief-muted)
}
.brief-dialog .brief-question-note span{font-size:10px;letter-spacing:.09em;font-weight:800}
.brief-dialog .brief-question-note p{margin:6px 0 0;font-size:14px;line-height:1.45}
.brief-dialog .brief-card[hidden]{display:none!important}

@media(prefers-reduced-motion:no-preference){
  .brief-dialog .brief-card{animation:none}
  .brief-dialog .brief-card :is(.field-label,.brief-contact-title){
    animation:brief-detail-in .34s cubic-bezier(.2,.65,.3,1) both
  }
  .brief-dialog .brief-card :is(.choice-row,.choice-grid,input:not([type="radio"],[type="checkbox"]),textarea){
    animation:brief-detail-in .36s cubic-bezier(.2,.65,.3,1) .07s both
  }
  .brief-dialog .brief-card :is(.step-hint,.brief-question-note){
    animation:brief-detail-in .32s ease-out .13s both
  }
}
@keyframes brief-detail-in{
  from{opacity:0;transform:translateX(var(--card-entry,44px))}
  to{opacity:1;transform:translateY(0)}
}

.welcome .welcome-greeting{
  font-size:clamp(44px,11vw,160px);line-height:.86;letter-spacing:-.075em
}
.welcome-greeting span{display:inline-block}
.welcome-greeting span:last-child{color:var(--green)}
.welcome :is(button,.primary-action),.brief-dialog button,
.brief-dialog .brief-card :is(.choice-row,.choice-grid) span{border-radius:0}
@media(hover:hover){
  .welcome button:hover,.brief-dialog button:not(:disabled):hover,
  .brief-dialog .brief-card :is(.choice-row,.choice-grid) label:hover span{
    background:var(--green);color:#111;border-color:#111;
    outline:1px solid #111;outline-offset:-1px
  }
}
@media(prefers-reduced-motion:no-preference){
  .welcome:not([hidden]) .welcome-greeting span{
    animation:welcome-stamp .58s cubic-bezier(.16,.85,.25,1) both
  }
  .welcome:not([hidden]) .welcome-greeting span:last-child{animation-delay:.13s}
  .brief-dialog .brief-card [data-choice="stage"]{animation:none}
  .brief-dialog [data-choice="stage"] label{
    animation:stage-drop .48s cubic-bezier(.2,.68,.27,1) .1s both
  }
  .brief-dialog [data-choice="stage"] label:nth-child(2){animation-delay:.19s}
  .brief-dialog [data-choice="stage"] label:nth-child(3){animation-delay:.28s}
}
@keyframes welcome-stamp{
  0%{opacity:0;transform:translateY(.55em) rotate(-8deg) scale(.82)}
  70%{opacity:1;transform:translateY(-.035em) rotate(2deg) scale(1.035)}
  100%{opacity:1;transform:translateY(0) rotate(0) scale(1)}
}
@keyframes stage-drop{
  0%{opacity:0;transform:translateY(-34px)}
  68%{opacity:1;transform:translateY(4px)}
  84%{transform:translateY(-2px)}
  100%{opacity:1;transform:translateY(0)}
}


.brief-dialog .brief-personal-intro{
  margin:0 0 14px;font-size:clamp(16px,2.4vw,24px);font-weight:650;
  line-height:1.2;color:var(--brief-muted);overflow-wrap:anywhere
}
.brief-dialog .brief-personal-intro:empty{display:none}
@media(prefers-reduced-motion:no-preference){
  .brief-dialog .brief-personal-intro{
    animation:brief-detail-in .3s ease-out both
  }
}

#welcome:not([hidden]){
  inset:0;z-index:100;align-items:center;justify-content:center;text-align:center;
  min-height:100dvh;padding:24px
}
#welcome .welcome-inner{width:100%;max-width:none}
#welcome .welcome-greeting{
  margin:0;font-size:clamp(48px,15vw,220px);text-transform:none
}

@media(prefers-reduced-motion:no-preference){
  #welcome.welcome-leaving .welcome-greeting{
    animation:welcome-out .38s ease-in both
  }
}
@keyframes welcome-out{
  from{transform:translateX(0)}
  to{transform:translateX(-105vw)}
}



.brief-dialog{overflow-x:hidden}
#welcome{overflow:hidden;background:#101010}

.brief-dialog:not([open]){transition:none;background:#101010}

.brief-dialog .brief-close-zone{
  position:absolute;z-index:2;inset:0 0 auto auto;padding:12px;
}
.brief-dialog .brief-close-zone .close{
  display:grid;place-items:center;width:44px;height:44px;padding:0;font-size:17px
}
@media(hover:hover) and (pointer:fine){
  .brief-dialog .brief-close-zone .close{opacity:0}
  .brief-dialog .brief-close-zone:is(:hover,:focus-within) .close{opacity:1}
}
.brief-dialog .brief-progress{
  position:absolute;width:1px;height:1px;padding:0;overflow:hidden;
  clip-path:inset(50%);white-space:nowrap
}
.brief-dialog .brief-content{
  min-height:100dvh;padding-block:clamp(48px,8dvh,85px) 20px
}
.brief-dialog .brief-content form{padding-top:0}
.brief-dialog .brief-nav{margin-top:8px}
.brief-dialog .brief-nav :is(.back,.next){
  font-size:12px;font-weight:650;min-height:40px;padding:7px 10px
}
.brief-dialog .brief-nav .next{
  margin-inline-start:auto;background:transparent;color:var(--brief-ink);
  border:1px solid var(--brief-line)
}
@media(hover:hover) and (pointer:fine){.brief-dialog .brief-nav .next:not(:disabled):hover{
  background:var(--green);color:#111;border-color:#111
}}
.brief-dialog .brief-nav .next::after{width:10px;height:10px}
.brief-dialog #brief-skip{display:none}
.brief-dialog .brief-card:not(:has(#your-whatsapp)) .field-label{
  font-size:clamp(36px,6.3vw,90px);line-height:1.14;letter-spacing:-.055em;margin-bottom:clamp(22px,3vw,36px);text-wrap:balance
}
.brief-dialog .brief-card :is(.choice-row,.choice-grid) span{
  display:flex;align-items:center;font-size:clamp(17px,2.15vw,26px);
  line-height:1.32;min-height:54px;padding:12px 17px
}
.brief-dialog .brief-card input:not([type="radio"],[type="checkbox"]),
.brief-dialog .brief-card textarea{font-size:clamp(18px,2.4vw,24px)}

.brief-dialog .brief-card[data-layout="stacked"]:has(#your-name) .field-label{
  max-width:none;font-size:clamp(54px,10vw,138px);
  line-height:1.1;letter-spacing:-.06em;margin-bottom:clamp(24px,5vw,58px)
}
.brief-dialog .brief-card #your-name{
  border-bottom:2px solid var(--green);font-size:clamp(26px,5vw,54px)
}
.brief-dialog #brief-short-route{order:1}
.brief-dialog .brief-nav{
  --nav-inset:clamp(14px,3vw,40px);
  order:2;align-self:center;width:calc(100dvw - 2 * var(--nav-inset));
  margin-top:16px
}
.brief-dialog .brief-nav :is(.back,.next){
  background:var(--green);color:#111;border:1px solid #111
}
.brief-dialog .brief-nav .back:disabled{visibility:hidden}
@media(hover:hover) and (pointer:fine){.brief-dialog .brief-nav :is(.back,.next):not(:disabled):hover{
  background:var(--green);color:#111;border-color:#111
}}

.brief-dialog .brief-address{margin-top:16px;color:var(--brief-muted);font-size:14px}
.brief-dialog .brief-address summary{width:fit-content;cursor:pointer}
.brief-dialog .brief-address label{display:block;margin:10px 0 5px}
.brief-dialog .brief-address select{
  border:1px solid var(--brief-line);border-radius:0;padding:8px 12px;
  background:var(--brief-paper);color:var(--brief-ink);font:inherit
}

.brief-dialog #brief-short-route{
  align-self:center;max-width:100%;min-height:40px;padding:7px 10px;
  color:var(--brief-ink);font-size:12px;font-weight:650;text-align:center;
  border:0;border-bottom:2px solid var(--green)
}
.brief-dialog[data-theme="green"] #brief-short-route{border-bottom-color:var(--brief-ink)}

.brief-dialog .brief-card :is(input[type="text"],input[type="url"],input[type="number"],input[type="email"],input[type="tel"],textarea):focus{
  outline:none;border-bottom-color:var(--green);box-shadow:inset 0 -2px var(--green)
}
.brief-dialog[data-theme="green"] .brief-card :is(input[type="text"],input[type="url"],input[type="number"],input[type="email"],input[type="tel"],textarea):focus{
  border-bottom-color:var(--brief-ink);box-shadow:inset 0 -2px var(--brief-ink)
}

#holding-b-splash{display:none}
.holding-b-intro #holding-b-splash{
  position:fixed;inset:0;z-index:40;display:grid;place-items:center;
  padding:24px;background:#000;color:var(--green);text-align:center;
  font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1.35
}
.holding-b body{background:#fff;color:#111}
.holding-b .header,.holding-b .footer{border-color:#d9d9d9}
.holding-b .brand img{filter:none}
.holding-b .language button,.holding-b .hero .text-action{color:#111}
.holding-b .language button[aria-pressed="true"]{border-color:#111}
.holding-b .holding{
  display:grid;grid-template-columns:minmax(0,1fr);place-items:center;
  isolation:isolate;overflow:hidden
}
.holding-b .hero{
  width:100%;max-width:none;min-height:clamp(360px,60svh,760px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center
}
.holding-b .hero .kicker,.holding-b .hero-index{display:none}
.holding-b .hero h1{
  position:absolute;inset:0;display:grid;align-content:center;
  color:var(--green);font-size:clamp(48px,min(20vw,27svh),310px);
  line-height:.83;letter-spacing:-.075em;margin:0;pointer-events:none
}
.holding-b .hero h1 span{display:block}
.holding-b .hero{position:relative}
.holding-b .hero :is(p,.hero-actions){position:relative;z-index:1}
.holding-b .hero p{
  width:min(100%,570px);max-width:none;color:#111;font-weight:300;
  font-size:clamp(16px,1.35vw,20px);line-height:1.25;text-wrap:balance
}
.holding-b .hero-actions{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;
  width:min(100%,430px);margin-top:clamp(32px,6svh,60px)
}
.holding-b .hero-actions button{
  display:flex;align-items:center;justify-content:center;
  min-height:52px;padding:10px 14px;border:1px solid #111;border-radius:0;
  font-size:14px;font-weight:700;line-height:1.2
}
.holding-b .hero-actions .primary-action{background:#111;color:#fff}
.holding-b .hero-actions .text-action{background:#fff;color:#111}
@media(hover:hover) and (pointer:fine){.holding-b .hero-actions button:hover{background:var(--green);color:#111}}
.holding-b .footer{justify-content:center}
.holding-b .footer>span{display:none}
.holding-b .footer-links{justify-content:center;text-align:center}
.holding-b .welcome,.holding-b .work-dialog{color:var(--white)}
.holding-b .welcome .text-action{color:var(--white)}
.holding-b-intro{overflow:hidden}
.holding-b-intro :is(.skip-link,.header,.footer,.hero h1,.hero p,.hero-actions){visibility:hidden}
.holding-b-intro #holding-b-splash{transition:transform .76s cubic-bezier(.7,0,.23,1)}
.holding-b-revealing #holding-b-splash{transform:translateY(-100%)}
#holding-b-splash button{
  color:inherit;background:none;border:0;padding:14px;font:inherit;letter-spacing:inherit
}
#holding-b-splash button::after{
  content:"↓";position:absolute;left:50%;bottom:max(24px,env(safe-area-inset-bottom));
  transform:translateX(-50%);font-size:15px;opacity:.75
}
.holding-b .hero p{
  margin:0;
  font-size:clamp(17px,1.45vw,22px)
}
.holding-b .holding:focus{outline:none}
@media(max-width:560px){
  .holding-b .hero p{max-width:34ch}
  .holding-b .hero-actions{grid-template-columns:1fr;width:min(100%,255px)}
}
@media(prefers-reduced-motion:no-preference){
  .holding-b-ready .hero h1{animation:holding-b-in .6s ease both}
  .holding-b-ready .hero p{animation:holding-b-in .65s ease .45s both}
  .holding-b-ready .hero-actions{animation:holding-b-in .65s ease .6s both}
  .holding-b-ready :is(.header,.footer){animation:holding-b-in .55s ease 1s both}
}
@media(prefers-reduced-motion:reduce){
  .holding-b-intro #holding-b-splash{transition:none}
}
@keyframes holding-b-in{
  from{opacity:0;transform:translateY(9px)}
  to{opacity:1;transform:translateY(0)}
}

.work-dialog .work-layout{
  position:relative;isolation:isolate;display:block;height:auto;min-height:calc(100dvh - 64px)
}
.work-dialog .work-sidebar{
  position:relative;z-index:1;display:block;border:0;pointer-events:none;
  padding-bottom:42px
}
.work-dialog .work-sidebar :is(button,a){pointer-events:auto}
.work-dialog .work-sidebar h2{margin-bottom:24px}
.work-dialog .work-tabs{margin-bottom:24px}
.work-projects{width:min(100%,790px);padding:0;margin:0 0 24px;list-style:none}
.work-projects li > :is(a,button){
  width:100%;display:flex;align-items:baseline;gap:clamp(12px,2vw,28px);
  padding:clamp(10px,1.3vh,17px) 0;border:0;background:none;color:var(--white);
  font-size:clamp(31px,5.4vw,83px);line-height:1.06;font-weight:900;
  letter-spacing:-.055em;text-align:left
}
.work-projects li > button{display:none}
.work-projects .work-current > :is(a,button){color:var(--green)}
.work-project-order{font-size:11px;font-weight:700;letter-spacing:.06em}
.work-dialog .work-display{
  position:absolute;z-index:0;top:14%;right:var(--pad);width:min(58%,950px);
  height:min(69dvh,690px);min-height:0;padding:0;pointer-events:none;
  background:#101010
}
.work-dialog .work-display[hidden]{display:none}
.work-dialog .media-stage img{object-fit:cover}
.work-dialog .work-caption{padding:10px 14px}
.work-dialog .work-caption #work-link{pointer-events:auto}
.work-dialog .work-caption > div{min-width:0}
@media(max-width:760px){
  .work-dialog .work-sidebar{pointer-events:auto}
  .work-projects li > a{display:none}
  .work-projects li > button{display:flex;font-size:clamp(25px,8vw,52px)}
  .work-dialog .work-display{
    position:static;width:100%;height:auto;min-height:0;margin-bottom:14px;pointer-events:auto
  }
  .work-dialog .media-stage{aspect-ratio:4/3}
}
@media(min-width:761px){
  .work-dialog .media-stage::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(90deg,rgba(0,0,0,.62),transparent 48%)
  }
  .work-dialog .video-tag{z-index:1}
}

.work-dialog .work-sidebar{text-align:center;pointer-events:auto}
.work-dialog .work-tabs{justify-content:center;margin-bottom:12px}
.work-instruction{font-size:13px;margin:0 0 12px;color:#c3c3c3}
.work-preview-slot{
  display:grid;place-items:center;height:clamp(145px,28dvh,245px);margin-bottom:9px
}
.work-dialog .work-display{
  position:static;width:min(100%,340px);height:100%;min-height:0;
  margin:0;padding:0;pointer-events:auto
}
.work-dialog .media-stage{aspect-ratio:auto;overflow:hidden}
.work-dialog .media-stage::after{display:none}
.work-dialog .work-caption{font-size:11px;padding:6px 10px}
.work-dialog .work-caption strong{font-size:12px}
.work-project-viewport{
  width:min(100%,740px);height:clamp(150px,25dvh,230px);
  overflow:auto;margin:0 auto;scrollbar-width:thin;scroll-behavior:auto
}
.work-projects{width:100%;margin:0}
.work-projects li > button{
  display:flex;justify-content:center;text-align:center;
  font-size:clamp(30px,4.4vw,67px);padding:10px 6px
}
.work-dialog .work-more{display:inline-block;margin-top:9px}
@media(max-width:760px){
  .work-project-viewport{height:auto}
  .work-projects li > button{font-size:clamp(25px,8vw,52px)}
  .work-dialog .work-display{height:auto;margin:12px auto 0}
  .work-dialog .media-stage{aspect-ratio:4/3}
}

.holding-b .work-dialog{background:#fff;color:#111}
.holding-b .work-dialog .dialog-head{border-color:#ddd}
.holding-b .work-dialog :is(.close,.work-tabs button,.work-projects li > button){color:#111}
.holding-b .work-dialog .work-instruction{color:#505050}
.holding-b .work-dialog .work-current > button{background:var(--green);color:#111}
.holding-b .work-dialog .work-display{background:#fff}
.holding-b .work-dialog .media-stage{background:#f3f3f3}
.holding-b .work-dialog .kicker{color:#505050}
.holding-b .work-dialog .work-sidebar .dot{color:#111}
@media(hover:hover) and (pointer:fine){.holding-b .work-dialog :is(.work-more,#work-link):hover{color:#111;text-decoration:underline}}

.work-dialog .work-layout{min-height:calc(100dvh - 64px)}
.work-dialog .work-sidebar{
  min-height:calc(100dvh - 64px);padding:32px var(--pad);
  display:flex;flex-direction:column;align-items:center;justify-content:center
}
.work-dialog .work-sidebar h2{
  font-size:clamp(66px,12vw,170px);line-height:.88;margin:18px 0 22px
}
.work-branch-prompt{margin:0 0 24px;font-size:clamp(15px,2vw,20px)}
.work-dialog .work-tabs{margin:0;gap:12px}
.work-dialog .work-tabs button{
  opacity:1;border:1px solid currentColor;padding:11px 16px;font-size:15px
}
@media(hover:hover) and (pointer:fine){.work-dialog .work-tabs button:hover{background:var(--green);color:#111;border-color:#111}}
.work-dialog :is(.work-sidebar,.work-index)[hidden]{display:none}
.work-index{
  position:relative;display:flex;flex-direction:column;
  height:calc(100dvh - 64px);overflow:hidden
}
.work-index-bar{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:12px var(--pad) 4px;gap:10px
}
.work-index-bar h3{margin:0;font-size:13px;letter-spacing:.04em}
.work-index-bar h3:focus{outline:none}
.work-index-back{
  width:fit-content;margin:0;padding:4px 0;border:0;border-bottom:1px solid currentColor;
  background:none;color:inherit;font-size:12px
}
.work-index .work-instruction{text-align:center;padding:0 var(--pad);margin:0 0 8px}
.work-index .work-project-viewport{width:100%;height:auto;flex:1;min-height:0}
.work-index .work-projects li > button{
  min-height:25dvh;align-items:center;justify-content:center;
  font-size:clamp(50px,12vw,185px);line-height:.95;padding:16px var(--pad);font-weight:300;
  text-wrap:balance;cursor:pointer
}
.work-index .work-preview-slot{
  position:absolute;inset:0;z-index:2;display:grid;place-items:center;
  height:auto;margin:0;padding:0 18px;pointer-events:none
}
.work-index .work-display{
  width:min(36vw,360px);min-width:190px;height:auto;aspect-ratio:4/3;
  pointer-events:none;margin:0;box-shadow:0 10px 35px #0004
}
.work-index .media-stage{aspect-ratio:auto}
.work-index .work-caption #work-link{pointer-events:auto}
.holding-b .work-dialog .work-current > button{background:none;color:#111;text-decoration:none}
@media(max-width:760px){
  .work-index .work-projects li > button{font-size:clamp(42px,13vw,95px)}
}
@media(prefers-reduced-motion:no-preference){
  .work-index:not([hidden]){animation:holding-b-in .55s cubic-bezier(.2,.7,.2,1) both}
}

.work-index .media-stage[hidden]{display:none}
.work-index .work-display:has(.media-stage[hidden]){aspect-ratio:auto;display:block}
.work-index .work-display[hidden]{display:none}

.work-dialog .work-index-bar{
  background:var(--green);color:#111;padding-block:12px 10px;row-gap:6px
}
.work-dialog .work-index-bar .work-instruction{
  grid-column:1/-1;color:#111;padding:0;margin:0
}
.work-dialog .work-index-bar .work-index-back{color:#111}
.work-dialog .work-index-bar button:focus-visible{outline-color:#111}

.work-index .work-display{display:block}
.work-index .work-display[hidden]{display:none}
.work-index .work-display .media-stage{width:100%;height:100%}
.work-index .work-project-action{
  position:absolute;z-index:3;bottom:12px;left:50%;transform:translateX(-50%);
  padding:8px 12px;border:1px solid #111;background:var(--green);
  color:#111;font-size:12px;font-weight:700;white-space:nowrap
}
.work-index .work-project-action[hidden]{display:none}
.work-index .work-cursor-action{
  top:var(--cursor-y);left:var(--cursor-x);bottom:auto;transform:none;pointer-events:none
}

@media(min-width:761px){
  .work-index .work-projects li{
    display:grid;place-items:center;min-height:25dvh;padding:16px var(--pad)
  }
  .work-index .work-projects li > button{
    width:fit-content;max-width:100%;min-height:0;padding:0
  }
}

.work-registration{font-size:.26em;font-weight:700;line-height:0;margin-left:.12em;vertical-align:super}

.work-index .work-display.work-photo-ratio{
  min-width:0;width:min(82vw,480px,calc(54dvh * var(--preview-ratio)));
  aspect-ratio:var(--preview-ratio)
}
.work-index .work-photo-ratio .media-stage img{object-fit:contain}

.work-index-bar .work-quote{
  justify-self:end;border:0;border-bottom:1px solid currentColor;
  background:none;color:#111;padding:4px 0;font-size:12px;font-weight:700;text-align:right
}

.work-index .media-stage video{display:block;width:100%;height:100%;object-fit:contain}
.work-index .media-stage :is(img,video)[hidden]{display:none}

.work-instruction-touch{display:none}
@media(max-width:760px),(hover:none){
  .work-instruction-pointer{display:none}
  .work-instruction-touch{display:inline}
}
@media(max-width:760px){
  .holding-b .holding{padding-block:clamp(28px,6svh,54px)}
  .holding-b .hero{min-height:0;justify-content:flex-start}
  .holding-b .hero h1{
    position:static;display:block;width:100%;font-size:clamp(48px,18vw,134px);
    line-height:.92;margin:0 0 clamp(24px,5vw,42px)
  }
  .holding-b .hero p{margin:0}
  .holding-b .hero-actions{margin-top:24px}
}

/* Keep the touch destination above the preview and inside the visible viewport. */
@media(max-width:760px),(hover:none){
  .work-index .work-project-action{pointer-events:auto;z-index:10;min-height:44px;display:flex;align-items:center;touch-action:manipulation;bottom:max(18px,env(safe-area-inset-bottom))}
  .work-index .work-project-action[hidden]{display:none}
}


button,a,label{touch-action:manipulation}

.holding-b .hero-actions button:is(:active,.hero-action-pressed){background:var(--green);color:#111}
#brief-email-fallback{display:block;margin:12px auto 0;padding:8px 12px;min-height:44px;border:0;background:none;color:var(--brief-ink);text-decoration:underline;cursor:pointer;touch-action:manipulation}
#brief-email-fallback[hidden]{display:none}
#email-options{box-sizing:border-box;width:min(25rem,calc(100% - 2rem));height:auto;max-height:calc(100dvh - 2rem);margin:auto;padding:24px;border:1px solid currentColor;background:#fff;color:#111}
#email-options::backdrop{background:#0009}
#email-options h2{margin:0 0 16px;font-size:1.25rem}
#email-options a,#email-options button{display:flex;align-items:center;min-height:44px;color:inherit;text-decoration:underline}
#email-options button{border:0;background:none;font:inherit;padding:0;cursor:pointer}

#brief-thanks{box-sizing:border-box;position:fixed;inset:0;width:100%;height:100dvh;margin:0;padding:clamp(28px,8vw,120px);border:0;background:var(--green);color:#111;overflow:auto}
#brief-thanks[open]{display:flex;flex-direction:column;align-items:flex-start;justify-content:safe center}
#brief-thanks::backdrop{background:transparent}
#brief-thanks h2,#brief-thanks p{max-width:740px}
@media(prefers-reduced-motion:no-preference){
  #brief-thanks[open]{animation:brief-thanks-swipe .55s cubic-bezier(.22,.75,.24,1) both}
}
@keyframes brief-thanks-swipe{from{transform:translateX(100%)}to{transform:translateX(0)}}
#brief-thanks h2{font-size:clamp(36px,7vw,72px);line-height:.95;letter-spacing:-.06em;margin:20px 0}
#brief-thanks button{margin-top:16px;min-height:44px;padding:8px 18px;background:#111;color:#fff;border:1px solid #111;cursor:pointer}
#brief-submit-status{text-align:center;padding:0 var(--pad)}
