/* Maria Baron page — standalone styles */
:root{--black:#0A0A0A;--white:#fff;--bone:#E8E7E4;--grey:#8A8A8A;--warm:#F2F3F2;--graphite:#141413;--pink:#FF2D87;--font:"Helvetica Neue",Helvetica,"Inter Tight",Arial,sans-serif;--ease:cubic-bezier(.2,0,0,1)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--black);font-family:var(--font);-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:inherit;text-decoration:none;transition:opacity 160ms var(--ease)}
a:hover{opacity:.6}
.label{font-size:11px;letter-spacing:.4em;text-transform:uppercase;font-weight:500}
.sig{font-size:13px;letter-spacing:.3em;text-transform:lowercase}
.u{border-bottom:1px solid currentColor}
.wrap{padding-left:10vw;padding-right:10vw}
section{scroll-margin-top:72px}
.sec{padding-top:clamp(80px,12vh,140px);padding-bottom:clamp(80px,12vh,140px);display:flex;flex-direction:column;gap:56px}
.sec--tight-top{padding-top:clamp(40px,6vh,80px)}
.sec-label{display:flex;align-items:baseline;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--black)}
.sec-label b{font-size:13px;letter-spacing:.4em;font-weight:700}
.dark .sec-label{border-color:rgba(232,231,228,.28)}
.dot{display:inline-block;width:.16em;height:.16em;border-radius:50%;background:var(--pink);margin-left:.04em}
/* header */
.site-header{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid var(--black);padding:0 max(24px,6vw);height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.site-header img{height:40px;width:auto;display:block}
.site-header nav{display:flex;gap:clamp(16px,3vw,40px);flex-wrap:wrap;justify-content:flex-end}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;height:48px;padding:0 28px;border:1px solid var(--black);border-radius:0;font-family:var(--font);font-size:12px;font-weight:500;letter-spacing:.4em;text-transform:uppercase;white-space:nowrap;cursor:pointer;background:var(--black);color:#fff;transition:background 160ms var(--ease),color 160ms var(--ease)}
.btn:hover{opacity:1;background:#fff;color:var(--black)}
.btn .arr{letter-spacing:0;transition:transform 320ms var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.btn--lg{height:60px;padding:0 40px;font-size:13px}
.btn--inv{background:#fff;color:var(--black);border-color:#fff}
.btn--inv:hover{background:var(--black);color:#fff}
.btn--ghost{background:transparent;border-color:transparent;padding:0;color:inherit}
.btn--ghost:hover{background:transparent;color:inherit;opacity:.6}
/* hero */
.hero{position:relative;background:var(--black);color:var(--bone);min-height:calc(100vh - 72px);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:56px 10vw 48px}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:18% 50%;display:block}
.hero__copy{position:relative;margin-left:auto;width:min(520px,40vw);display:flex;flex-direction:column;gap:40px;padding-bottom:clamp(24px,6vh,72px)}
.hero h1{margin:0;font-weight:700;font-size:clamp(48px,5.6vw,104px);line-height:.95;letter-spacing:-.04em;text-wrap:balance}
.hero p{margin:0;font-size:18px;line-height:1.6;max-width:40ch;text-wrap:pretty}
.hero__btns{display:flex;gap:24px;flex-wrap:wrap;align-items:center}
.hero__foot{position:relative;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid rgba(232,231,228,.28);padding-top:20px}
@media (max-width:1099px){
 .hero{min-height:0;padding:0 0 40px}
 .hero__img{position:static;aspect-ratio:4/3;height:auto;object-position:30% 50%}
 .hero__copy{margin:0;width:auto;gap:32px;padding:48px 10vw}
 .hero__foot{margin:0 10vw}
}
/* direction */
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:40px 56px}
.grid3 div{display:flex;flex-direction:column;gap:16px}
h3{margin:0;font-weight:500;font-size:clamp(28px,2.6vw,40px);line-height:1.15;letter-spacing:-.02em}
.body{margin:0;font-size:16px;line-height:1.6;text-wrap:pretty}
/* work */
.work{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(48px,6vw,96px) clamp(24px,3vw,48px)}
.work article{display:flex;flex-direction:column;gap:20px}
.work figure{margin:0;position:relative;aspect-ratio:4/5;background:var(--warm);overflow:hidden}
.work figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform 640ms var(--ease)}
.work article:hover figure img{transform:scale(1.02)}
.work__meta{display:flex;justify-content:space-between;align-items:baseline;gap:24px;border-top:1px solid var(--black);padding-top:16px;flex-wrap:wrap}
.work__meta div{display:flex;flex-direction:column;gap:8px}
.work__name{font-weight:500;font-size:clamp(24px,2.2vw,32px);line-height:1.15;letter-spacing:-.02em}
.caption{font-size:12px;line-height:1.5;color:var(--grey)}
/* services */
.dark{background:var(--black);color:var(--bone)}
.svc{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px 48px;padding:32px 0;border-bottom:1px solid rgba(232,231,228,.28);align-items:baseline}
.svc strong{font-weight:700;font-size:clamp(48px,6vw,96px);line-height:.95;letter-spacing:-.04em}
.svc span{font-size:16px;line-height:1.6;max-width:44ch;text-wrap:pretty}
/* about */
.about{display:flex;flex-wrap:wrap;gap:48px clamp(32px,4vw,64px);align-items:flex-start}
.about figure{margin:0;position:relative;flex:1 1 280px;max-width:540px;aspect-ratio:4/5;background:var(--graphite)}
.about figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:block}
.about__copy{flex:2 1 480px;min-width:0;display:flex;flex-direction:column;gap:28px}
.about__copy .body{max-width:72ch}
.lead{margin:0;font-weight:500;font-size:clamp(28px,3vw,44px);line-height:1.15;letter-spacing:-.02em;text-wrap:pretty}
.signoff{display:flex;flex-direction:column;gap:4px;font-size:12px;line-height:1.5;color:var(--grey)}
.signoff b{color:var(--black);font-weight:500}
/* contact */
.contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:48px clamp(32px,6vw,96px);align-items:start}
.contact h2{margin:0;font-weight:700;font-size:clamp(48px,6vw,96px);line-height:.95;letter-spacing:-.04em}
.contact__intro{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
form.enquiry{display:flex;flex-direction:column;gap:32px}
.field{display:flex;flex-direction:column;gap:10px}
.field input,.field textarea{border:1px solid var(--black);border-radius:0;padding:14px;font-family:inherit;font-size:16px;line-height:1.6;background:transparent;color:var(--black);outline:none;width:100%}
.field input{height:52px}
.field textarea{resize:vertical}
.field input:focus,.field textarea:focus{outline:1px solid var(--black)}
.hp{position:absolute;left:-9999px}
.notice{display:flex;flex-direction:column;gap:12px;border:1px solid var(--black);padding:28px}
/* footer */
.site-footer{padding:0 10vw 48px;display:flex;flex-direction:column;gap:32px}
.site-footer .row{border-top:1px solid var(--black);padding-top:32px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
/* generic pages */
.page-content{padding:clamp(80px,12vh,140px) 10vw;max-width:80ch}
.page-content h1{font-weight:700;font-size:clamp(40px,5vw,72px);line-height:.95;letter-spacing:-.04em;margin:0 0 40px}
.page-content p{font-size:16px;line-height:1.6}

.site-header nav{flex-wrap:nowrap;white-space:nowrap}
@media (max-width:600px){
 .site-header{padding:0 16px;gap:16px}
 .site-header img{height:28px}
 .site-header nav{gap:12px}
 .site-header nav .label{font-size:10px;letter-spacing:.15em}
}
.contact__links{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.socials{display:flex;gap:24px;flex-wrap:wrap}
