:root{--pink:#ea1674;--yellow:#ffdd00;--green:#00c65e;--cyan:#00b5e2;--purple:#5f259f;--navy:#003a70;--paper:#f7f2ea;--border:3px solid #000}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);font-family:"Helvetica Neue",Arial,sans-serif;color:#000}img{display:block;max-width:100%}a{color:inherit}header{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:2rem;padding:1rem 3vw;background:var(--pink);border-bottom:var(--border)}header>a:first-child img{width:175px;height:56px;object-fit:contain}header nav{display:flex;gap:1.5rem;margin-left:auto}header nav a,.pill,.button{font:800 .75rem Montserrat,sans-serif;text-transform:uppercase;text-decoration:none}.pill,.button{display:inline-flex;padding:.9rem 1.2rem;justify-content:center;border:2px solid #000;border-radius:999px}.pill{background:var(--yellow)}.hero{min-height:700px;display:grid;grid-template-columns:.85fr 1.15fr;background:var(--cyan);border-bottom:var(--border);overflow:hidden}.hero>div{padding:clamp(4rem,7vw,8rem) 6vw}.eyebrow{font:800 .75rem Montserrat,sans-serif;letter-spacing:.12em;text-transform:uppercase}.hero h1,.library h2,.usage h2,.contact h2{font:900 clamp(3.5rem,7vw,8rem)/.84 Montserrat,sans-serif;letter-spacing:-.065em;text-transform:uppercase;margin:1rem 0}.hero h1 em{font-family:Georgia,serif;text-transform:none;color:#fff}.hero>div>p:last-of-type{font-size:1.3rem;line-height:1.45;max-width:600px}.hero>img{width:100%;height:100%;object-fit:cover}.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}.button.black{background:#000;color:#fff}.button.white{background:#fff;color:#000}.library{padding:7rem 5vw}.library-heading{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:5rem}.library h2{font-size:clamp(3rem,6vw,6rem)}.filters{display:flex;gap:.5rem;flex-wrap:wrap}.filters button{padding:.8rem 1rem;border:2px solid #000;border-radius:999px;background:#fff;font:800 .7rem Montserrat,sans-serif;text-transform:uppercase;cursor:pointer}.filters button.active{background:#000;color:#fff}.group{scroll-margin-top:100px;margin-bottom:7rem}.group-title{display:flex;align-items:center;gap:1.5rem;margin-bottom:2rem;border-bottom:var(--border);padding-bottom:1rem}.group-title>span{font:900 4rem Montserrat,sans-serif;color:var(--pink)}.group-title h3{font:900 2rem Montserrat,sans-serif;text-transform:uppercase;margin:0}.group-title p{margin:.4rem 0 0}.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.photo-grid article{border:var(--border);border-radius:24px;background:#fff;overflow:hidden}.photo-grid img{width:100%;aspect-ratio:1/1;object-fit:contain;padding:1rem;background:#fff}.photo-grid article>div{padding:1.2rem;border-top:2px solid #000}.photo-grid h4{font:900 1.15rem Montserrat,sans-serif;text-transform:uppercase;margin:0}.photo-grid p{font-size:.9rem;color:#555;margin:.4rem 0 1rem}.photo-grid a{font:800 .72rem Montserrat,sans-serif;text-transform:uppercase;text-decoration-thickness:2px}.usage{display:grid;grid-template-columns:.85fr 1.15fr;gap:4rem;padding:7rem 5vw;background:var(--yellow);border-block:var(--border)}.usage h2{font-size:clamp(3rem,5vw,5.5rem)}.usage ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-content:start}.usage li{background:#fff;border:2px solid #000;border-radius:14px;padding:1rem;font-weight:700}.usage li:before{content:"✓ ";color:var(--green);font-weight:900}.contact{display:grid;grid-template-columns:.6fr 1.4fr;align-items:center;gap:4rem;padding:6rem;background:var(--navy);color:#fff}.contact>img{width:360px}.contact h2{font-size:clamp(3rem,6vw,7rem)}footer{display:flex;gap:2rem;justify-content:space-between;padding:2rem 4vw;background:#000;color:#fff;font:700 .7rem Montserrat,sans-serif;text-transform:uppercase}
@media(max-width:900px){header nav{display:none}.pill{margin-left:auto}.hero,.usage,.contact{grid-template-columns:1fr}.hero>img{min-height:480px}.library-heading{display:block}.filters{margin-top:2rem}.photo-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){header>a:first-child img{width:120px}.pill{font-size:.6rem;padding:.7rem}.hero>div,.library,.usage,.contact{padding:4rem 6vw}.hero h1{font-size:3.2rem}.hero>img{min-height:330px}.photo-grid{grid-template-columns:1fr}.usage ul{grid-template-columns:1fr}.contact>img{width:220px}footer{flex-direction:column}}
