.mockup-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#c6a7f6;color:#1c152b;font:600 9px/1.5 Manrope,sans-serif;letter-spacing:1px;padding:12px 6vw}.mockup-bar nav{display:flex;gap:25px}.mockup-bar a{color:inherit;text-decoration:none;letter-spacing:0;font-size:11px}.creative-guidance .composition{align-items:center;gap:4vw}.creative-guidance .brief-stage{padding-top:75px}.creative-guidance .character-conversation{display:grid;grid-template-columns:minmax(140px,1.2fr) 1fr;align-items:center;gap:5px;margin:20px -20px -25px -35px;position:relative;min-height:320px}.creative-guidance .character-conversation::before{content:'';position:absolute;width:220px;height:220px;border-radius:50%;background:#d9ff65;left:30px;top:45px;z-index:-1;box-shadow:0 0 85px #d9ff6520}.creative-guidance .character-conversation>img{width:100%;height:350px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 15px 20px #03071270)}.creative-guidance .character-conversation>div{padding:12px 0 25px}.creative-guidance .character-label{font:600 8px/1.6 Manrope,sans-serif;letter-spacing:1.2px;color:#c4a5f6}.creative-guidance .character-conversation blockquote{font:italic 25px/1.15 Georgia,serif;letter-spacing:-.6px;margin:13px 0 16px;color:#fff8ec}.creative-guidance .character-conversation p{font-size:12px;line-height:1.8;color:#c9c1d8;margin:0 0 20px;max-width:220px}.creative-guidance .character-tip{display:inline-block;background:#c1a0ef;color:#21182e;transform:rotate(-3deg);padding:12px 15px;font:italic 18px/1.1 Georgia,serif;box-shadow:0 8px 20px #0003;border-radius:3px}.creative-guidance .manager-conversation::before{background:#bba0ed}.creative-guidance .manager-conversation .character-tip{background:#d9ff65;transform:rotate(2deg)}.creative-guidance .handover-stage{padding-top:60px;padding-bottom:140px}
@media(min-width:1500px){.creative-guidance .character-conversation>img{height:400px}.creative-guidance .character-conversation blockquote{font-size:30px}}
@media(max-width:1100px){.creative-guidance .character-conversation{max-width:640px;grid-template-columns:1fr 1fr;margin-left:0;margin-right:0}.creative-guidance .character-conversation>img{height:380px}.creative-guidance .character-conversation::before{left:70px;top:70px}.creative-guidance .brief-stage{padding-top:55px}.creative-guidance .character-conversation blockquote{font-size:32px}}
@media(max-width:650px){.mockup-bar{font-size:7px;letter-spacing:.5px;padding:10px 20px;align-items:start;flex-direction:column;gap:5px}.mockup-bar nav{gap:22px}.mockup-bar a{font-size:10px}.creative-guidance .character-conversation{margin:0 -12px -5px -22px;gap:0;grid-template-columns:1.1fr 1fr;min-height:270px}.creative-guidance .character-conversation>img{height:285px}.creative-guidance .character-conversation::before{width:145px;height:145px;left:15px;top:60px}.creative-guidance .character-label{font-size:7px;letter-spacing:.6px}.creative-guidance .character-conversation blockquote{font-size:24px}.creative-guidance .character-conversation p{font-size:11px;line-height:1.7}.creative-guidance .character-conversation>div{padding:10px 0}.creative-guidance .character-tip{font-size:16px;padding:10px}.creative-guidance .brief-stage{padding-top:0}.creative-guidance .handover-stage{padding-top:0}.creative-guidance .campaign-title{font-size:clamp(39px,10.7vw,68px)}}
@media(max-width:360px){.creative-guidance .character-conversation>img{height:245px}.creative-guidance .character-conversation blockquote{font-size:21px}.creative-guidance .character-conversation p{font-size:10px}}

