/* Header and artist introduction share one alignment and two type families. */
.site-header{width:calc(100% - 96px);max-width:1160px;margin:0 auto;padding:26px 0;display:flex;align-items:center;justify-content:space-between;gap:30px;border-bottom:1px solid var(--line)}.site-header nav{order:0;display:flex;gap:32px;font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.5}.site-header .socials{order:1;display:flex;gap:10px;align-items:center}.site-header .socials a{display:flex;align-items:center;justify-content:center;width:33px;height:33px;border-radius:50%;color:#e7d393;transition:transform .2s}.site-header .socials a[aria-label="X / Twitter"]{background:#717171}.site-header .socials svg{width:20px;height:20px}.site-header .socials a:hover{transform:translateY(-2px)}
.about-hero{width:calc(100% - 96px);max-width:1160px;margin:0 auto;padding:64px 0 76px;display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:80px;align-items:start}.about-copy{min-width:0}.about-title{font-family:'Playfair Display',Georgia,serif;font-size:clamp(66px,7vw,92px);font-weight:400;line-height:1.08;letter-spacing:-2.5px;margin:-8px 0 20px;color:var(--ink)}.about-identity{font-family:'DM Sans',sans-serif;font-size:21px;font-weight:400;line-height:1.5;margin:0 0 9px;color:var(--ink)}.about-identity span{color:var(--accent);padding:0 7px}.about-location{font-family:'DM Sans',sans-serif;font-size:16px;font-weight:400;line-height:1.6;margin:0;color:var(--muted)}.about-details{margin-top:30px;max-width:590px;font-family:'DM Sans',sans-serif;font-size:19px;font-weight:400;line-height:1.75;color:var(--ink)}.about-details>p{margin:0}.about-details .about-email{margin-top:24px;color:var(--accent);font:inherit;letter-spacing:normal;user-select:text}.about-email span{display:block;font:inherit}.about-email span:last-child{font-weight:500;overflow-wrap:anywhere}.about-photo{width:100%;aspect-ratio:7/8;overflow:hidden;background:#281f1a}.about-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 57%}
@media(max-width:1050px){.site-header,.about-hero{width:90%}.about-hero{grid-template-columns:minmax(0,1fr) 300px;gap:48px;padding:52px 0 64px}.about-title{font-size:70px;letter-spacing:-2px}.about-details{font-size:18px;line-height:1.7}.about-identity{font-size:20px}}
@media(max-width:760px){.site-header,.about-hero{width:88%}.site-header{padding:23px 0;gap:20px}.site-header nav{font-size:15px;gap:24px}.site-header .socials{gap:8px}.site-header .socials a{width:29px;height:29px}.site-header .socials svg{width:18px;height:18px}.about-hero{grid-template-columns:1fr;gap:32px;padding:40px 0 52px}.about-title{font-size:clamp(55px,11.6vw,78px);letter-spacing:-1.7px;margin:0 0 17px}.about-identity{font-size:19px;margin-bottom:8px}.about-location{font-size:15px}.about-details{margin-top:25px;font-size:18px;line-height:1.7;max-width:none}.about-details .about-email{margin-top:22px}.about-photo{max-width:none;aspect-ratio:1.45}.about-photo img{object-position:50% 52%}}
@media(max-width:370px){.site-header nav{gap:16px;font-size:14px}.site-header .socials{gap:6px}.site-header .socials a{width:26px;height:26px}.about-title{font-size:51px}.about-identity{font-size:18px}.about-identity span{padding:0 4px}}
@media(prefers-reduced-motion:reduce){.site-header .socials a{transition:none}}

/* Contact and footer follow the introduction's typography and alignment. */
#contact.contact{width:calc(100% - 96px);max-width:1160px;margin:64px auto 0;padding:64px 0 76px;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:80px;align-items:start}#contact .contact-intro h2{font-family:'Playfair Display',Georgia,serif;font-size:64px;font-weight:400;line-height:1.1;letter-spacing:-1.7px;margin:0 0 24px}#contact .contact-intro h2 span{font:inherit;color:var(--accent)}#contact .contact-intro>a{font-family:'DM Sans',sans-serif;font-size:19px;font-weight:400;line-height:1.75;color:var(--accent);overflow-wrap:anywhere}#contact label{font-family:'DM Sans',sans-serif;font-size:16px;font-weight:400;line-height:1.5;margin-bottom:25px}#contact label>span{font-size:14px;font-weight:400;color:var(--muted);margin-left:4px}#contact input,#contact textarea{font-family:'DM Sans',sans-serif;font-size:18px;line-height:1.6;padding:13px 15px;margin-top:10px;border:1px solid var(--line);background:#2b211c;color:var(--ink)}#contact textarea{min-height:180px}#contact .form-row{gap:22px}#contact .form-actions{gap:22px;align-items:center}#contact .form-actions button{font-size:16px;line-height:1.5;padding:12px 25px}#contact #form-status{font-size:14px;line-height:1.6;max-width:260px}.footer-block{display:flex;align-items:center;width:100%;max-width:none;min-height:116px;height:auto;padding:0;background:#281f1a;border-top:1px solid var(--line)}.footer-nav{width:calc(100% - 96px);max-width:1160px;margin:0 auto;display:flex;gap:32px;padding:35px 0;font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.5;color:var(--muted)}.footer-nav a:hover{color:var(--accent)}#about{scroll-margin-top:25px}
@media(max-width:1050px){#contact.contact,.footer-nav{width:90%}#contact.contact{gap:48px;padding:52px 0 64px}#contact .contact-intro h2{font-size:56px}#contact .contact-intro>a{font-size:18px}}
@media(max-width:760px){#contact.contact,.footer-nav{width:88%}#contact.contact{grid-template-columns:1fr;margin-top:40px;padding:40px 0 52px;gap:32px}#contact .contact-intro h2{font-size:48px;margin-bottom:17px}#contact .contact-intro>a{font-size:18px}#contact label{font-size:16px}#contact label>span{font-size:13px}#contact .form-row{gap:18px}#contact input,#contact textarea{font-size:16px;padding:12px}#contact #form-status{font-size:13px}#contact .form-actions{gap:18px}.footer-block{min-height:105px}.footer-nav{gap:28px;font-size:15px;padding:32px 0}}
@media(max-width:420px){#contact .form-row{grid-template-columns:1fr;gap:0}#contact .form-actions{align-items:flex-start}#contact .form-actions button{flex-shrink:0}}

/* Footer and return control use the same quiet navigation language. */
.footer-nav{justify-content:center;text-align:center}#back-to-top{right:24px;bottom:24px;display:flex;align-items:center;justify-content:center;gap:15px;border:1px solid var(--ink);border-radius:0;background:var(--ink);color:var(--bg);padding:13px 19px;font-family:'DM Sans',sans-serif;font-size:15px;line-height:1.5;box-shadow:none}#back-to-top[hidden]{display:none}#back-to-top .top-label{font:inherit}#back-to-top svg{display:block;width:21px;height:21px;flex-shrink:0}#back-to-top:hover{background:var(--accent);border-color:var(--accent)}.portfolio-group,.art-layout{display:contents}
/* Headings flow above the existing artwork compositions on small screens. */
@media(max-width:760px){.portfolio{width:88%;max-width:none}.portfolio .sheet{aspect-ratio:auto;position:static}.portfolio-group{display:block;margin:0 0 46px}.portfolio-group:last-child{margin-bottom:0}.portfolio .section-title{position:static;width:auto;margin:0;font-family:'Playfair Display',Georgia,serif;font-size:32px;line-height:1.2;font-weight:400;letter-spacing:-.5px;text-align:left}.portfolio .project-title{position:static;width:auto;margin:14px 0 0;padding:0;font-family:'DM Sans',sans-serif;font-size:18px;line-height:1.5;font-weight:400;text-align:left;color:var(--muted)}.portfolio-group>h3:first-child{margin-top:0}.art-layout{display:block;position:relative;width:100%;aspect-ratio:260/var(--extent);margin-top:22px}.art-layout .artwork{position:absolute;left:calc(var(--x)/260 * 100%);top:calc((var(--y) - var(--origin))/var(--extent) * 100%);width:calc(var(--w)/260 * 100%);height:calc(var(--h)/var(--extent) * 100%)}#back-to-top{right:15px;bottom:18px;width:48px;height:48px;padding:12px;border-radius:50%;gap:0}#back-to-top .top-label{display:none}#back-to-top svg{width:23px;height:23px}}
@media(max-width:370px){.portfolio .section-title{font-size:29px}.portfolio .project-title{font-size:17px}}

/* On phones the portrait accompanies the identity instead of becoming a banner. */
@media(max-width:760px){.about-hero{grid-template-columns:minmax(0,1fr) 88px;column-gap:20px;row-gap:0}.about-copy{display:contents}.about-title{grid-column:1/-1;grid-row:1;margin-bottom:22px}.about-identity{grid-column:1;grid-row:2;align-self:end;margin-bottom:9px;font-size:18px;line-height:1.5}.about-identity span{padding:0 4px}.about-location{grid-column:1;grid-row:3;align-self:start;font-size:14px;line-height:1.6}.about-details{grid-column:1/-1;grid-row:4;margin-top:26px}.about-photo{grid-column:2;grid-row:2/4;align-self:center;width:88px;height:100px;aspect-ratio:auto}.about-photo img{object-position:50% 56%}}