:root {
  --black: #090909;
  --black-soft: #151515;
  --paper: #f3f2ee;
  --white: #ffffff;
  --cyan: #16c9f3;
  --magenta: #eb0a91;
  --green: #21dc42;
  --ink-muted: #666663;
  --line: rgba(9, 9, 9, 0.18);
  --line-light: rgba(255, 255, 255, 0.22);
  --display: "Chivo", sans-serif;
  --mono: "Spline Sans Mono", monospace;
  --container: min(92vw, 1380px);
}

* { box-sizing: border-box; }
html { overflow-x:clip; scroll-behavior:smooth; scroll-padding-top:76px; }
body { margin:0; overflow-x:clip; background:var(--paper); color:var(--black); font:400 1rem/1.55 var(--display); }
body.menu-open { overflow: hidden; }
img { display: block; width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
.container { width: var(--container); margin-inline: auto; }
.section { position: relative; padding: clamp(5.5rem, 10vw, 9rem) 0; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 999; left: 1rem; top: 1rem; transform: translateY(-200%); padding: .8rem 1rem; background: var(--green); color: var(--black); font-weight: 700; }
.skip-link:focus { transform: none; }

.site-header { position: fixed; z-index: 50; inset: 0 0 auto; height: 78px; padding: 0 4vw; display: grid; grid-template-columns: 150px 1fr auto; align-items: center; gap: 2rem; color: var(--white); background-color:var(--black); background-image:linear-gradient(rgba(5,5,5,.68),rgba(5,5,5,.76)),url("assets/contact-brick-wall.webp"); background-position:center,center top; background-size:auto,612px auto; background-repeat:repeat,repeat; border-bottom: 1px solid var(--line-light); transition: height .25s, background-color .25s; }
.site-header.scrolled { height:68px; background-color:rgba(9,9,9,.97); }
.brand { display: block; width: 112px; }
.brand img { width: 100%; height: 62px; object-fit: contain; object-position: left center; }
.site-nav { justify-self: center; display: flex; gap: clamp(1.2rem, 2.4vw, 2.8rem); }
.site-nav a { position: relative; padding-block: .5rem; font: 500 .72rem/1 var(--mono); text-transform: uppercase; letter-spacing: .03em; }
.site-nav a::before { content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 3px; background: var(--cyan); transition: right .25s; }
.site-nav a:nth-child(2n)::before { background: var(--magenta); }
.site-nav a:hover::before, .site-nav a.active::before { right: 0; }
.header-cta { padding: .85rem 1.25rem .75rem; background: var(--white); color: var(--black); border-bottom: 5px solid var(--cyan); font: 600 .72rem/1 var(--mono); text-transform: uppercase; transition: background .2s; }
.header-cta:hover { background: var(--cyan); }
.menu-toggle { display: none; background: transparent; border: 0; padding: .5rem; }
.menu-toggle > span:not(.sr-only) { display: block; width: 27px; height: 2px; margin: 6px 0; background: currentColor; transition: transform .25s; }

.hero { min-height: 100svh; position: relative; display: flex; align-items: stretch; overflow: hidden; background: var(--black); color: var(--white); }
.hero::before { content: none; }
.hero-media { position:absolute; inset:0 0 0 31%; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 29%,#000 100%); mask-image:linear-gradient(90deg,transparent 0%,#000 29%,#000 100%); }
.hero-media img { height: 100%; object-fit: cover; filter: saturate(.78) contrast(1.1); animation: imageIn 1.2s cubic-bezier(.2,.7,.2,1) both; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,9,9,.92) 0%,rgba(9,9,9,.58) 36%,rgba(9,9,9,.08) 100%),linear-gradient(0deg,rgba(9,9,9,.68),transparent 52%); }
.hero-content { position: relative; z-index: 2; display: flex; justify-content: flex-start; align-items: center; padding: 118px 0 7rem; }
.hero-statement { width:min(45vw,760px); padding:0; color:var(--white); }
.eyebrow { margin:0 0 2.2rem; color:var(--magenta); font:600 clamp(.76rem,.82vw,.88rem)/1 var(--mono); text-transform:uppercase; letter-spacing:.08em; }
.hero h1 { margin:0; font:800 clamp(4rem,6.2vw,7.4rem)/.88 var(--display); letter-spacing:-.065em; }
.hero h1 em { color: var(--white); font-style: normal; text-decoration: underline; text-decoration-color: var(--green); text-decoration-thickness: .1em; text-underline-offset: .1em; }
.hero-statement > p:not(.eyebrow) { max-width:480px; margin:2.3rem 0; color:rgba(255,255,255,.76); font-size:clamp(1.08rem,1.4vw,1.32rem); }
.button { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 260px; min-height: 52px; padding: .95rem 1.35rem; border: 0; font: 600 .74rem/1 var(--mono); text-transform: uppercase; cursor: pointer; isolation: isolate; overflow: hidden; }
.button::before { content: ""; position: absolute; z-index: -1; inset: 0; transform-origin: left; transition: transform .25s; }
.button-primary { color: var(--black); background: transparent; border: 2px solid var(--black); }
.button-primary::before { background: var(--green); }
.button-primary:hover::before { transform: scaleX(.08); }
.hero .button-primary { min-width:320px; min-height:58px; border-color:var(--white); font-size:.79rem; }
.hero .button-primary:hover { color:var(--white); }
.hero-index { position: absolute; z-index: 3; left: 4.8vw; right: 8vw; bottom: 2rem; display: flex; justify-content: space-between; font: 500 .64rem/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.66); }

