/* Visual journeys, project entry points and a tactile briefing board. */
.cap-how-steps{gap:22px}.cap-how-steps li{border:0;padding:0;display:block!important}.flow-visual{position:relative;height:220px;margin-bottom:28px;background:var(--stone)}.flow-visual img{height:100%;width:100%;object-fit:cover;transition:filter .5s,transform .6s var(--ease)}.flow-visual:hover img{filter:saturate(1.1)}.flow-badge{position:absolute;left:12px;top:12px;width:36px;height:36px;background:var(--paper);color:var(--blue);display:grid;place-items:center;font-size:15px;border-radius:50%}.flow-arrow{position:absolute;right:-27px;top:50%;width:32px;height:32px;background:var(--paper);color:var(--blue);display:grid;place-items:center;border-radius:50%;z-index:1;font-size:23px}.cap-how-steps li:last-child .flow-arrow{display:none}.cap-how-number{display:none}.cap-how-steps h3{font-size:25px;min-height:60px}.cap-how-steps p{line-height:1.6}.cap-how-steps .cap-how-detail{border-top:1px solid var(--line);padding-top:16px}.visual-start{padding-top:85px;padding-bottom:65px}.visual-eyebrow{font:400 14px/1.5 'DM Sans',sans-serif;letter-spacing:.02em;margin-bottom:18px}.visual-start .visual-eyebrow{color:#e4edf6}.visual-start .cp-start-head{margin-bottom:40px}.starting-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.starting-choice{display:block;text-align:left;padding:0 0 20px;min-width:0;border-bottom:1px solid #ffffff50;color:white;transition:border-color .3s}.starting-choice[aria-selected=true]{border-bottom:3px solid white}.starting-choice .choice-art{transition:transform .5s var(--ease),opacity .5s}.starting-choice:hover .choice-art{transform:translateY(-5px)}.choice-art{height:290px;position:relative;background:#d3dce0;overflow:hidden}.ready-art>img{height:100%;object-position:50% 40%}.art-label{position:absolute;left:16px;right:16px;bottom:16px;background:var(--paper);padding:13px 15px;color:var(--ink);display:grid;gap:4px}.art-label span{font-size:11px;letter-spacing:.07em}.art-label b{font-size:15px;font-weight:400}.choice-title{font-family:'Young Serif',Georgia,serif;font-size:25px;line-height:1.2;display:flex;justify-content:space-between;gap:15px;margin:22px 0 10px}.choice-title i{font:400 24px 'DM Sans',sans-serif;font-style:normal}.choice-sub{display:block;font-size:15px;color:#e7eff7;line-height:1.5}.reference-art{background:#e9e6dc}.reference-art img{position:absolute;box-shadow:0 5px 15px #18364618;border:7px solid var(--paper);object-fit:cover}.reference-art img:first-child{left:10%;top:7%;width:58%;height:78%;transform:rotate(-8deg)}.reference-art img:nth-child(2){right:6%;bottom:14%;width:43%;height:48%;transform:rotate(8deg)}.reference-caption{position:absolute;left:12%;bottom:4%;font-size:13px;color:var(--blue)}.idea-art{background:#c6d4df;display:grid;place-items:center}.idea-paper{width:80%;padding:20px 15px;background:#f3f1e8;color:var(--blue);transform:rotate(-5deg);box-shadow:0 7px 17px #18364615}.idea-paper>span{font-size:10px;letter-spacing:.06em;display:block}.idea-paper svg{width:100%;height:155px;display:block;margin:8px 0}.idea-swatch{position:absolute;bottom:10%;right:6%;width:65px;height:65px;background:#346b9f;transform:rotate(9deg);border:8px solid var(--paper)}.starting-result{margin-top:35px;padding-top:30px;border-top:1px solid #ffffff50;display:grid;grid-template-columns:1.2fr 1fr;gap:25px 8%;align-items:center}.starting-result h3{font-size:30px;margin-bottom:15px;line-height:1.2}.starting-result p{color:#edf3f9;font-size:16px;line-height:1.6;max-width:560px}.result-route{display:flex;align-items:center;gap:10px;justify-content:space-between}.result-route span{padding:12px 0;border-top:2px solid #ffffff50;color:#d4e1ec;font-size:14px;flex:1;text-align:center}.result-route span.on{border-color:white;color:white}.result-route i{font-style:normal;color:#d4e1ec}.starting-result>.btn{background:white;color:var(--blue);justify-self:start;min-height:48px}.visual-prep{grid-template-columns:1fr 1fr;gap:10%;background:#e9ece7;padding-top:100px;padding-bottom:100px;align-items:center}.visual-prep .visual-eyebrow{color:var(--blue)}.visual-prep .cp-prep-head h2{font-size:clamp(38px,4vw,62px)}.visual-prep .cp-actions{flex-wrap:wrap}.brief-swatch{display:flex;gap:20px;align-items:center;margin-top:50px}.brief-swatch img{width:115px;height:105px;object-fit:cover}.brief-swatch p{font-size:15px;color:var(--sub);line-height:1.5}.brief-board{position:relative;padding:100px 0 20px 25px}.brief-reference{position:absolute;right:20px;top:0;width:75%;transform:rotate(6deg);background:var(--paper);padding:8px 8px 15px;box-shadow:0 7px 25px #223d4a12}.brief-reference img{height:180px;width:100%;object-fit:cover}.brief-reference>span{font-size:12px;display:block;color:var(--sub);margin:10px 5px 0}.brief-paper{position:relative;background:#fffef9;padding:30px 30px 22px;transform:rotate(-3deg);box-shadow:0 12px 35px #223d4a13;border:1px solid #e2e3da}.brief-paper-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-bottom:20px;border-bottom:1px solid var(--line)}.brief-paper-head img{width:38px;height:35px;object-fit:contain}.brief-paper-head>span{font-size:11px;letter-spacing:.06em;color:var(--sub)}.brief-paper h3{font-size:25px;line-height:1.25;margin:25px 0 10px}.brief-paper>p{font-size:14px;color:var(--sub)}.brief-checks{margin:20px 0}.brief-checks label{display:flex;gap:13px;align-items:center;padding:12px 0;border-bottom:1px solid #e5e7de;font-size:15px;line-height:1.35;cursor:pointer}.brief-checks input{appearance:auto;width:18px;height:18px;accent-color:var(--blue);margin:0;flex-shrink:0}.brief-checks label:has(input:checked){color:var(--blue)}.brief-readiness{color:var(--blue)!important;font-size:14px!important;min-height:42px}.brief-paper-foot{display:block;font-size:11px;color:var(--sub);line-height:1.4;margin-top:12px}
@media(max-width:1000px){.cap-how-steps{gap:40px 25px}.flow-visual{height:250px}.cap-how-steps h3{min-height:0}.cap-how-steps li:nth-child(2) .flow-arrow{display:none}.choice-art{height:230px}.starting-choices{gap:18px}.choice-title{font-size:22px}.choice-sub{font-size:14px}.idea-paper{padding:15px}.idea-paper svg{height:110px}.idea-swatch{height:50px;width:50px}.starting-result{grid-template-columns:1fr;gap:25px}.result-route{max-width:500px}.visual-prep{gap:6%}.brief-paper{padding:25px 20px}.brief-paper h3{font-size:23px}.brief-checks label{font-size:14px}}
@media(max-width:700px){.cap-how-steps{gap:35px}.flow-visual{height:270px;margin-bottom:22px}.flow-arrow{display:none}.cap-how-steps h3{font-size:27px;margin-bottom:15px}.cap-how-steps .cap-how-detail{margin-top:15px}.visual-start{padding-top:60px;padding-bottom:50px}.visual-start .cp-start-head{display:block}.visual-start .cp-start-head>p{margin-top:20px}.starting-choices{grid-template-columns:1fr;gap:25px}.starting-choice{display:grid;grid-template-columns:105px 1fr;gap:0 20px;padding-bottom:25px;align-items:center}.choice-art{height:125px;grid-row:1/3}.choice-title{font-size:22px;align-self:end;margin:0 0 12px}.choice-title i{font-size:20px}.choice-sub{align-self:start}.art-label{left:5px;right:5px;bottom:5px;padding:5px}.art-label>span{display:none}.art-label>b{font-size:10px}.reference-art img{border-width:3px}.reference-caption{font-size:8px}.idea-paper{padding:7px;width:85%}.idea-paper>span{font-size:5px}.idea-paper svg{height:65px;margin:4px 0}.idea-swatch{height:28px;width:28px;border-width:4px}.starting-result h3{font-size:27px}.result-route{gap:5px}.result-route span{font-size:12px}.result-route i{font-size:12px}.visual-prep{grid-template-columns:1fr;padding-top:60px;padding-bottom:65px;gap:35px}.brief-swatch{margin-top:30px}.brief-board{max-width:460px;width:100%;margin:auto;padding-left:12px;padding-right:8px}.brief-reference{width:75%}.brief-paper{padding:25px}.brief-paper h3{font-size:25px}.brief-checks label{font-size:15px}}
@media(prefers-reduced-motion:reduce){.starting-choice .choice-art,.flow-visual img{transition:none}}

/* Figma update: fabric behind the hero, outline buttons, two-column how-it-works */
.cp-top{background:url('assets/cp-hero-fabric.jpg') center/cover}
.btn-outline{background:transparent;color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue)}
.btn-outline:hover{background:var(--blue);color:#fff}
.btn-outline .mi{fill:currentColor}
.cp-actions .btn-outline{min-height:50px;padding:12px 20px 12px 22px;gap:18px;font-size:15px}
.cap-how{display:grid;grid-template-columns:1fr 1.25fr;gap:8%;align-items:start;background:#fff}
.cap-how-intro h2{margin-bottom:26px}
.cap-how-intro p{font-size:18px;line-height:1.55;color:var(--sub);max-width:440px}
.cap-how-intro .btn{margin-top:36px}
.cap-how-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 22px}
.cap-how-steps li{border-top:0;padding-top:0}
.cap-how-steps .flow-visual{height:220px;margin-bottom:26px;border-radius:6px;overflow:hidden}
.cap-how-steps .flow-badge{width:auto;height:auto;padding:5px 18px;border-radius:99px;font-size:15px}
.cap-how-steps h3{font-size:26px;margin-bottom:16px;min-height:0}
.cap-how-steps p{font-size:16px;line-height:1.6}
.starting-choice{cursor:pointer}
.prep-head .cp-actions,.cp-prep-head .cp-actions{gap:12px}
.cp-prep-head .btn{min-height:50px}
@media(max-width:1050px){.cap-how{grid-template-columns:1fr;gap:48px}}