.creative-hero{position:relative;min-height:710px;grid-template-columns:1.02fr 1fr;gap:30px;padding:70px max(6vw,24px) 85px;background:radial-gradient(ellipse at 92% 18%,#e9dfef 0,transparent 44%),radial-gradient(ellipse at 10% 95%,#e4eddf 0,transparent 42%),#fbf8f0}
.creative-hero .eyebrow{background:transparent;padding:0;font-size:11px;letter-spacing:.15em;color:#635e4d}
.creative-hero h1{font-weight:500;font-size:clamp(48px,5.3vw,78px);line-height:1.05;letter-spacing:-.04em;margin:24px 0}
.creative-hero .hero-lede{font-size:18px;line-height:1.8;color:#586257;max-width:550px}
.creative-hero .hero-actions{flex-wrap:wrap;gap:14px}
.creative-hero .button{border-radius:99px;min-height:52px}.creative-hero .button.outline{background:transparent}
.creative-hero .button:focus-visible{outline:3px solid #315b4b;outline-offset:4px}
.metrics small{display:block;font-size:11px;color:#c5d4cc;margin-top:5px}
@media(max-width:480px){.metrics{gap:0;padding:26px 12px}.metrics>div{padding:0 8px}.metrics span{font-size:12px}.metrics small{font-size:10px;line-height:1.5}.metrics strong{font-size:30px}}
.creative-hero .studio-composition{display:block;height:auto;aspect-ratio:1.08;min-width:0;perspective:none;position:relative}
.composition-arch{position:absolute;inset:3% 11% 10%;background:linear-gradient(140deg,#e5d9c0,#e3d9e9 60%,#d7e2d0);border-radius:48% 48% 3px 3px;transform:rotate(9deg)}
.composition-line{position:absolute;width:110%;height:110%;left:-5%;top:-5%}
.composition-frame{position:absolute;margin:0;background:#fffdf7;padding:12px;box-shadow:0 20px 40px #4c3b2b25}
.composition-frame img{display:block;width:100%;object-fit:cover}.composition-frame figcaption{font-size:9px;letter-spacing:.13em;text-transform:uppercase;padding-top:10px;color:#645b4c}
.composition-main{width:77%;left:14%;top:12%;transform:rotate(6deg)}.composition-main img{height:auto;aspect-ratio:1.42}
.composition-detail{width:38%;left:1%;top:45%;transform:rotate(-10deg)}.composition-detail img{height:auto;aspect-ratio:.85}
.composition-swatches{position:absolute;display:flex;gap:5px;right:2%;bottom:18%;transform:rotate(8deg);padding:9px;background:#fffdf7;box-shadow:0 8px 18px #4c3b2b18}
.composition-swatches span{width:clamp(16px,2vw,28px);height:clamp(23px,3vw,39px);background:#385b49}.composition-swatches span:nth-child(2){background:#a5b49a}.composition-swatches span:nth-child(3){background:#ddbe7b}.composition-swatches span:nth-child(4){background:#c78870}.composition-swatches span:nth-child(5){background:#8c82a6}
.composition-note{position:absolute;bottom:0;left:44%;margin:0;font:22px/1.25 'Playfair Display',serif;color:#465b47;transform:rotate(-4deg)}
@media(max-width:1000px){.creative-hero{grid-template-columns:1fr;gap:48px;padding:55px max(6vw,24px) 65px}.creative-hero .hero-copy{max-width:680px}.creative-hero .studio-composition{width:min(590px,100%);margin:auto}.creative-hero h1{font-size:clamp(46px,7vw,68px)}}
@media(max-width:600px){.creative-hero{padding:42px 24px 55px;gap:38px}.creative-hero h1{font-size:46px}.creative-hero .hero-lede{font-size:17px}.creative-hero .hero-actions .button{width:100%}.composition-frame{padding:8px}.composition-frame figcaption{font-size:7px;padding-top:6px}.composition-note{font-size:18px}.composition-swatches{padding:6px;gap:3px}}