.section-kicker { --marker:var(--magenta); position:relative; display:inline-flex; align-items:center; min-height:1.25rem; padding-left:1.65rem; font:600 .69rem/1 var(--mono); text-transform:uppercase; letter-spacing:.13em; }
.section-kicker::before,.section-kicker::after { content:""; position:absolute; width:10px; height:10px; border-color:var(--marker); }
.section-kicker::before { left:0; top:0; border-top:2px solid var(--marker); border-left:2px solid var(--marker); }
.section-kicker::after { left:7px; bottom:0; border-right:2px solid var(--marker); border-bottom:2px solid var(--marker); }
.section-kicker.light { color:var(--white); }
.display-title { margin: 0; font: 800 clamp(3rem, 6.3vw, 6.9rem)/.91 var(--display); letter-spacing: -.07em; }
.display-title em { font-style: normal; }

.intro { background: var(--paper); }
.intro-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(3rem,8vw,9rem); padding-top: clamp(3rem,6vw,6rem); }
.intro .display-title em { color: var(--magenta); }
.intro-copy { align-self: end; max-width: 580px; border-left: 9px solid var(--cyan); padding-left: clamp(1.5rem,3vw,3rem); }
.lead { font-size: clamp(1.3rem,2vw,1.9rem); line-height: 1.28; letter-spacing: -.035em; }
.intro-copy > p:last-child { color: var(--ink-muted); }
.principles { margin-top: clamp(5rem,8vw,8rem); display: grid; grid-template-columns: repeat(4,1fr); border: 2px solid var(--black); background: var(--white); }
.principle-item { min-height: 190px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 1.35rem; padding: 1.5rem; border-right: 2px solid var(--black); transition: background .25s,color .25s; }
.principle-item:last-child { border-right: 0; }
.principle-item > span { font: 600 .78rem/1 var(--mono); text-transform: uppercase; letter-spacing: .03em; }
.principle-icon { width: 54px; height: 54px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s; }
.principle-item:nth-child(1) .principle-icon { color: var(--cyan); }
.principle-item:nth-child(2) .principle-icon { color: var(--magenta); }
.principle-item:nth-child(3) .principle-icon { color: var(--green); }
.principle-item:nth-child(4) .principle-icon { color: var(--black); }

