:root{--font-sans:'DM Sans',sans-serif;--font-serif:'DM Serif Display',serif}
/* Force text presentation so mobile browsers never substitute colorful emoji glyphs. */
.circle-link,.text-link span,.project>a,.service-list b,.contact-bottom>a span,.nav-cta span,.page-cta a span{font-family:Arial,Helvetica,sans-serif!important;font-variant-emoji:text;font-style:normal}
.eyebrow:before{display:none!important}
.work-all-link{display:inline-block;margin-top:42px;padding-bottom:8px;border-bottom:1px solid #fff;text-transform:uppercase;font-size:11px;letter-spacing:.12em}.work-archive{padding:100px 5vw 140px;background:var(--ink);color:#fff}.work-case{display:grid;grid-template-columns:1.2fr .8fr;min-height:520px;margin-bottom:28px;background:#251f1c}.work-case>img{width:100%;height:100%;min-height:520px;object-fit:cover}.work-case>div{display:flex;flex-direction:column;justify-content:center;padding:7vw}.work-case h2{font-size:clamp(38px,5vw,76px);line-height:.92;letter-spacing:-.06em;text-transform:uppercase;margin:30px 0}.work-case p{line-height:1.75;color:#c7bfba}.work-case a{width:max-content;margin-top:30px;border-bottom:1px solid;padding-bottom:7px;text-transform:uppercase;font-size:10px;letter-spacing:.12em}.work-franklin>div{background:#34220f}.work-bridges>div{background:#243326}.work-blurae>div{background:#352536}.work-scotland>div{background:#214456}@media(max-width:850px){.work-case{grid-template-columns:1fr}.work-case>img{min-height:360px}.work-case>div{padding:60px 24px}}

:root { --ink: #151515; --cream: #f3eee7; --acid: #f7c9b2; --orange: #f52227; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--cream); color: var(--ink); font-family: var(--font-sans), sans-serif; }
a { color: inherit; text-decoration: none; }
.site-header { position: fixed; z-index: 100; inset: 0 0 auto; height: 84px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 4vw; color: white; border-bottom: 1px solid #ffffff30; background:#151515d9; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.brand { display: flex; align-items: center; width: max-content; }
.animated-brand { gap:0; overflow:visible; }
.animated-k { width:44px; height:46px; object-fit:contain; position:relative; z-index:2; margin-top:-2px; animation:kSpring 1s cubic-bezier(.2,.9,.25,1.2) both; }
.animated-word { display:flex; align-items:center; overflow:hidden; margin-left:-14px; padding:9px 4px 9px 0; position:relative; z-index:1; }
.animated-word i { font-style:normal; font-size:23px; line-height:1; font-weight:800; letter-spacing:-.07em; color:white; transform:translateX(-160%) translateY(10px); opacity:0; animation:letterOut .72s cubic-bezier(.2,.8,.2,1.25) forwards; animation-delay:calc(.28s + (var(--letter) * .055s)); }
.animated-word .signature-a { width:16px; height:23px; margin:0 -1px 0 0; flex:0 0 16px; position:relative; background:none; }
.animated-word .signature-a::before,.animated-word .signature-a::after { content:""; position:absolute; bottom:0; width:4px; height:23px; border-radius:1px; background:currentColor; transform-origin:bottom center; }
.animated-word .signature-a::before { left:2px; transform:skew(20deg); }
.animated-word .signature-a::after { right:2px; transform:skew(-20deg); }
.animated-word .connected-up { color:#ef2424; }
.animated-word .connected-u { margin-right:-.18em; }
@keyframes kSpring { 0%{transform:scale(.75) rotate(-8deg);opacity:0} 70%{transform:scale(1.06) rotate(1deg)} 100%{transform:none;opacity:1} }
@keyframes letterOut { 0%{transform:translateX(-160%) translateY(10px);opacity:0} 70%{transform:translateX(4px) translateY(-2px);opacity:1} 100%{transform:none;opacity:1} }
nav { display: flex; gap: 34px; font-size: 13px; }
nav a { transition: opacity .2s; } nav a:hover { opacity: .6; }
.header-cta { justify-self: end; display: flex; gap: 42px; align-items: center; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; border: 1px solid #ffffff88; padding: 13px 15px 13px 19px; }
.header-cta span { font-size: 18px; }
.hero { min-height: 780px; height: 100svh; position: relative; overflow: hidden; color: white; background: #222; }
.hero-image { position: absolute; inset: 0; background: url('katch-up-original-hero.png') center 42% / cover; transform: scale(1.02); }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, #000b 0%, #0004 60%, #0005), linear-gradient(0deg, #0009 0%, transparent 45%); }
.hero-content { position: absolute; z-index: 2; left: 4vw; right: 8vw; top: 50%; transform: translateY(-38%); }
.eyebrow, .section-label { font-size: 11px; text-transform: uppercase; letter-spacing: .16em; font-weight: 700; }
.eyebrow { display: flex; align-items: center; gap: 9px; }
.eyebrow span { width: 8px; height: 8px; background: var(--acid); border-radius: 50%; }
h1 { font-size: clamp(80px, 11vw, 166px); line-height: .76; letter-spacing: -.075em; margin: 43px 0 0; font-weight: 800; text-transform: uppercase; }
h1 em, h2 em, .statement em { font-family: var(--font-serif); font-weight: 400; text-transform: none; }
h1 em { color: var(--acid); }
.hero-bottom { display: flex; justify-content: flex-end; align-items: center; gap: 9vw; margin-top: 55px; }
.hero-bottom p { width: 370px; line-height: 1.7; font-size: 14px; margin: 0; }
.circle-link { width: 74px; height: 74px; border: 1px solid #ffffff99; border-radius: 50%; display: grid; place-items: center; font-size: 25px; transition: .25s; }
.circle-link:hover { color: white; background: var(--orange); border-color: var(--orange); }
.side-note { position: absolute; right: 1.6vw; top: 50%; z-index: 2; writing-mode: vertical-rl; text-transform: uppercase; font-size: 9px; letter-spacing: .18em; opacity: .7; }
.marquee { background: var(--acid); color: #2b1713; overflow: hidden; white-space: nowrap; padding: 20px 0; font-size: clamp(18px, 2.5vw, 38px); font-weight: 800; letter-spacing: -.04em; }
.marquee div { width: max-content; animation: crawl 24s linear infinite; }
.marquee i { font-family: serif; font-style: normal; margin: 0 28px; }
@keyframes crawl { to { transform: translateX(-25%); } }
.intro { display: grid; grid-template-columns: 1fr 2.25fr; gap: 30px; padding: 150px 7vw 170px; }
.section-label { margin: 12px 0; }
.intro h2, .services h2, .contact h2 { font-size: clamp(52px, 7vw, 108px); letter-spacing: -.07em; line-height: .9; margin: 0; text-transform: uppercase; }
.intro h2 em, .services h2 em { color: var(--orange); }
.intro > div > p { max-width: 660px; margin: 55px 0 40px; font-size: 18px; line-height: 1.75; }
.text-link { display: inline-flex; gap: 60px; align-items: center; padding-bottom: 9px; border-bottom: 1px solid; text-transform: uppercase; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.work { background: var(--ink); padding: 110px 4vw 130px; color: white; }
.section-head { display: flex; justify-content: space-between; align-items: end; margin-bottom: 50px; }
.light { color: #aaa; }
.section-head > p:last-child { width: 350px; line-height: 1.7; font-size: 14px; }
.project-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: 20px; }
.project { position: relative; height: 630px; overflow: hidden; }
.project:nth-child(3) { grid-column:1/-1; height:560px; }
.project img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.project:hover img { transform: scale(1.035); }
.project-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, #000c, transparent 60%); }
.project > span { position: absolute; top: 28px; left: 28px; font-size: 10px; text-transform: uppercase; letter-spacing: .13em; }
.project h3 { position: absolute; left: 28px; bottom: 28px; width: 75%; margin: 0; font-size: clamp(34px, 4vw, 62px); letter-spacing: -.06em; line-height: .94; text-transform: uppercase; }
.project a { position: absolute; right: 28px; bottom: 28px; width: 50px; height: 50px; display: grid; place-items: center; border: 1px solid #ffffffaa; border-radius: 50%; font-size: 20px; }
.services { padding: 150px 7vw; display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; }
.service-list { border-top: 1px solid #aaa; }
.service-list article { display: grid; grid-template-columns: 45px 1fr 1.4fr 30px; gap: 18px; align-items: start; padding: 34px 0; border-bottom: 1px solid #aaa; }
.service-list span { font-size: 10px; color: #777; }
.service-list h3 { margin: 0; text-transform: uppercase; font-size: 20px; letter-spacing: -.04em; }
.service-list p { margin: 0; color: #666; font-size: 13px; line-height: 1.7; }
.service-list b { font-size: 20px; font-weight: 400; }
.statement { background: var(--orange); color: white; padding: 130px 4vw; text-align: center; }
.statement p { margin: 0; font-weight: 800; font-size: clamp(44px, 7.2vw, 112px); line-height: .91; text-transform: uppercase; letter-spacing: -.07em; }
.statement em { color: var(--acid); }
.contact { background: var(--ink); color: white; padding: 120px 7vw 60px; }
.contact h2 { margin-top: 85px; }
.contact h2 em { color: var(--acid); }
.contact-bottom { margin-top: 110px; border-top: 1px solid #ffffff55; padding-top: 32px; display: flex; justify-content: space-between; align-items: end; }
.contact-bottom > a { font-size: clamp(23px, 3vw, 46px); letter-spacing: -.05em; border-bottom: 1px solid; padding-bottom: 7px; }
.contact-bottom > a span { color: var(--acid); }
.contact-bottom div { display: flex; gap: 45px; color: #aaa; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
footer { background: var(--ink); color: white; border-top: 1px solid #ffffff25; padding: 45px 4vw 35px; display: grid; grid-template-columns: 1fr 1fr auto; align-items: end; gap: 30px; }
.footer-brand { grid-row: span 3; }
.footer-logo { display: block; width: 82px; height: 82px; object-fit: contain; }
footer > p { color: #aaa; margin: 0; text-transform: uppercase; font-size: 10px; letter-spacing: .15em; }
.footer-nav, .footer-social { display: flex; gap: 25px; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
.footer-social { grid-column: 2 / -1; padding-top: 20px; border-top: 1px solid #ffffff25; }
.footer-social a { width:42px; height:42px; display:grid; place-items:center; border:1px solid #ffffff45; border-radius:50%; transition:.25s ease; }
.footer-social a:hover { background:var(--orange); border-color:var(--orange); transform:translateY(-3px); }
.footer-social img { width:18px; height:18px; display:block; }
footer > small { color: #777; font-size: 9px; }

/* Interior pages */
.inner-header.dark-header { position: fixed; color: white; background: #151515e6; border-color: #ffffff30; }
.dark-header .header-cta { border-color: #ffffff88; }
.inner-hero { min-height: 650px; padding: 130px 7vw 85px; display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; background: var(--cream); border-bottom: 1px solid #15151530; }
.inner-hero > .eyebrow { grid-column: 1 / -1; color: #6e645f; align-self: start; }
.inner-hero h1 { color: var(--ink); font-size: clamp(72px, 10vw, 148px); margin: 60px 0 0; }
.inner-hero h1 em { color: var(--orange); }
.inner-hero-copy { align-self: end; padding: 0 0 10px 4vw; }
.inner-hero-copy p { max-width: 430px; margin: 0; font-size: 17px; line-height: 1.75; }
.story-grid, .team-intro { display: grid; grid-template-columns: .65fr 1.35fr; gap: 6vw; padding: 135px 7vw; }
.story-grid h2, .team-intro h2, .process h2, .custom-price h2 { font-size: clamp(48px, 6vw, 92px); text-transform: uppercase; letter-spacing: -.065em; line-height: .92; margin: 0 0 50px; }
.story-grid h2 em, .team-intro h2 em, .process h2 em, .custom-price h2 em { font-family: var(--font-serif); color: var(--orange); text-transform: none; font-weight: 400; }
.story-grid div > p, .team-intro div > p { max-width: 700px; font-size: 17px; line-height: 1.8; color: #514b47; }
.values { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #15151540; border-bottom: 1px solid #15151540; margin: 0 7vw 130px; }
.values article { padding: 45px 36px 55px 0; border-right: 1px solid #15151540; }
.values article + article { padding-left: 36px; }
.values article:last-child { border-right: 0; }
.values span, .crew-roles span { font-size: 10px; color: var(--orange); }
.values h3 { margin: 55px 0 20px; font-size: 28px; text-transform: uppercase; letter-spacing: -.04em; }
.values p { color: #666; line-height: 1.7; font-size: 14px; }
.skills-block { background: var(--ink); color: white; padding: 100px 7vw; }
.skills-block > div { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 55px; }
.skills-block span { border: 1px solid #ffffff55; border-radius: 99px; padding: 17px 25px; font-size: clamp(16px, 2vw, 25px); text-transform: uppercase; letter-spacing: -.03em; }
.page-cta { background: var(--orange); color: white; padding: 110px 7vw; }
.page-cta h2 { margin: 60px 0 70px; font-size: clamp(58px, 8vw, 120px); text-transform: uppercase; line-height: .88; letter-spacing: -.07em; }
.page-cta h2 em { font-family: var(--font-serif); color: var(--acid); font-weight: 400; text-transform: none; }
.page-cta > a { display: inline-flex; gap: 80px; padding-bottom: 10px; border-bottom: 1px solid; text-transform: uppercase; font-size: 12px; letter-spacing: .12em; font-weight: 800; }
.page-service-list { padding: 0 7vw 120px; }
.page-service-list article { display: grid; grid-template-columns: 55px 1fr 1.1fr auto; gap: 30px; padding: 52px 0; border-bottom: 1px solid #15151545; align-items: start; }
.page-service-list span { color: var(--orange); font-size: 10px; }
.page-service-list h2 { margin: 0; font-size: clamp(26px, 3vw, 44px); text-transform: uppercase; letter-spacing: -.05em; }
.page-service-list p { margin: 0; color: #625b56; line-height: 1.75; font-size: 14px; }
.page-service-list a { text-transform: uppercase; font-size: 10px; letter-spacing: .1em; border-bottom: 1px solid; padding-bottom: 7px; }
.process { background: var(--acid); padding: 120px 7vw; }
.process h2 { margin: 55px 0 70px; }
.process > div { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #15151555; }
.process article { padding: 30px 25px 30px 0; border-bottom: 1px solid #15151555; }
.process article span { font-size: 9px; color: var(--orange); }
.process article h3 { text-transform: uppercase; margin: 32px 0 0; font-size: 18px; }
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; padding: 110px 5vw 140px; }
.pricing-grid article { position: relative; border: 1px solid #15151560; padding: 38px; min-height: 650px; display: flex; flex-direction: column; }
.pricing-grid article.featured { background: var(--orange); color: white; border-color: var(--orange); transform: translateY(-28px); }
.pricing-grid article > span { font-size: 10px; opacity: .6; }
.pricing-grid h2 { font-size: 36px; text-transform: uppercase; letter-spacing: -.05em; margin: 70px 0 28px; }
.pricing-grid strong { font-size: clamp(50px, 5vw, 76px); letter-spacing: -.07em; }
.pricing-grid strong small { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; }
.pricing-grid p { line-height: 1.7; font-size: 14px; margin: 32px 0; }
.pricing-grid ul { padding: 0; list-style: none; margin: 0 0 40px; }
.pricing-grid li { padding: 14px 0; border-top: 1px solid currentColor; font-size: 12px; opacity: .8; }
.pricing-grid article > a { margin-top: auto; text-transform: uppercase; font-size: 11px; letter-spacing: .12em; border-bottom: 1px solid; padding-bottom: 10px; width: max-content; }
.custom-price { padding: 110px 7vw 130px; border-top: 1px solid #15151540; }
.custom-price h2 { margin: 55px 0; }
.custom-price > a { text-transform: uppercase; font-size: 11px; font-weight: 800; letter-spacing: .1em; border-bottom: 1px solid; padding-bottom: 8px; }
.team-feature { display: grid; grid-template-columns: 1.05fr .95fr; min-height: 780px; }
.team-photo { position: relative; overflow: hidden; background: var(--ink); }
.team-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.team-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#0008,transparent 45%); }
.team-photo > span { position: absolute; z-index: 1; left: 30px; bottom: 28px; color: white; font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.team-bio { padding: 95px 7vw; display: flex; flex-direction: column; justify-content: center; }
.team-bio h2, .crew-heading h2 { font-size: clamp(58px, 7vw, 106px); text-transform: uppercase; letter-spacing: -.07em; line-height: .88; margin: 65px 0 35px; }
.team-bio h2 em, .crew-heading h2 em { font-family: var(--font-serif); font-weight: 400; text-transform: none; color: var(--orange); }
.team-bio strong { color: var(--orange); font-size: 11px; text-transform: uppercase; letter-spacing: .12em; }
.team-bio > p:last-child { max-width: 530px; margin-top: 42px; color: #625b56; line-height: 1.8; font-size: 15px; }
.crew-section { background: var(--ink); color: white; padding: 120px 5vw 145px; }
.crew-heading { display: grid; grid-template-columns: .65fr 1.35fr .65fr; gap: 4vw; align-items: end; margin-bottom: 75px; }
.crew-heading h2 { margin: 0; font-size: clamp(50px, 6vw, 90px); }
.crew-heading > p:last-child { color: #aaa; line-height: 1.75; font-size: 13px; }
.member-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.member-grid article { min-width: 0; }
.member-placeholder { height:360px; position:relative; overflow:hidden; isolation:isolate; background:#242020; }
.member-placeholder::before { content:""; position:absolute; inset:-30% -65% auto auto; width:120%; aspect-ratio:1; border:1px solid currentColor; border-radius:50%; opacity:.25; }
.member-placeholder::after { content:""; position:absolute; width:170%; height:34px; left:-35%; top:52%; background:var(--orange); transform:rotate(-37deg); z-index:-1; }
.member-placeholder span { position:absolute; top:20px; left:20px; font-size:9px; letter-spacing:.16em; font-weight:800; }
.member-placeholder i { position:absolute; width:92px; height:92px; left:50%; top:32%; transform:translate(-50%,-50%); border-radius:50%; background:currentColor; opacity:.84; }
.member-placeholder i::after { content:""; position:absolute; width:190px; height:190px; left:50%; top:78px; transform:translateX(-50%); border-radius:50% 50% 12px 12px; background:currentColor; }
.member-placeholder b { position:absolute; right:16px; bottom:-18px; font:900 96px/1 var(--font-sans); letter-spacing:-.09em; opacity:.24; }
.tone-1 { color:#f3eee7; background:linear-gradient(145deg,#f52227,#661b1d); }.tone-2 { color:#f7c9b2; background:linear-gradient(145deg,#181818,#42201f); }.tone-3 { color:#151515; background:linear-gradient(145deg,#f7c9b2,#d89a79); }
.member-grid article > p { color:#888; text-transform:uppercase; font-size:9px; letter-spacing:.12em; margin:20px 0 9px; }
.member-grid h3 { margin:0 0 6px; text-transform:uppercase; font-size:20px; letter-spacing:-.04em; }
.member-grid article > strong { color:var(--acid); text-transform:uppercase; font-size:10px; letter-spacing:.1em; }
.blog-grid { display:grid; grid-template-columns:1.45fr 1fr; gap:38px 28px; padding:110px 5vw 150px; }
.blog-grid article:first-child { grid-row:span 2; }
.blog-grid article > p { margin: 25px 0 12px; color: var(--orange); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.blog-grid article h2 { font-size: 34px; text-transform: uppercase; letter-spacing: -.05em; margin: 0 0 20px; }
.blog-grid article > div:not(.blog-art) { color: #665f5a; font-size: 14px; line-height: 1.7; min-height: 75px; }
.blog-grid article > a { display: inline-block; margin-top: 28px; text-transform: uppercase; font-size: 10px; letter-spacing: .1em; border-bottom: 1px solid; padding-bottom: 7px; }
.blog-art { height:250px; position:relative; overflow:hidden; background:var(--ink); }
.blog-grid article:first-child .blog-art { height:600px; }
.blog-art::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#0009,transparent 58%); pointer-events:none; }
.blog-art img { width:100%; height:100%; object-fit:cover; transition:transform .65s ease; }
.blog-grid article:hover .blog-art img { transform:scale(1.035); }
.blog-art span { position: absolute; top: 20px; left: 20px; color: white; text-transform: uppercase; font-size: 10px; letter-spacing: .1em; z-index: 1; }
.art-1 { background: linear-gradient(135deg, #151515 25%, #f52227 25% 55%, #f7c9b2 55%); }
.art-2 { background: url('hero-studio.jpg') center / cover; }
.art-2::after { content:""; position:absolute; inset:0; background:#f5222760; }
.art-3 { background: radial-gradient(circle at 72% 35%, #f7c9b2 0 18%, transparent 18%), linear-gradient(120deg, #151515 60%, #f52227 60%); }
.contact-page { display: grid; grid-template-columns: .8fr 1.2fr; gap: 10vw; padding: 120px 7vw 150px; }
.contact-details { display: flex; flex-direction: column; align-items: flex-start; }
.contact-details > a { font-size: clamp(23px, 3vw, 42px); letter-spacing: -.05em; border-bottom: 1px solid; margin: 22px 0; }
.contact-details > span { margin-top: 32px; text-transform: uppercase; font-size: 12px; letter-spacing: .12em; }
.contact-details > small { margin-top: 50px; color: #777; max-width: 270px; line-height: 1.7; }
.contact-page form { display: grid; gap: 28px; }
.contact-page label { display: grid; gap: 10px; text-transform: uppercase; font-size: 10px; letter-spacing: .12em; font-weight: 800; }
.contact-page input, .contact-page select, .contact-page textarea { width: 100%; border: 0; border-bottom: 1px solid #15151570; background: transparent; border-radius: 0; padding: 13px 0; font: inherit; color: inherit; }
.contact-page textarea { border: 1px solid #15151570; padding: 15px; resize: vertical; }
.contact-page button { width: max-content; background: var(--orange); color: white; border: 0; padding: 17px 26px; text-transform: uppercase; letter-spacing: .1em; font-weight: 800; cursor: pointer; }
.policy-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:8vw; padding:120px 7vw 150px; }
.policy-layout aside { position:sticky; top:35px; align-self:start; }
.policy-layout aside h2 { font-size:clamp(44px,5vw,76px); text-transform:uppercase; letter-spacing:-.065em; line-height:.93; margin:55px 0 35px; }
.policy-layout aside h2 em { font-family:var(--font-serif); color:var(--orange); font-weight:400; text-transform:none; }
.policy-layout aside > p:last-child { max-width:430px; color:#69615c; line-height:1.75; }
.policy-items { border-top:1px solid #15151555; }
.policy-items article { display:grid; grid-template-columns:45px 1fr; gap:25px; padding:38px 0; border-bottom:1px solid #15151555; }
.policy-items article > span { color:var(--orange); font-size:10px; }
.policy-items h3 { margin:0 0 16px; text-transform:uppercase; font-size:23px; letter-spacing:-.04em; }
.policy-items p { margin:0; color:#625b56; line-height:1.75; font-size:14px; }
.policy-contact { margin-top:42px; background:var(--acid); padding:30px; font-size:13px; line-height:1.8; }
.policy-contact a { font-weight:800; border-bottom:1px solid; }

@keyframes sectionReveal { from { opacity:0; transform:translateY(42px); } to { opacity:1; transform:none; } }
@supports (animation-timeline: view()) {
  .intro, .project, .services-title, .service-list article, .statement p, .story-grid > *, .values article, .page-service-list article, .process article, .pricing-grid article, .team-feature > *, .member-grid article, .blog-grid article, .contact-page > *, .policy-layout > * { animation:sectionReveal linear both; animation-timeline:view(); animation-range:entry 5% cover 30%; }
}

/* Keep the logo's finishing dot tucked beneath the P. */
.animated-word::after,.site-header .brand-word::after { position:absolute; right:12px; bottom:10px; margin:0; }

@media (max-width: 850px) {
  .site-header { height: 78px; grid-template-columns: 1fr auto; padding: 0 20px; }
  .animated-k { width:39px; height:42px; }
  .animated-word i { font-size:19px; }
  .animated-word { margin-left:-12px; }
  .animated-word .signature-a { width:13px; height:19px; flex-basis:13px; }
  .animated-word .signature-a::before,.animated-word .signature-a::after { width:3px; height:19px; }
  nav { display: none; } .header-cta { gap: 10px; padding: 11px; }
  .hero { min-height: 700px; } .hero-content { left: 20px; right: 20px; }
  h1 { font-size: clamp(60px, 20vw, 95px); line-height: .82; margin-top: 38px; }
  .hero-bottom { justify-content: space-between; gap: 30px; margin-top: 60px; }
  .hero-bottom p { width: 70%; font-size: 12px; } .circle-link { width: 58px; height: 58px; }
  .side-note { display: none; } .marquee { padding: 14px 0; }
  .intro, .services { grid-template-columns: 1fr; padding: 95px 22px; }
  .intro h2, .services h2, .contact h2 { font-size: 15vw; }
  .intro > div > p { font-size: 16px; margin-top: 40px; }
  .work { padding: 75px 20px; } .section-head { display: block; } .section-head > p:last-child { width: auto; margin-top: 28px; }
  .project-grid { grid-template-columns: 1fr; } .project, .project:nth-child(3) { grid-column:auto; height:500px; }
  .service-list article { grid-template-columns: 30px 1fr 25px; } .service-list p { grid-column: 2 / -1; max-width: 90%; }
  .statement { padding: 90px 18px; }
  .contact { padding: 85px 22px 50px; } .contact h2 { margin-top: 55px; }
  .contact-bottom { margin-top: 75px; display: block; } .contact-bottom > a { font-size: 6vw; }
  .contact-bottom div { margin-top: 40px; display: grid; gap: 10px; }
  footer { grid-template-columns: 1fr; align-items: start; } .footer-brand { grid-row: auto; margin-bottom: 20px; } .footer-social { grid-column:auto; flex-wrap:wrap; }
  .inner-header.dark-header nav { display: none; }
  .inner-hero { min-height: 570px; padding: 90px 22px 70px; grid-template-columns: 1fr; }
  .inner-hero h1 { font-size: 17vw; margin-top: 35px; }
  .inner-hero-copy { padding: 45px 0 0; }
  .story-grid, .team-intro { grid-template-columns: 1fr; padding: 90px 22px; }
  .values { grid-template-columns: 1fr; margin: 0 22px 90px; }
  .values article, .values article + article { border-right: 0; border-bottom: 1px solid #15151540; padding: 35px 0; }
  .skills-block, .page-cta, .process { padding: 80px 22px; }
  .page-service-list { padding: 0 22px 80px; }
  .page-service-list article { grid-template-columns: 30px 1fr; gap: 20px; }
  .page-service-list p, .page-service-list a { grid-column: 2; }
  .process > div { grid-template-columns: 1fr 1fr; }
  .pricing-grid, .blog-grid { grid-template-columns: 1fr; padding: 75px 22px 100px; }
  .blog-grid article:first-child { grid-row:auto; }
  .pricing-grid article.featured { transform: none; }
  .pricing-grid article { min-height: 560px; }
  .custom-price { padding: 85px 22px; }
  .team-feature { grid-template-columns: 1fr; }
  .team-photo { min-height: 560px; }
  .team-bio { padding: 85px 22px; }
  .crew-section { padding: 85px 22px 100px; }
  .crew-heading { grid-template-columns: 1fr; }
  .member-grid { grid-template-columns: 1fr 1fr; }
  .member-placeholder { height: 280px; }
  .blog-art, .blog-grid article:first-child .blog-art { height: 320px; }
  .contact-page { grid-template-columns: 1fr; padding: 85px 22px 110px; }
  .policy-layout { grid-template-columns:1fr; padding:85px 22px 110px; }
  .policy-layout aside { position:static; }
}

/* Premium interaction motion and a subtle finishing dot for the logo. */
.animated-word,.site-header .brand-word{padding-right:14px}.animated-word::after,.site-header .brand-word::after{content:"";width:6px;height:6px;flex:0 0 6px;margin:12px 0 0 7px;border-radius:50%;background:var(--peach);opacity:0;transform:scale(0);animation:brandDotIn .55s cubic-bezier(.2,.9,.25,1.35) 1.05s forwards}.animated-brand:hover .animated-k,.brand-lockup:hover img{transform:rotate(-3deg) scale(1.04)}.animated-brand:hover .animated-word i,.brand-lockup:hover .brand-word i{transform:translateY(-2px)}.animated-brand:hover .animated-word::after,.brand-lockup:hover .brand-word::after{animation:brandDotPulse 1.1s ease-in-out infinite}@keyframes brandDotIn{70%{opacity:1;transform:scale(1.3)}100%{opacity:1;transform:scale(1)}}@keyframes brandDotPulse{0%,100%{opacity:1;transform:scale(1);box-shadow:0 0 0 0 rgba(255,190,164,.38)}50%{opacity:.85;transform:scale(.82);box-shadow:0 0 0 6px rgba(255,190,164,0)}}
.header-cta,.nav-cta,.pricing-grid article>a,.blog-grid article>a,.page-cta>a,.text-link,.work-all-link{position:relative;transition:transform .3s cubic-bezier(.2,.75,.2,1),color .3s,border-color .3s,background-color .3s}.header-cta,.nav-cta{overflow:hidden;isolation:isolate}.header-cta::before,.nav-cta::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--orange);transform:translateX(-102%);transition:transform .38s cubic-bezier(.2,.75,.2,1)}.header-cta:hover,.nav-cta:hover{border-color:var(--orange);transform:translateY(-2px)}.header-cta:hover::before,.nav-cta:hover::before{transform:translateX(0)}.header-cta span,.nav-cta span,.page-cta>a span,.text-link span{display:inline-block;transition:transform .3s cubic-bezier(.2,.8,.2,1)}.header-cta:hover span,.nav-cta:hover span,.page-cta>a:hover span,.text-link:hover span{transform:translate(4px,-4px)}.page-cta>a:hover,.pricing-grid article>a:hover,.blog-grid article>a:hover,.text-link:hover,.work-all-link:hover{color:var(--acid);border-color:var(--acid);transform:translateY(-2px)}.circle-link,.project>a{transition:transform .32s cubic-bezier(.2,.8,.2,1),background-color .3s,border-color .3s,color .3s}.circle-link:hover,.project>a:hover{transform:translate(5px,-5px) rotate(7deg)}.service-list article,.page-service-list article,.pricing-grid article,.blog-grid article,.member-grid article{transition:transform .38s cubic-bezier(.2,.75,.2,1),border-color .3s,box-shadow .38s}.service-list article:hover,.page-service-list article:hover{transform:translateX(8px);border-color:var(--orange)}.pricing-grid article:hover,.blog-grid article:hover,.member-grid article:hover{transform:translateY(-7px)}.pricing-grid article:hover,.blog-grid article:hover{box-shadow:0 18px 45px rgba(21,21,21,.09)}.pricing-grid article.featured:hover{transform:translateY(-35px)}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto } .marquee div,.animated-k,.animated-word i,.animated-word::after,.brand-word::after{animation:none;transform:none;opacity:1}.header-cta,.nav-cta,.header-cta::before,.nav-cta::before,.header-cta span,.nav-cta span,.page-cta>a,.page-cta>a span,.text-link,.text-link span,.work-all-link,.circle-link,.project>a,.service-list article,.page-service-list article,.pricing-grid article,.blog-grid article,.member-grid article{transition:none!important;transform:none!important} }

.primary-nav .primary-menu{display:flex;gap:34px;list-style:none;margin:0;padding:0;font-size:13px}.primary-nav li{margin:0}.site-header .brand-lockup{display:flex;align-items:center;width:max-content;gap:0}.site-header .brand-lockup img{width:44px;height:46px;object-fit:contain;position:relative;z-index:2;margin-top:-2px;animation:kSpring 1s cubic-bezier(.2,.9,.25,1.2) both}.site-header .brand-word{display:flex;align-items:center;overflow:hidden;margin-left:-14px;padding:9px 4px 9px 0;position:relative;z-index:1}.site-header .brand-word i{font-style:normal;font-size:23px;line-height:1;font-weight:800;letter-spacing:-.07em;color:#fff;transform:translateX(-160%) translateY(10px);opacity:0;animation:letterOut .72s cubic-bezier(.2,.8,.2,1.25) forwards;animation-delay:calc(.28s + (var(--letter) * .055s))}.site-header .brand-word .signature-a{width:16px;height:23px;margin-right:-1px;flex:0 0 16px;position:relative}.site-header .brand-word .signature-a:before,.site-header .brand-word .signature-a:after{content:"";position:absolute;bottom:0;width:4px;height:23px;border-radius:1px;background:currentColor;transform-origin:bottom center}.site-header .brand-word .signature-a:before{left:2px;transform:skew(20deg)}.site-header .brand-word .signature-a:after{right:2px;transform:skew(-20deg)}.site-header .brand-word .connected-up{color:#ef2424}.site-header .brand-word .connected-u{margin-right:-.18em}.nav-cta{justify-self:end;display:flex;gap:42px;align-items:center;font-size:12px;text-transform:uppercase;letter-spacing:.08em;border:1px solid #ffffff88;padding:13px 15px 13px 19px}.admin-bar .site-header{top:32px}@media(max-width:782px){.admin-bar .site-header{top:46px}}@media(max-width:850px){.primary-nav{display:none}.nav-cta{gap:10px;padding:11px}.site-header .brand-lockup img{width:39px;height:42px}.site-header .brand-word{margin-left:-12px}.site-header .brand-word i{font-size:19px}.site-header .brand-word .signature-a{width:13px;height:19px;flex-basis:13px}.site-header .brand-word .signature-a:before,.site-header .brand-word .signature-a:after{width:3px;height:19px}}
.animated-word::after,.site-header .brand-word::after { position:absolute; right:12px; bottom:10px; margin:0; }