/* Homepage overview: distinct from the detailed brief demo on Why Cleyora. */
.creative-guidance .focus-concept .campaign-title{font-size:clamp(50px,5.7vw,85px)}.creative-guidance .focus-concept .campaign-title em{font-size:1em}.creative-guidance .focus-stage{padding-block:40px}.creative-guidance .focus-content{padding:38px 35px}.creative-guidance .focus-content>.eyebrow{color:#d9ff65;font-size:9px}.creative-guidance .focus-content>h3{font:600 clamp(30px,3.2vw,46px)/1.05 Manrope,sans-serif;letter-spacing:-1.7px;margin:20px 0}.creative-guidance .focus-content>h3 em{font:italic 1.1em Georgia,serif;color:#c7a9f4}.creative-guidance .focus-content>p{font-size:13px;line-height:1.85;color:#c4bbd1;max-width:410px;margin-bottom:30px}.creative-guidance .focus-link{display:grid;grid-template-columns:25px 1fr 18px;gap:16px;align-items:start;padding:24px 0;border-top:1px solid #c9aceb30;color:#f5f3ed;text-decoration:none}.creative-guidance .focus-link:hover h4,.creative-guidance .focus-link:focus-visible h4{color:#d9ff65}.creative-guidance .focus-link:focus-visible{outline:2px solid #d9ff65;outline-offset:5px}.creative-guidance .focus-number{font-size:11px;color:#be9eef;padding-top:4px}.creative-guidance .focus-link h4{font:600 20px/1.25 Manrope,sans-serif;margin:0 0 9px;letter-spacing:-.4px}.creative-guidance .focus-link p{font:12px/1.7 Manrope,sans-serif;color:#bfb5ce;margin:0 0 12px}.creative-guidance .focus-chip{display:inline-block;font:9px/1.4 Manrope,sans-serif;background:#b994f116;border:1px solid #b994f136;border-radius:20px;padding:5px 10px;color:#d9c5f4}.creative-guidance .focus-footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #c9aceb30;padding-top:22px;font-size:10px;line-height:1.7;color:#a99bbd}.creative-guidance .focus-footer a{color:#d9ff65;text-decoration:none}.creative-guidance .focus-link>span:last-child{color:#d9ff65}
@media(max-width:650px){.creative-guidance .focus-concept .campaign-title{font-size:clamp(42px,11vw,65px)}.creative-guidance .focus-stage{padding:0}.creative-guidance .focus-content{padding:25px 20px}.creative-guidance .focus-content>h3{font-size:34px}.creative-guidance .focus-link{gap:10px;grid-template-columns:20px 1fr 15px;padding:23px 0}.creative-guidance .focus-link h4{font-size:18px}.creative-guidance .focus-link p{font-size:11px}.creative-guidance .focus-footer{flex-direction:column;gap:12px}}

.creative-guidance .focus-ui-still{margin:30px -30px -10px -35px}.creative-guidance .focus-ui-still>img{display:block;width:100%;height:auto;max-height:400px;object-fit:contain;filter:drop-shadow(0 20px 30px #0004)}.creative-guidance .focus-ui-still figcaption{display:flex;justify-content:space-between;gap:15px;margin:8px 35px 0;font:8px/1.8 Manrope,sans-serif;letter-spacing:1px;color:#d9ff65}.creative-guidance .focus-ui-still figcaption span{color:#a89bbd;letter-spacing:0}.creative-guidance .focus-concept .composition{align-items:center}@media(max-width:650px){.creative-guidance .focus-ui-still{margin:20px -15px 0}.creative-guidance .focus-ui-still figcaption{margin:5px 15px 0;font-size:7px;letter-spacing:.5px}.creative-guidance .focus-ui-still>img{max-height:320px}}

/* Review annotation reveal, started when the still enters the viewport. */
.creative-guidance .animated-review-still{margin:35px -25px 0 -30px}.review-render-scene{position:relative;padding-bottom:70px;isolation:isolate}.creative-guidance .review-render-scene>img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;filter:drop-shadow(0 18px 30px #0005)}.scroll-review-marks{position:absolute;inset:0;width:100%;height:auto;aspect-ratio:600/440;pointer-events:none;overflow:visible;z-index:1;stroke:#d9ff65;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.scroll-review-box{stroke-dasharray:566;stroke-dashoffset:566;opacity:0}.scroll-review-line{stroke-dasharray:150;stroke-dashoffset:150;opacity:0}.scroll-review-dot{fill:#d9ff65;stroke:#101727;opacity:0}.scroll-review-note{position:absolute;z-index:2;right:2%;bottom:0;width:59%;padding:17px 19px;background:linear-gradient(135deg,#272b43f7,#141c2dfc);border:1px solid #c3a2ed88;border-radius:9px;box-shadow:0 18px 40px #0006;opacity:0;transform:translateY(15px) rotate(1deg);box-sizing:border-box}.scroll-review-person{display:flex;align-items:center;gap:9px}.scroll-review-person>span:first-child{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:#c4a3f2;color:#21182e;font:10px/1 Manrope,sans-serif;flex-shrink:0}.scroll-review-person strong{display:block;font:600 10px/1.4 Manrope,sans-serif;color:#eee7f6}.scroll-review-person small{font:8px/1.6 Manrope,sans-serif;color:#ab9abc}.scroll-note-index{margin-left:auto;display:grid;place-items:center;border:1px solid #d9ff6577;border-radius:50%;width:20px;height:20px;color:#d9ff65;font:9px/1 Manrope,sans-serif}.scroll-review-note>p{font:12px/1.7 Manrope,sans-serif;color:#f2ebf8;margin:13px 0 10px}.scroll-note-meta{font:8px/1.6 Manrope,sans-serif;color:#cfb8ee}.creative-guidance .animated-review-still figcaption{align-items:center;margin-top:20px}.creative-guidance .animated-review-still figcaption>.review-motion-caption{color:#d9ff65;letter-spacing:.8px}.replay-review-still{border:0;border-bottom:1px solid #b99bd570;background:none;color:#c5b0dc;padding:7px 0;font:9px/1.5 Manrope,sans-serif;cursor:pointer;white-space:nowrap}.replay-review-still:focus-visible{outline:2px solid #d9ff65;outline-offset:5px}.review-motion-scope{display:block;margin:10px 35px 0;color:#8f819f;font:8px/1.5 Manrope,sans-serif}.review-revealed .scroll-review-box{animation:review-box-in .65s cubic-bezier(.2,.65,.2,1) .12s both}.review-revealed .scroll-review-line{animation:review-line-in .45s ease .65s both}.review-revealed .scroll-review-dot{animation:review-dot-in .2s ease .95s both}.review-revealed .scroll-review-note{animation:review-note-in .5s cubic-bezier(.2,.7,.2,1) 1.05s both}@keyframes review-box-in{from{stroke-dashoffset:566;opacity:0}to{stroke-dashoffset:0;opacity:1}}@keyframes review-line-in{from{stroke-dashoffset:150;opacity:0}to{stroke-dashoffset:0;opacity:1}}@keyframes review-dot-in{from{opacity:0}to{opacity:1}}@keyframes review-note-in{from{opacity:0;transform:translateY(15px) rotate(1deg)}to{opacity:1;transform:translateY(0) rotate(1deg)}}@media(max-width:650px){.creative-guidance .animated-review-still{margin:25px -15px 0}.review-render-scene{padding-bottom:85px}.scroll-review-note{width:70%;right:2%;padding:13px 15px}.scroll-review-note>p{font-size:11px;margin:10px 0}.scroll-review-person strong{font-size:9px}.scroll-review-person small{font-size:7px}.creative-guidance .animated-review-still figcaption{margin:16px 15px 0;gap:12px}.creative-guidance .animated-review-still figcaption>.review-motion-caption{font-size:6px;letter-spacing:.3px}.replay-review-still{font-size:8px}.review-motion-scope{margin-left:15px;font-size:7px}.scroll-review-marks{stroke-width:2.7}}@media(prefers-reduced-motion:reduce){.animated-review-still .scroll-review-box,.animated-review-still .scroll-review-line{stroke-dashoffset:0;opacity:1;animation:none}.animated-review-still .scroll-review-dot,.animated-review-still .scroll-review-note{opacity:1;transform:none;animation:none}}

.scroll-review-line{stroke-dasharray:1;stroke-dashoffset:1}@keyframes review-line-in{from{stroke-dashoffset:1;opacity:0}to{stroke-dashoffset:0;opacity:1}}

/* Darken the hero image evenly, keeping the tagline treatment clean. */
.hero .hero-art{filter:brightness(.66)}