.services { background-color:var(--black); background-image:linear-gradient(rgba(5,5,5,.76),rgba(5,5,5,.82)),url("assets/contact-brick-wall.webp"); background-position:center,center top; background-size:auto,612px auto; background-repeat:repeat,repeat; color:var(--white); }
.services-watermark { position:absolute; z-index:0; top:.75rem; right:3vw; width:min(36vw,520px); height:auto; opacity:.055; filter:brightness(0) invert(1); pointer-events:none; user-select:none; }
.services>.container { position:relative; z-index:1; }
.services .section-kicker { --marker:var(--cyan); }
.services .section-heading,.projects .section-heading { display: grid; grid-template-columns: 1fr .8fr; gap: 2rem; align-items: end; padding: clamp(3rem,6vw,6rem) 0; }
.services .display-title em { color: var(--cyan); }
.section-heading > p { justify-self: end; max-width: 360px; margin: 0; color: #a0a09b; }
.service-list { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line-light); border-left: 1px solid var(--line-light); }
.service-item { position: relative; min-height: 330px; display: flex; flex-direction: column; align-items: flex-start; padding: 1.5rem; border-right: 1px solid var(--line-light); border-bottom: 1px solid var(--line-light); overflow: hidden; transition: color .25s,background .25s; }
.service-item::before { content: ""; position: absolute; inset: auto 0 0; height: 8px; background: var(--cyan); transition: height .25s; }
.service-item:nth-child(2n)::before { background: var(--magenta); }
.service-item:nth-child(3n)::before { background: var(--green); }
.service-item:hover { color: var(--black); background: var(--paper); }
.service-item:hover::before { height: 15px; }
.service-number { font: 500 .68rem/1 var(--mono); color: var(--cyan); }
.service-item:nth-child(2n) .service-number { color: var(--magenta); }
.service-item:nth-child(3n) .service-number { color: var(--green); }
.service-item h3 { margin: auto 0 1.3rem; max-width: 300px; font: 700 clamp(1.5rem,2.3vw,2.35rem)/1 var(--display); letter-spacing: -.05em; }
.service-item p { margin: 0 0 1.5rem; color: #a5a5a1; font-size: .92rem; }
.service-item:hover p { color: #4f4f4c; }
.service-mark { display: none; }

.experience { padding: 0; display: grid; grid-template-columns: 1.05fr .95fr; background: var(--cyan); color: var(--black); }
.experience-media,.experience-panel { min-width:0; }
.experience-media { min-height: 880px; overflow: hidden; }
.experience-media img { height: 100%; object-fit: cover; filter: saturate(.72) contrast(1.08); }
.experience-panel { padding: clamp(5rem,7vw,8rem) clamp(2rem,6vw,6rem); display: flex; flex-direction: column; justify-content: center; }
.experience .section-kicker.light { --marker:var(--magenta); color:var(--black); }
.experience-panel .display-title { margin-top: 4rem; font-size: clamp(3rem,5vw,5.8rem); }
.experience-panel .display-title em { color: var(--magenta); }
.experience-panel .lead { margin: 3rem 0 1.5rem; }
.experience-tags { font: 500 .78rem/1.8 var(--mono); text-transform: uppercase; }
.process { margin: 4rem 0 0; padding: 0 10px 10px 0; list-style: none; display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.process li { min-height: 150px; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto 1fr; gap: 1rem; padding: 1rem; background: rgba(243,242,238,.96); border: 2px solid var(--black); box-shadow: 9px 9px 0 var(--magenta); transition: transform .22s,box-shadow .22s,background .22s; }
.process-number { font: 600 .68rem/1 var(--mono); color: var(--magenta); }
.process-icon { grid-column: 2; grid-row: 1 / 3; align-self: start; display: grid; place-items: center; width: 46px; height: 46px; background: var(--black); color: var(--cyan); }
.process li:nth-child(2n) .process-icon { color: var(--green); }
.process-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.process strong { align-self: end; font: 700 .76rem/1 var(--mono); text-transform: uppercase; }

@media (hover:hover) and (pointer:fine) {
  .principle-item:hover { background:var(--black); color:var(--white); }
  .principle-item:hover .principle-icon { transform:translateY(-4px); }
  .principle-item:nth-child(4):hover .principle-icon { color:var(--white); }
  .process li:hover { transform:translate(-3px,-3px); box-shadow:12px 12px 0 var(--magenta); background:var(--white); }
}

.projects { padding-bottom: clamp(5rem,7vw,7rem); background: var(--paper); }
.projects .section-kicker { --marker:var(--cyan); }
.projects .display-title em { color: var(--magenta); }
.project-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 1.2rem; }
.project-card { position: relative; padding: .7rem; border: 2px solid var(--black); background: var(--paper); }
.project-card-wide { grid-row: span 2; }
.project-image { height: 100%; min-height: 360px; overflow: hidden; background: #d8d8d3; }
.project-card-wide .project-image { min-height: 760px; }
.project-image img { height: 100%; object-fit: cover; filter: saturate(.77) contrast(1.04); transition: transform .7s cubic-bezier(.2,.7,.2,1),filter .25s; }
.project-card:hover .project-image img { transform: scale(1.025); filter: saturate(1); }
.project-meta { position: absolute; inset: auto 1.4rem 1.4rem; display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; padding: 1rem 1.1rem; background: var(--paper); color: var(--black); border-top: 6px solid var(--cyan); }
.project-card:nth-child(2) .project-meta { border-color: var(--magenta); }
.project-card:nth-child(3) .project-meta { border-color: var(--green); }
.project-meta span:first-child,.project-code { font: 500 .62rem/1 var(--mono); text-transform: uppercase; color: #6a6a65; }
.project-meta h3 { margin: .3rem 0 0; font: 700 clamp(1.2rem,2vw,1.65rem)/1.1 var(--display); letter-spacing: -.04em; }
.project-code { white-space: nowrap; }
.projects-note { width: min(78%,900px); min-height: 112px; margin: 3.5rem auto 0; padding: 1.35rem 1.5rem 1.35rem 2.5rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; border-left: 12px solid var(--magenta); background: var(--white); font-size: 1.08rem; font-weight: 700; }
.projects-note p { max-width: 470px; margin: 0; }
.projects-note-button { flex: 0 0 auto; min-width: 220px; }

.contact { background-color:var(--black); background-image:linear-gradient(90deg,rgba(5,5,5,.36),rgba(5,5,5,.5)),url("assets/contact-brick-wall.webp"); background-position:center; background-size:cover; color:var(--white); }
.contact .section-kicker.light { --marker:var(--magenta); color:var(--white); }
.contact-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(3rem,8vw,9rem); padding-top: clamp(4rem,7vw,7rem); }
.contact-copy .display-title { font-size: clamp(3rem,5.1vw,6rem); }
.contact-copy .display-title em { color: var(--magenta); }
.contact-copy > p { max-width: 500px; margin: 2.5rem 0; color: rgba(255,255,255,.72); font-size: 1.1rem; }
.whatsapp-link { display: inline-flex; align-items: center; gap: .85rem; padding: 1rem 1.25rem; border: 2px solid var(--white); background: var(--green); color: var(--black); font: 700 .76rem/1 var(--mono); text-transform: uppercase; box-shadow: 7px 7px 0 var(--magenta); transition: transform .2s ease, box-shadow .2s ease; }
.whatsapp-link:hover { transform: translate(3px,3px); box-shadow: 4px 4px 0 var(--magenta); }
.whatsapp-link svg { width: 22px; height: 22px; fill: currentColor; }
.contact-form { align-self: end; display: grid; gap: 1.45rem; padding: clamp(1.5rem,3vw,3rem); background: var(--paper); color: var(--black); box-shadow: 18px 18px 0 var(--magenta); }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.contact-form label { display: grid; gap: .55rem; }
.contact-form label > span { font: 600 .65rem/1 var(--mono); text-transform: uppercase; color: #575757; }
.contact-form input,.contact-form select,.contact-form textarea { width: 100%; padding: .55rem 0 .75rem; border: 0; border-bottom: 1px solid #888; border-radius: 0; outline: 0; background: transparent; color: var(--black); resize: vertical; }
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color: var(--magenta); }
.contact-form select { appearance: none; }
.contact-form option { color: var(--black); }
.contact-form .button-primary { width: 100%; margin-top: .4rem; border-color: var(--black); color: var(--black); }
.contact-form .button-primary::before { background: var(--green); }
.form-note { margin: -.6rem 0 0; font: 400 .68rem/1.4 var(--mono); color: #666; }

.site-footer { position: relative; padding: 3rem 0 1.25rem; overflow: hidden; border-top: 1px solid var(--black); background: var(--paper); color: var(--black); }
.footer-grid { display: grid; grid-template-columns: 150px 1fr auto; gap: clamp(2rem,5vw,5rem); align-items: center; }
.brand-large { width: 135px; }
.brand-large img { height: auto; filter: brightness(0) saturate(100%); }
.footer-copy p { margin: 0 0 .3rem; color: var(--magenta); font-weight: 700; }
.footer-copy span { color: #555550; font-size: .86rem; }
.footer-links { display: flex; align-items: center; gap: clamp(1.2rem,2.5vw,2.5rem); font: 600 .9rem/1 var(--mono); text-transform: uppercase; }
.footer-links a { border-bottom: 2px solid transparent; padding: .55rem 0; }
.footer-links a:nth-child(1):hover { border-color: var(--magenta); }
.footer-links a:nth-child(2):hover { border-color: var(--green); }
.footer-links a:nth-child(3):hover { border-color: var(--cyan); }
.footer-bottom { margin-top: 2rem; padding: 1rem 5rem 0 0; border-top: 1px solid rgba(9,9,9,.22); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem; color: #5f5f5a; font: 500 .64rem/1 var(--mono); text-transform: uppercase; }
.footer-legal { display: flex; gap: 2rem; }
.footer-credit { margin: 0; color: #666; text-transform: none; }
.footer-credit span { color: var(--black); }
.footer-bottom > a { justify-self: end; }
.footer-bottom a:hover { color: var(--magenta); }
.floating-whatsapp { position: fixed; z-index: 45; right: 1.2rem; bottom: 1.2rem; display: grid; place-items: center; width: 54px; height: 54px; background: var(--green); border: 2px solid var(--black); box-shadow: 6px 6px 0 rgba(9,9,9,.25); transition: transform .2s,box-shadow .2s; }
.floating-whatsapp:hover { transform: translate(-2px,-2px); box-shadow: 8px 8px 0 rgba(9,9,9,.25); }
.floating-whatsapp svg { width: 24px; fill: var(--black); }

.reveal { opacity:0; transform:translate3d(0,22px,0); transition:opacity .75s cubic-bezier(.22,.61,.36,1),transform .85s cubic-bezier(.22,.61,.36,1); transition-delay:var(--reveal-delay,0s); will-change:opacity,transform; }
.reveal-left { transform:translate3d(-28px,0,0); }
.reveal-right { transform:translate3d(28px,0,0); }
.reveal.visible { opacity: 1; transform: none; }
.service-item:nth-child(2),.project-card:nth-child(2) { --reveal-delay:.06s; }
.service-item:nth-child(3),.project-card:nth-child(3) { --reveal-delay:.11s; }
.service-item:nth-child(4) { --reveal-delay:.05s; }
.service-item:nth-child(5) { --reveal-delay:.1s; }
.service-item:nth-child(6) { --reveal-delay:.15s; }
@keyframes imageIn { from { opacity:.2; transform:scale(1.04); } to { opacity:1; transform:scale(1); } }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none} }

@media (max-width:1040px) {
  .site-header { grid-template-columns:130px 1fr auto; }
  .site-nav { gap:1.1rem; }
  .service-list { grid-template-columns:repeat(2,1fr); }
  .experience { grid-template-columns:1fr; }
  .experience-media { min-height:68svh; }
  .project-grid { grid-template-columns:1fr 1fr; }
  .project-card-wide { grid-row:auto; grid-column:1/-1; }
  .project-card-wide .project-image { min-height:620px; }
  .contact-grid { grid-template-columns:1fr; }
}

@media (max-width:840px) {
  .site-header { grid-template-columns:1fr auto; }
  .header-cta { display:none; }
  .brand { width:94px; }
  .menu-toggle { display:block; justify-self:end; position:relative; z-index:3; }
  .site-nav { position:fixed; inset:0; width:100vw; max-width:none; padding:16vh 8vw; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:1rem; background-color:var(--black); background-image:linear-gradient(rgba(5,5,5,.7),rgba(5,5,5,.8)),url("assets/contact-brick-wall.webp"); background-position:center,center top; background-size:auto,612px auto; background-repeat:repeat,repeat; transform:translateX(100vw); transition:transform .35s cubic-bezier(.2,.7,.2,1); }
  .site-nav::before { content:""; position:absolute; inset:0 auto 0 0; width:12px; background:linear-gradient(var(--magenta) 0 34%,var(--cyan) 34% 69%,var(--green) 69%); }
  .site-nav.open { transform:none; }
  .site-nav a { font:700 clamp(2rem,8vw,4rem)/1 var(--display); letter-spacing:-.05em; text-transform:none; }
  .menu-toggle[aria-expanded="true"] span:not(.sr-only):nth-child(2) { transform:translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:not(.sr-only):nth-child(3) { transform:translateY(-4px) rotate(-45deg); }
  .hero-media { inset:0; -webkit-mask-image:none; mask-image:none; }
  .hero-overlay { background:linear-gradient(90deg,rgba(9,9,9,.97),rgba(9,9,9,.32)),linear-gradient(0deg,rgba(9,9,9,.78),rgba(9,9,9,.08)); }
  .hero-content { align-items:center; padding:110px 0 7rem; }
  .hero-statement { justify-self:start; width:min(78%,650px); }
  .hero h1 { font-size:clamp(3rem,10vw,5.3rem); }
  .intro-grid { grid-template-columns:1fr; }
  .projects .section-heading,.services .section-heading { grid-template-columns:1fr; }
  .section-heading>p { justify-self:start; }
}

@media (max-width:620px) {
  :root { --container:88vw; }
  .section { padding-block:5rem; }
  .experience { padding-block:0; }
  .contact { background-position:top center; background-size:auto 520px; background-repeat:repeat-y; }
  .hero-content { padding-top:100px; }
  .hero-statement { width:100%; display:flex; flex-direction:column; align-items:center; text-align:center; }
  .hero h1 { font-size:clamp(2.8rem,13vw,4.2rem); }
  .hero-statement>p:not(.eyebrow) { margin:1.4rem auto; }
  .hero-index { display:none; }
  .button { width:100%; min-width:0; }
  .principles { grid-template-columns:1fr 1fr; }
  .principle-item { min-height:155px; }
  .principle-item:nth-child(2) { border-right:0; }
  .principle-item:nth-child(-n+2) { border-bottom:2px solid var(--black); }
  .service-list { grid-template-columns:1fr; }
  .services-watermark { top:2.25rem; right:0; width:min(76vw,360px); opacity:.05; }
  .service-item { min-height:280px; }
  .experience-media { min-height:55svh; }
  .experience-panel { padding:5rem 6vw; }
  .process { grid-template-columns:repeat(2,1fr); }
  .process li { min-height:140px; box-shadow:7px 7px 0 var(--magenta); }
  .project-grid { grid-template-columns:1fr; }
  .project-card-wide { grid-column:auto; }
  .project-card-wide .project-image,.project-image { min-height:490px; }
  .projects-note { width:100%; min-height:78px; padding:1.3rem; flex-direction:column; align-items:stretch; gap:1.2rem; text-align:center; font-size:.95rem; }
  .projects-note p { max-width:none; }
  .field-row { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:100px 1fr; gap:1.5rem; align-items:center; }
  .brand-large { width:100px; }
  .footer-links { grid-column:1/-1; justify-content:space-between; padding-top:.75rem; border-top:1px solid rgba(9,9,9,.22); font-size:.78rem; }
  .footer-copy span { font-size:.75rem; }
  .contact-form { box-shadow:10px 10px 0 var(--magenta); }
  .footer-bottom { grid-template-columns:1fr auto; gap:.8rem; padding-right:4rem; }
  .footer-legal { gap:1rem; }
  .footer-credit { grid-column:1/-1; grid-row:2; }
  .footer-bottom>a { grid-column:2; grid-row:1; }
}

@media (max-width:380px) {
  .display-title { font-size:2.7rem; }
  .hero h1 { font-size:2.65rem; }
}