@import url('assets/fonts/fonts.css');
:root{--ink:#161514;--paper:#ebe9e5;--yellow:#ffff00;--coral:#ff4a4b;--amber:#ffb500;--sky:#8ccbff;--charcoal:#1e1e1e;--white:#ffffff;--black:#000000;--stone:#ddd8d4;--muted:#5e5b57;--line:#16151426;--serif:'Instrument Serif',Georgia,serif;--sans:'Manrope',Arial,sans-serif;--gutter:clamp(22px,4.2vw,72px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{margin:0;background:var(--paper);color:var(--ink);font:500 16px/1.65 var(--sans);-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0}h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;line-height:1.07}h3{font-weight:500;letter-spacing:-.02em;line-height:1.3}em{font-family:var(--serif);font-weight:400}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}a:focus-visible{outline:3px solid currentColor;outline-offset:6px}::selection{background:var(--yellow);color:var(--ink)}.container{max-width:1560px;padding-inline:var(--gutter);margin-inline:auto}.section{padding-block:clamp(76px,8vw,128px)}.eyebrow{font:600 12px/1.5 var(--sans);text-transform:uppercase;letter-spacing:.13em}.small{font-size:14px}.muted{color:var(--muted)}.skip-link{position:fixed;left:20px;top:-100px;z-index:20;background:var(--yellow);padding:10px 20px}.skip-link:focus{top:10px}
.header{padding:18px var(--gutter) 0}.nav-wrap{max-width:1560px;margin:auto;padding:12px 0 18px;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:clamp(28px,4vw,68px);border-bottom:1px solid var(--line)}.brand{width:152px}.brand img{width:100%;height:44px;object-fit:contain}.header nav{display:flex;gap:clamp(26px,3vw,48px);align-items:center;font-size:13px}.header nav a{display:grid;grid-template-columns:auto auto;align-items:baseline;gap:9px}.nav-index{font-size:10px;letter-spacing:.1em;color:var(--muted)}.header nav a:hover,.contact-email:hover,.footer a:hover{text-decoration:underline;text-underline-offset:5px}.button{display:inline-flex;align-items:center;justify-content:center;gap:26px;border-radius:200px;padding:15px 25px;font:500 15px/1.25 var(--sans);min-height:50px;transition:transform .2s,background .2s}.button span{font-size:19px;line-height:1}.button-dark{background:var(--ink);color:#fff}.button-yellow{background:var(--yellow);color:var(--ink)}.nav-cta{min-height:42px;padding:10px 17px;border-radius:3px;background:var(--yellow);color:var(--ink);font-size:13px;gap:18px}.button:hover{transform:translateY(-2px)}.text-link{display:inline-flex;align-items:center;gap:20px;font-size:14px;min-height:44px}.text-link:hover{text-decoration:underline;text-underline-offset:5px}
.hero{text-align:center;padding-top:80px;padding-bottom:74px}.hero h1{font-size:clamp(58px,7.7vw,116px);margin:21px auto 27px;max-width:1130px}.hero h1 em{position:relative}.hero-copy{font-size:18px;line-height:1.6;color:#4c4945}.hero-actions{display:flex;justify-content:center;align-items:center;gap:30px;margin-top:28px}.hero-footnote{font-size:12px;color:var(--muted);margin-top:25px;letter-spacing:.02em}.section-bar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:19px}.work-grid{display:grid;grid-template-columns:2.14fr 1fr;gap:16px}.project{position:relative;min-height:470px;overflow:hidden;border-radius:15px;color:white;background:#274e66}.project>img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center 48%;transition:transform .6s}.project:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0003,transparent 35%,#001723c9)}.project:hover>img{transform:scale(1.025)}.project-top,.project-bottom{position:absolute;left:34px;right:34px;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:1}.project-top{top:28px}.project-name{font-size:27px;letter-spacing:-.035em;font-weight:600}.project-tag{font-size:12px;border:1px solid #ffffff80;border-radius:200px;padding:5px 12px}.project-bottom{bottom:34px;align-items:end}.project-bottom h3{font:400 clamp(28px,3.1vw,46px)/1.08 var(--serif);margin-top:13px;letter-spacing:0}.project-arrow{display:grid;place-items:center;border-radius:50%;background:#fff;color:var(--ink);width:48px;height:48px;font-size:26px;flex-shrink:0}.purpose{background:var(--yellow);border-radius:15px;padding:32px;display:flex;flex-direction:column;justify-content:space-between;gap:35px}.purpose-title{font:400 clamp(42px,4.1vw,64px)/1.05 var(--serif);letter-spacing:-.02em}.purpose-rule{height:1px;background:#16151455;margin-bottom:22px}.purpose p:last-child{font-size:15px;line-height:1.65}.purpose .purpose-title{font-size:clamp(42px,4.1vw,64px);line-height:1.05}.project-caption{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:12px;font-size:13px;color:var(--muted)}
.approach-intro{max-width:1010px;margin:auto;text-align:center}.approach-intro h2{font-size:clamp(43px,5.1vw,74px);margin:25px 0}.approach-intro>p:last-child{max-width:675px;margin:auto;font-size:17px;color:var(--muted)}.principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px;margin-top:70px}.principles article{border-top:1px solid var(--line);padding-top:21px}.index{font-size:12px;letter-spacing:.08em;color:var(--muted)}.principles h3{font-size:25px;margin:32px 0 16px}.principles p{color:var(--muted);font-size:15px;max-width:37ch}.process{background:var(--stone)}.process-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,130px)}.process-intro h2{font-size:clamp(43px,4.8vw,68px);margin:24px 0}.process-intro>p:not(.eyebrow){max-width:350px;color:#514e4a}.process-intro .text-link{margin-top:23px;border-bottom:1px solid var(--ink)}.process-steps article{padding:29px 0;border-top:1px solid var(--line)}.process-steps article:first-child{padding-top:0;border:0}.process-steps article:last-child{padding-bottom:0}.process-steps h3{font-size:23px;margin:12px 0}.process-steps p{color:#514e4a;max-width:46ch;font-size:15px}.contact-wrap{padding-bottom:64px}.contact{padding:70px 24px;background:var(--ink);border-radius:15px;color:var(--paper);text-align:center}.contact .eyebrow{color:#c5c0b9}.contact h2{font-size:clamp(54px,6.8vw,98px);margin:25px 0}.contact>p:not(.eyebrow){color:#c5c0b9}.contact .button{margin:30px 0 18px}.contact-email{display:block;font-size:14px;width:fit-content;margin:auto;color:#c5c0b9}.footer{display:flex;gap:55px;align-items:center;padding-bottom:44px}.footer-logo{width:210px;height:65px;object-fit:contain}.footer>p{font-size:13px;line-height:1.6;color:var(--muted)}.footer-right{display:flex;align-items:flex-end;flex-direction:column;gap:12px;font-size:14px;margin-left:auto}.footer-right span{font-size:12px;color:var(--muted)}
@media(min-width:1700px){.hero{padding-top:100px;padding-bottom:90px}}
@media(max-width:1000px){.work-grid{grid-template-columns:1.7fr 1fr}.project{min-height:420px}.purpose{padding:25px}.principles{gap:25px}.process-grid{gap:50px}.hero{padding-top:65px}.hero h1{font-size:clamp(58px,8.2vw,90px)}}
@media(max-width:700px){.header{padding-top:10px}.nav-wrap{grid-template-columns:1fr auto;padding:8px 0 13px;gap:16px}.brand{width:126px}.brand img{height:38px}.header nav{display:none}.nav-cta{font-size:12px;padding:9px 13px;gap:11px;min-height:38px}.hero{padding-top:57px;padding-bottom:52px}.hero h1{font-size:clamp(47px,11vw,76px);margin-top:20px}.hero-copy{font-size:16px;max-width:31ch;margin:auto}.desktop-break{display:none}.hero-actions{gap:22px;flex-wrap:wrap}.hero-footnote{max-width:29ch;margin:23px auto 0;line-height:1.7}.section-bar{align-items:start}.section-bar .eyebrow{max-width:180px}.section-bar .small{font-size:12px;white-space:nowrap}.work-grid{grid-template-columns:1fr}.project{min-height:415px}.project-top,.project-bottom{left:23px;right:23px}.project-bottom h3{font-size:37px}.purpose{min-height:280px;padding:27px;display:grid;grid-template-columns:1fr 1fr;gap:20px}.purpose>.eyebrow{grid-column:1/-1}.purpose-title{align-self:end}.purpose>div{align-self:end}.purpose .purpose-title{font-size:46px}.purpose p:last-child{font-size:14px}.project-caption{align-items:start;gap:16px}.project-caption p{max-width:180px;font-size:12px}.project-caption .text-link{font-size:12px;white-space:nowrap;gap:8px;min-height:30px}.approach-intro{text-align:left}.approach-intro h2{font-size:44px}.approach-intro h2 br{display:none}.approach-intro>p:last-child{font-size:16px}.principles{grid-template-columns:1fr;gap:30px;margin-top:42px}.principles h3{margin:16px 0 12px}.principles p{max-width:100%;font-size:16px}.process-grid{grid-template-columns:1fr;gap:43px}.process-intro h2{font-size:46px}.process-steps p{font-size:16px}.contact{padding:54px 20px}.contact h2{font-size:clamp(43px,10.3vw,65px)}.contact>p:not(.eyebrow){font-size:15px}.footer{flex-wrap:wrap;gap:24px;align-items:start}.footer-logo{width:160px;height:50px}.footer>p{margin-left:auto;font-size:12px}.footer-right{width:100%;margin:0;border-top:1px solid var(--line);padding-top:21px;flex-direction:row;justify-content:space-between;align-items:center}}
@media(max-width:390px){.purpose{grid-template-columns:1fr}.purpose-title{font-size:48px}.hero-actions{gap:8px 20px}.project-caption{flex-direction:column;gap:3px}.project-caption p{max-width:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}.button:hover{transform:none}}


/* Insomne wordmark and tagline lockup. */
.footer-logo{width:260px;height:auto}
@media(max-width:700px){.footer-logo{width:210px;height:auto}}

/* Brand imagery, paired with the original yellow purpose panel. */
.creative-image{margin:0;min-width:0;overflow:hidden;border-radius:15px;min-height:470px}
.creative-image img{width:100%;height:100%;object-fit:cover;aspect-ratio:1.8;object-position:center}
@media(max-width:1000px){.creative-image{min-height:420px}}
@media(max-width:700px){.creative-image{min-height:0}.creative-image img{aspect-ratio:1.25}.creative-feature .purpose{min-height:280px}}

/* Web3Forms-ready enquiry section. */
.contact{padding:clamp(32px,5vw,72px);text-align:left;display:grid;grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr);gap:clamp(42px,7vw,110px);align-items:center}
.contact h2{font-size:clamp(50px,5.5vw,84px)}
.contact-intro>p:not(.eyebrow){max-width:38ch;color:#c5c0b9}
.contact .contact-email{margin:30px 0 0}
.contact-form{padding:clamp(25px,3.2vw,42px);background:var(--paper);border-radius:10px;color:var(--ink);display:grid;gap:25px}
.contact-form label{display:grid;gap:8px}
.contact-form label>span{font-size:11px;line-height:1.4;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:0;border-bottom:1px solid #16151459;border-radius:0;padding:7px 0 11px;background:transparent;color:var(--ink);font:500 16px/1.45 var(--sans);outline:0}
.contact-form select{appearance:none;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 12px) 15px,calc(100% - 7px) 15px;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:28px}
.contact-form textarea{resize:vertical;min-height:118px}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--ink);box-shadow:0 2px 0 var(--yellow)}
.contact .contact-form .form-submit{width:100%;margin:2px 0 0;border:0;cursor:pointer}
.botcheck{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
@media(max-width:1000px){.contact{grid-template-columns:1fr;gap:42px}.contact-intro{max-width:680px}}
@media(max-width:700px){.contact{padding:38px 20px;gap:34px}.contact h2{font-size:clamp(43px,10.3vw,65px)}.contact-form{padding:24px 20px;gap:22px}.form-row{grid-template-columns:1fr;gap:22px}}

/* Added services, using the existing Insomne type, spacing and colour system. */
.services{padding-top:8px;padding-bottom:clamp(76px,8vw,128px)}
.services-intro{max-width:1020px}
.services-intro h2{font-size:clamp(48px,5.3vw,76px);margin:22px 0;line-height:1.06}
.services-intro>p:last-child{max-width:620px;color:var(--muted);font-size:17px}
.services-list{border-top:1px solid var(--line);margin-top:60px}
.services-list article{display:grid;grid-template-columns:70px minmax(0,1fr) minmax(0,1fr);gap:28px;padding:31px 0;border-bottom:1px solid var(--line);align-items:start}
.services-list .index{margin-top:10px}
.services-list h3{font:400 clamp(33px,3.5vw,52px)/1.12 var(--serif);letter-spacing:-.025em}
.services-list p{max-width:43ch;color:var(--muted);font-size:15px}
@media(max-width:700px){.services{padding-top:0}.services-intro h2{font-size:clamp(43px,10vw,60px)}.services-intro h2 br{display:none}.services-intro>p:last-child{font-size:16px}.services-list{margin-top:42px}.services-list article{grid-template-columns:35px minmax(0,1fr);gap:8px 14px;padding:24px 0}.services-list .index{margin-top:6px}.services-list h3{font-size:34px}.services-list p{grid-column:2;font-size:15px}}