.marketing-demo{width:min(100% - 3rem,1320px);padding:0 0 5rem}
.marketing-hero{min-height:540px;display:grid;grid-template-columns:1fr .8fr;align-items:center;gap:3rem;position:relative}
.marketing-hero:before{content:"";position:absolute;inset:0 -6vw;background-image:linear-gradient(#eee9e4 1px,transparent 1px),linear-gradient(90deg,#eee9e4 1px,transparent 1px);background-size:62px 62px;z-index:-1}
.marketing-hero h1{font:800 clamp(3.4rem,5vw,6rem)/1.03 var(--sans);letter-spacing:-.075em;margin:1.2rem 0}
.marketing-hero h1 em{font-style:normal;background:#ff530d;color:#fff;padding:0 .12em;border-radius:6px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.marketing-hero p{max-width:630px;color:#615a60;line-height:1.8}
.marketing-hero-actions{display:flex;align-items:center;gap:1rem;margin-top:1.8rem;flex-wrap:wrap}
.marketing-hero-actions span{font-size:.7rem;color:#777074;max-width:200px}
.marketing-sculpture{height:340px;position:relative;perspective:700px;display:grid;place-items:center}
.sculpture-disc{width:230px;height:230px;border-radius:50%;display:grid;place-items:center;background:#ff530d;box-shadow:27px 28px 0 #ffd0ba,0 25px 60px #a84e2b40;transform:rotateX(16deg) rotateY(-20deg);animation:float 7s ease-in-out infinite}
.sculpture-disc span{font-weight:800;font-size:9rem;color:#fff;letter-spacing:-.12em;transform:translateX(-.4rem)}
.sculpture-card{position:absolute;padding:.75rem 1rem;background:#fff;border:1px solid #e5cdbc;box-shadow:10px 12px 0 #ead4c7;border-radius:7px;font-size:.63rem;letter-spacing:.1em;font-weight:800;transform:rotate(-6deg)}
.sculpture-card.top{top:12%;left:4%}.sculpture-card.bottom{right:0;bottom:6%;transform:rotate(7deg)}
@keyframes float{50%{transform:rotateX(12deg) rotateY(-15deg) translateY(-14px)}}
.marketing-workspace{background:#fff;border:1px solid #e6ddd7;border-radius:17px;box-shadow:0 25px 70px #3a231a13;overflow:hidden;margin-top:1rem}
.marketing-workspace-head{padding:1.7rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;border-bottom:1px solid #ece5e0}
.marketing-workspace-head small,.stage-topline,.service-index,.deliverables small,.marketing-final small{font-size:.6rem;letter-spacing:.12em;font-weight:800;color:#a1461e}
.marketing-workspace-head h2{font:800 2rem var(--sans);letter-spacing:-.06em;margin:.25rem 0}
.marketing-workspace-head p{font-size:.75rem;color:#746c70;margin:0}
.brief-status{background:#fff0e7;color:#9d431d;border-radius:99px;padding:.45rem .75rem;font-size:.58rem;font-weight:800;white-space:nowrap}
.marketing-workspace-grid{display:grid;grid-template-columns:250px 1fr;min-height:530px}
.service-picker{background:#fbf8f5;border-right:1px solid #e9e0da;padding:1rem .7rem}
.service-tab{width:100%;display:flex;align-items:center;gap:.7rem;text-align:left;border:0;background:transparent;padding:.8rem .7rem;border-radius:7px;font-size:.72rem;font-weight:700;color:#4e484d;cursor:pointer}
.service-tab:hover,.service-tab[aria-pressed="true"]{background:#fff0e7;color:#a13d16}
.service-tab span{font-size:.57rem;color:#a35938}.service-tab b{margin-left:auto}
.service-tab:focus-visible,#flow-next:focus-visible,#flow-reset:focus-visible{outline:3px solid #ff8e59;outline-offset:2px}
.service-stage{padding:1.5rem 2rem;min-width:0}
.stage-topline{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid #eee4df;padding-bottom:1rem}
.creative-preview{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center;padding-top:2rem}
.preview-editorial{width:min(100%,340px);margin:auto;transform:perspective(900px) rotateY(-7deg) rotateX(2deg);transition:transform .55s}
.preview-editorial:hover{transform:perspective(900px) rotateY(0) rotateX(0)}
.preview-editorial>small{display:block;color:#a2431e;font-size:.56rem;font-weight:800;letter-spacing:.12em;margin-bottom:.5rem}
.preview-poster{aspect-ratio:.8;background:linear-gradient(135deg,#2f2629,#130f10);color:#fff;padding:1.4rem;display:flex;flex-direction:column;box-shadow:14px 17px 0 #e8d1c5;position:relative;overflow:hidden}
.preview-poster:after{content:"";position:absolute;width:160px;height:160px;border:26px solid #ff530d;border-radius:50%;right:-65px;bottom:42px;transform:rotate(-20deg)}
.preview-poster>span{font-size:.65rem;font-weight:800;line-height:1;letter-spacing:-.04em}
.preview-poster strong{font:800 clamp(2.3rem,3.2vw,4rem)/.95 var(--sans);letter-spacing:-.075em;margin:auto 0;position:relative;z-index:1}
.preview-poster>small{font-size:.6rem;letter-spacing:.12em;color:#ffb18d;font-weight:800;position:relative;z-index:1}
.preview-caption{display:flex;justify-content:space-between;border-top:1px solid #ded5cf;padding-top:.7rem;margin-top:1.4rem;font-size:.55rem;font-weight:800;letter-spacing:.08em;color:#8e5942}
.service-index{margin-bottom:1rem}
.service-description h3{font:800 clamp(2rem,2.8vw,3rem)/1.05 var(--sans);letter-spacing:-.065em;margin:0 0 1rem}
.service-description p{font-size:.82rem;line-height:1.75;color:#635d61;max-width:390px}
.deliverables{margin-top:2rem;border-top:1px solid #e7ddd6;padding-top:1rem}
.deliverables ul{padding-left:1rem;font-size:.72rem;line-height:1.9;color:#454046}
.approval-flow{display:grid;grid-template-columns:.7fr 1.3fr;gap:4rem;padding:6rem 0;align-items:center}
.approval-flow h2,.marketing-final h2{font:800 clamp(2.4rem,3.8vw,4.3rem)/1.06 var(--sans);letter-spacing:-.07em;margin:.7rem 0}
.approval-flow p{font-size:.83rem;line-height:1.75;color:#655f63;max-width:400px}
.approval-flow .demo-button{margin:.5rem .5rem .5rem 0}
.approval-flow .flow-note{color:#a2431d;font-size:.7rem;font-weight:800}
.flow-rail{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #e6d9d0;border-radius:13px;overflow:hidden;background:#fff}
.flow-step{min-height:210px;padding:1.5rem 1rem;border-right:1px solid #e6d9d0;display:flex;flex-direction:column;transition:background .3s,color .3s}
.flow-step:last-child{border-right:0}.flow-step.current{background:#ff530d;color:#fff}.flow-step.done{background:#fff1e8}
.flow-step span{font-size:.6rem;letter-spacing:.12em;font-weight:800;opacity:.75}
.flow-step b{font-size:1.15rem;letter-spacing:-.05em;margin-top:auto}
.flow-step small{font-size:.63rem;line-height:1.5;opacity:.76;margin-top:.5rem}
.marketing-final{background:#211c20;color:#fff;border-radius:15px;padding:2.5rem;display:flex;justify-content:space-between;gap:2rem;align-items:center}
.marketing-final small{color:#ff9e71}.marketing-final h2{font-size:clamp(2rem,3vw,3.5rem);margin:.4rem 0}
@media(max-width:1000px){.marketing-hero{grid-template-columns:1fr}.marketing-sculpture{height:280px}.marketing-workspace-grid{grid-template-columns:210px 1fr}.creative-preview{gap:1.2rem}.approval-flow{grid-template-columns:1fr;gap:2rem}}
@media(max-width:700px){.marketing-demo{width:min(100% - 2rem,1320px)}.marketing-hero{min-height:auto;padding:3rem 0 1rem}.marketing-hero h1{font-size:clamp(3rem,11vw,4.2rem)}.marketing-sculpture{height:250px}.sculpture-disc{width:170px;height:170px}.sculpture-disc span{font-size:6.5rem}.marketing-workspace-head{padding:1.2rem;align-items:flex-start}.brief-status{display:none}.marketing-workspace-grid{grid-template-columns:1fr}.service-picker{display:flex;overflow:auto;border-right:0;border-bottom:1px solid #e9e0da;padding:.5rem}.service-tab{white-space:nowrap;width:auto;flex:none}.service-tab b{display:none}.service-stage{padding:1.2rem}.creative-preview{grid-template-columns:1fr}.preview-editorial{width:min(100%,260px)}.preview-poster strong{font-size:2.5rem}.service-description{padding:1rem 0}.approval-flow{padding:4rem 0}.flow-rail{grid-template-columns:1fr 1fr}.flow-step{min-height:145px}.flow-step:nth-child(2){border-right:0}.flow-step:nth-child(-n+2){border-bottom:1px solid #e6d9d0}.marketing-final{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.sculpture-disc{animation:none}.preview-editorial,.flow-step{transition:none}}
