/* A brief becomes a campaign, then a better next round. */
.studio .approach-experience{padding-top:100px;padding-bottom:90px;overflow:visible}
.studio .approach-heading{margin-bottom:30px;align-items:end;gap:7vw}
.studio .approach-heading h2{font-size:clamp(40px,4.5vw,66px);line-height:1.05;letter-spacing:-.025em}
.studio .approach-heading>p{font-size:16px;line-height:1.7;max-width:44ch}
.approach-chapters{display:flex;position:relative;border-bottom:1px solid #20251e35;gap:30px}
.approach-chapters a{flex:1;display:flex;align-items:center;gap:12px;min-height:52px;padding:12px 0;font-size:14px;color:#4e5749;transition:color .2s}
.approach-chapters a span{font-size:12px;font-variant-numeric:tabular-nums}
.approach-chapters a:hover,.approach-chapters a[aria-current=step]{color:#b33c1f}
.approach-progress{position:absolute;left:0;bottom:-1px;width:100%;height:2px;background:#dc4926;transform-origin:left;transform:scaleX(0);pointer-events:none}
.approach-stage{position:relative;margin-top:30px}
.approach-step{display:grid;grid-template-columns:.72fr 1.28fr;gap:5vw;align-items:center;scroll-margin-top:120px}
.approach-step+.approach-step{margin-top:80px}
.approach-experience:not(.is-cinematic) .approach-step{opacity:1!important;visibility:visible!important;transform:none!important}
.approach-copy{max-width:36ch}
.studio .approach-copy h3{font-size:clamp(30px,3.4vw,49px);line-height:1.08;letter-spacing:-.025em;margin:0 0 26px;text-wrap:balance}
.approach-copy p{font-size:16px;line-height:1.75;color:#4e5749;margin:0}
.approach-art{position:relative;aspect-ratio:1.2;min-width:0;isolation:isolate;overflow:clip;border-radius:20px;perspective:1100px;background:#e5e5da}
.approach-art *{box-sizing:border-box}
.approach-art p{margin:0}
.approach-art img{display:block;width:100%;height:100%;object-fit:cover}
.brief-route{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#a7ae9c;stroke-width:1.2}
.brief-route .brief-ink{stroke:#c84928;stroke-width:2;stroke-dasharray:1;stroke-dashoffset:0}
.brief-sheet{position:absolute;left:10%;top:14%;width:62%;height:74%;padding:6%;background:#faf8ef;box-shadow:8px 20px 35px #26352225;transform:rotate(-6deg);transform-origin:50% 80%;display:flex;flex-direction:column;justify-content:space-between}
.brief-sheet-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #20251e35;padding-bottom:14px;font-size:12px}
.brief-sheet-head img{width:23px;height:23px;object-fit:contain}
.brief-client{font-family:Syne,Instrument,sans-serif;font-size:clamp(20px,2.2vw,32px);font-weight:700;letter-spacing:-.035em}
.brief-sheet strong{font-family:Syne,Instrument,sans-serif;font-size:clamp(24px,3vw,43px);font-weight:700;line-height:1.05;letter-spacing:-.03em;display:block;margin:12px 0}
.brief-sheet-foot{font-size:12px;color:#4e5749;line-height:1.5;border-top:1px solid #20251e25;padding-top:14px}
.brief-reference{position:absolute;right:6%;top:12%;width:31%;height:37%;padding:7px 7px 29px;background:#f8f5e9;transform:rotate(9deg);box-shadow:5px 15px 24px #26352225}
.brief-reference figcaption{font-size:12px;line-height:22px;text-align:center;color:#4e5749}
.brief-check{position:absolute;right:7%;bottom:11%;width:28%;aspect-ratio:1;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#ff653d;color:#20251e;transform:rotate(12deg);box-shadow:4px 12px 25px #a03c1825}
.brief-check svg{width:31%;height:25%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.brief-check span{font-size:clamp(12px,1.25vw,16px);font-weight:600;line-height:1.15;text-align:center}
.approach-art--create{background:#ead9c5}
.create-grid{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#a971542e;stroke-width:1}
.campaign-piece{position:absolute;background:#f5e7d0;box-shadow:6px 18px 30px #502b1c30;overflow:hidden}
.campaign-master{left:26%;top:13%;width:49%;height:72%;transform:rotate(-4deg);z-index:2;padding:8px 8px 0;display:flex;flex-direction:column}
.campaign-master img{height:73%;object-fit:cover}
.campaign-master figcaption{padding:10px 6px;font-family:Syne,Instrument,sans-serif;font-weight:700;font-size:clamp(21px,2.8vw,40px);letter-spacing:-.045em;line-height:1}
.campaign-master figcaption span{display:block;font-family:Instrument,sans-serif;font-size:12px;letter-spacing:0;font-weight:400;line-height:1.4;margin-top:6px}
.campaign-story{width:26%;height:67%;left:5%;top:19%;transform:rotate(-12deg);z-index:1;border:6px solid #24392c;border-radius:12px}
.campaign-story img{height:100%}
.campaign-story figcaption{position:absolute;bottom:0;left:0;right:0;background:#24392c;color:#fff1d6;padding:12px 10px;font-family:Syne,Instrument,sans-serif;font-weight:700;font-size:clamp(16px,1.65vw,24px);line-height:1.1}
.campaign-feed{width:28%;height:43%;right:3%;top:36%;transform:rotate(11deg);z-index:3;padding:6px 6px 0}
.campaign-feed img{height:74%}
.campaign-feed figcaption{padding:8px 4px;font-family:Syne,Instrument,sans-serif;font-weight:700;font-size:clamp(13px,1.3vw,18px);line-height:1.08}
.create-seal{position:absolute;left:33%;bottom:6%;background:#24392c;color:#f5e7d0;padding:10px 16px;border-radius:30px;font-size:12px;z-index:4;display:flex;gap:8px;align-items:center}
.create-seal svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
.approach-art--review{background:#19221d;color:#f1f0e9}
.review-orbit{position:absolute;inset:3% 3% 17%;width:94%;height:80%;fill:none;stroke:#f1f0e922;stroke-width:1.2}
.review-route{stroke:#ff8e6d;stroke-width:2.3;stroke-dasharray:1;stroke-dashoffset:0}
.review-post{position:absolute;left:36%;top:24%;width:31%;height:43%;padding:7px 7px 0;background:#f2e4cf;transform:rotate(-7deg);box-shadow:5px 18px 28px #0005;color:#24392c}
.review-post img{height:74%}
.review-post figcaption{font-family:Syne,Instrument,sans-serif;font-size:clamp(16px,1.8vw,26px);font-weight:700;letter-spacing:-.035em;padding:8px 3px}
.review-note{position:absolute;font-size:clamp(13px,1.4vw,18px);line-height:1.35;max-width:12ch;color:#f1f0e9;background:#19221d;padding:4px 0}
.review-note svg{display:block;width:28px;height:28px;margin-bottom:10px;fill:none;stroke:#ff8e6d;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.review-note--attention{top:13%;left:7%}
.review-note--action{right:6%;top:24%;max-width:10ch}
.review-note--next{bottom:9%;left:12%;max-width:none}
.review-note--next strong{display:block;font-family:Syne,Instrument,sans-serif;font-size:clamp(22px,2.7vw,38px);font-weight:700;line-height:1.05;letter-spacing:-.025em;color:#ff8e6d}
.review-note--next span{display:block;font-size:12px;margin-top:10px;color:#c7d0c5}
.approach-caption{font-size:12px;line-height:1.5;color:#4e5749;margin:16px 0 0;text-align:right}
.approach-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4vw;margin-top:55px}
.approach-examples .process-example{margin-top:0}
.approach-examples summary{font-size:15px}
.approach-examples .process-example p{font-size:16px!important}
.approach-experience.is-cinematic .approach-pin{height:calc(100svh - 116px);max-height:960px;min-height:620px;display:flex;flex-direction:column}
.approach-experience.is-cinematic .approach-heading,.approach-experience.is-cinematic .approach-chapters,.approach-experience.is-cinematic .approach-caption{flex-shrink:0}
.approach-experience.is-cinematic .approach-stage{flex:1;min-height:0;overflow:clip}
.approach-experience.is-cinematic .approach-step{position:absolute;inset:0;margin:0}
.approach-experience.is-cinematic .approach-art{height:100%;aspect-ratio:auto;width:100%;max-height:620px}
.approach-experience.is-cinematic .approach-copy{padding:20px 0}
@media(max-width:1099px),(max-height:819px){.approach-heading{margin-bottom:25px}.approach-step{gap:4vw}.approach-step+.approach-step{padding-top:50px;border-top:1px solid #20251e25}.approach-caption{text-align:left}.brief-sheet strong{font-size:clamp(25px,3.4vw,38px)}}
@media(max-width:800px){
 .studio .approach-experience{padding-top:70px;padding-bottom:70px}
 .studio .approach-heading{display:block;margin-bottom:25px}
 .studio .approach-heading h2{font-size:clamp(37px,7.8vw,58px);margin-bottom:25px}
 .studio .approach-heading>p{max-width:48ch}
 .approach-chapters{gap:14px}
 .approach-chapters a{gap:7px;font-size:13px;line-height:1.3;align-items:baseline}
 .approach-chapters a span{display:none}
 .approach-stage{margin-top:40px}
 .approach-step{grid-template-columns:1fr;gap:26px;scroll-margin-top:100px}
 .approach-step+.approach-step{margin-top:50px;padding-top:40px}
 .approach-copy{max-width:48ch}
 .studio .approach-copy h3{font-size:34px;max-width:17ch;margin-bottom:17px}
 .approach-art{aspect-ratio:1.08;border-radius:14px}
 .brief-sheet{top:9%;height:83%;padding:5%}
 .brief-sheet strong{font-size:clamp(25px,5.4vw,43px)}
 .brief-client{font-size:24px}.brief-sheet-head{padding-bottom:10px}.brief-sheet-foot{padding-top:10px}
 .brief-reference{padding:5px 5px 25px}.brief-reference figcaption{font-size:12px}
 .brief-check span{font-size:12px}.brief-check{gap:6px}
 .campaign-master figcaption{font-size:clamp(22px,5.8vw,36px);padding:9px 3px}
 .campaign-master figcaption span{font-size:12px;line-height:1.2}
 .campaign-story figcaption{font-size:clamp(16px,3.8vw,24px);padding:10px 6px}
 .campaign-feed figcaption{font-size:clamp(13px,3.3vw,19px);padding:6px 2px}
 .create-seal{left:29%;font-size:12px;padding:8px 12px}
 .review-post figcaption{font-size:clamp(17px,4.5vw,26px);padding:8px 2px}
 .review-note{font-size:14px;max-width:11ch}.review-note--action{max-width:9ch;right:5%}
 .review-note svg{width:24px;height:24px;margin-bottom:8px}
 .review-note--next{max-width:none;left:10%;bottom:10%}.review-note--next strong{font-size:clamp(24px,5.5vw,35px)}
 .approach-examples{grid-template-columns:1fr;gap:22px;margin-top:35px}
}
@media(max-width:360px){.brief-sheet strong{font-size:22px}.brief-sheet-head,.brief-sheet-foot{font-size:12px}.campaign-master figcaption span{display:none}.review-note{font-size:12px}.review-post figcaption{font-size:15px}}
@media(prefers-reduced-motion:reduce){.approach-chapters a{transition:none}}