@import url("/assets/fonts/fonts.css");

:root{--paper:#eae7dc;--ink:#282914;--muted:#5f5f5f;--line:#e8e8e8;--purple:#737f60;--lavender:#dfe3d6;--lime:#e5dfc8;--white:#f9f8f4}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Manrope',Arial,sans-serif;font-size:17px;line-height:1.65}a{color:inherit;text-underline-offset:5px}a:hover{color:var(--purple)}a:focus-visible,summary:focus-visible{outline:3px solid var(--purple);outline-offset:6px}::selection{background:var(--lime)}.wrap{max-width:1200px;margin:auto;padding:0 48px}.skip{position:absolute;top:-100px}.skip:focus{top:0;background:white;z-index:10}header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px 0;border-bottom:1px solid var(--line)}.brand{font-weight:700;text-decoration:none;font-size:21px;letter-spacing:-.7px}.brand span{color:var(--purple)}nav{display:flex;gap:30px;align-items:center;font-size:14px}nav a{text-decoration:none}.nav-contact{border:1px solid var(--ink);padding:8px 18px;border-radius:30px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:1.9px;font-weight:700;color:var(--muted)}.hero{padding:78px 0 70px;display:grid;grid-template-columns:1.4fr 1fr;gap:65px;align-items:center}.hero h1{font-size:clamp(44px,4.7vw,67px);line-height:1.08;letter-spacing:-2.8px;font-weight:500;margin:23px 0 26px}em{font-family:'Libre Caslon Text','Libre Caslon Text',Georgia,serif;font-weight:400;color:var(--purple)}.hero p{font-size:18px;max-width:570px;color:var(--muted)}.actions{display:flex;flex-wrap:wrap;gap:23px;align-items:center;margin-top:30px}.button{display:inline-flex;gap:25px;align-items:center;background:var(--ink);color:white;border:1px solid var(--ink);border-radius:30px;padding:12px 23px;text-decoration:none;font-size:14px}.button:hover{background:var(--purple);color:white}.text-link{font-size:14px;font-weight:600}.note-row:last-child{padding-bottom:0}.section{padding:80px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:34px}.section-head p{max-width:370px;font-size:15px;color:var(--muted);margin:0}.section h2,.about h2{font-size:42px;letter-spacing:-1.5px;line-height:1.15;font-weight:500;margin:12px 0 0}.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.project{text-decoration:none;display:flex;flex-direction:column;align-items:start;border-top:1px solid var(--line);padding-top:0}.project:hover h3{text-decoration:underline;text-underline-offset:6px}.project .art{width:100%;height:235px;margin:0 0 22px;padding:25px;display:flex;align-items:center;justify-content:center;overflow:hidden}.art.ai{background:#dfe3d6}.art.collab{background:#e2dfd0}.art.pricing{background:#e8dfd0}.art.practice{background:#dbe0d2}.diagram{width:100%;max-width:340px;font-size:12px;line-height:1.4}.diagram .node{padding:14px 18px;border:1px solid #a1aa91;background:#f7f7ef;box-shadow:4px 4px 0 #cbd1bd}.diagram .arrow{text-align:center;font-size:21px;padding:6px}.diagram .node:last-child{background:#cbd2bb}.mini-window{background:var(--white);border:1px solid #a6ac96;width:85%;padding:20px;box-shadow:7px 7px 0 #cdd0bd}.window-bar{border-bottom:1px solid #d6d9cb;font-size:10px;padding-bottom:10px;margin-bottom:15px;letter-spacing:2px}.comment{border-left:3px solid #737f60;padding-left:12px;font-size:13px;margin-top:12px}.comment small{display:block;color:#656b59}.mini-prices{display:flex;gap:9px;align-items:center}.price{background:#fffaf5;border:1px solid #b8af97;padding:20px 12px;width:100px;min-height:125px;font-size:11px;text-align:center}.price.mid{background:#d6d8be;transform:translateY(-8px)}.price b{font-size:19px;display:block;margin:14px 0 7px;font-family:'Libre Caslon Text',Georgia,serif;font-weight:400}.loop{display:grid;grid-template-columns:1fr 1fr;gap:14px;transform:rotate(-3deg)}.loop span{border:1px solid #9aa78d;background:#f5f6ed;padding:15px 22px;font-size:13px}.project .meta{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted)}.project h3{font-size:26px;line-height:1.2;letter-spacing:-.7px;font-weight:500;margin:9px 0 12px}.project p{font-size:15px;line-height:1.6;color:var(--muted);margin:0 0 17px;max-width:470px}.project .read{font-size:13px;font-weight:700;margin-top:auto}.help{background:var(--ink);color:var(--paper)}.help .eyebrow,.help p{color:#eae7dc}.help em{color:#d0d8bd}.help-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:40px}.help-grid article{border-top:1px solid #68705a;padding-top:20px}.help-grid .num{font-size:12px;color:#d0d8bd}.help-grid h3{font-size:23px;line-height:1.3;letter-spacing:-.4px;font-weight:400}.help-grid p{font-size:15px}.about{display:grid;grid-template-columns:1fr 1.25fr;gap:90px;padding:85px 0}.about p{color:var(--muted);font-size:16px;margin-top:0}.about .signature{font-family:'Libre Caslon Text',Georgia,serif;font-size:30px;color:var(--purple);margin-top:30px}.contact{border-top:1px solid var(--line);padding:55px 0 65px;display:flex;justify-content:space-between;align-items:center;gap:40px}.contact h2{font-size:36px;line-height:1.2;letter-spacing:-1px;font-weight:400;margin:0 0 12px}.contact p{font-size:14px;color:var(--muted);margin:0}footer{padding:22px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}footer a{margin-left:20px}.case-hero{padding:60px 0 45px;max-width:900px}.back{font-size:13px}.case-hero h1{font-size:clamp(36px,5vw,60px);font-weight:500;line-height:1.08;letter-spacing:-2px;margin:28px 0 20px}.case-deck{color:var(--muted);max-width:700px;font-size:20px}.case-layout{display:grid;grid-template-columns:220px 1fr;gap:70px;border-top:1px solid var(--line);padding:45px 0 80px}.case-side{font-size:13px}.case-side p{margin:0 0 22px}.case-side strong{display:block;font-size:10px;letter-spacing:1px;text-transform:uppercase;margin-bottom:5px}.case-body{max-width:720px}.case-body h2{font-size:29px;line-height:1.25;font-weight:500;letter-spacing:-.6px;margin:40px 0 16px}.case-body h2:first-child{margin-top:0}.case-body h3{font-size:21px;line-height:1.3;font-weight:500}.case-body p,.case-body li{font-size:16px;color:#505244}.case-body li{margin-bottom:8px}.case-body table{border-collapse:collapse;width:100%;font-size:14px;margin:25px 0}.case-body td,.case-body th{border-bottom:1px solid var(--line);padding:14px 12px;text-align:left}.takeaway{background:var(--lavender);padding:24px 28px;margin-top:35px;border-left:3px solid var(--purple)}.takeaway h2{font-size:23px;margin:0 0 12px}.next-case{display:block;padding:30px 0;border-top:1px solid var(--line);font-size:23px;text-decoration:none}.diagram-label{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-top:12px}.case-body .art{padding:25px;background:var(--lavender);margin:30px 0}.case-body .diagram{margin:auto}@media(max-width:900px){.wrap{padding:0 30px}.hero{gap:35px}.hero h1{font-size:49px}.about{gap:40px}.case-layout{grid-template-columns:160px 1fr;gap:35px}}@media(max-width:650px){.wrap{padding:0 22px}header{padding:22px 0;align-items:start}.brand{font-size:18px;max-width:165px;line-height:1.25}nav{gap:16px;font-size:12px;flex-wrap:wrap;justify-content:end;max-width:195px}.nav-contact{border:0;padding:0}nav .cv-nav{display:none}.hero{grid-template-columns:1fr;padding:48px 0;gap:40px}.hero h1{font-size:46px;letter-spacing:-1.8px}.hero p{font-size:17px}.section{padding:55px 0}.section-head{display:block}.section-head p{margin-top:20px}.section h2,.about h2{font-size:35px}.work-grid{grid-template-columns:1fr;gap:35px}.project .art{height:220px}.help-grid{grid-template-columns:1fr;gap:15px;margin-top:30px}.help-grid h3{margin:10px 0}.about{grid-template-columns:1fr;gap:28px;padding:55px 0}.contact{display:block;padding:45px 0}.contact .button{margin-top:25px}.contact h2{font-size:31px}footer{gap:20px;font-size:10px}.case-hero{padding-top:35px}.case-layout{grid-template-columns:1fr;gap:25px}.case-side{display:grid;grid-template-columns:1fr 1fr;gap:10px}.case-side p{margin:0 0 12px}.case-deck{font-size:18px}.case-body table{font-size:12px}.case-body td,.case-body th{padding:10px 6px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Editorial palette and typography, with a restrained reading measure. */
body{background:#f9f8f4;font-family:'Manrope',Arial,sans-serif}
header{border-bottom:0;padding:27px 0}
.brand,nav,h1,h2,h3,.signature,.next-case{font-family:'Libre Caslon Text',Georgia,serif;font-weight:400}
.brand{font-size:21px;letter-spacing:-.7px}
nav{font-size:16px}
.nav-contact{border:0;padding:0}
.hero{display:block;padding:72px 0 65px;min-height:420px;position:relative}
.hero:before{content:'';position:absolute;inset:-100px calc((1104px - 100vw)/2) 0;background:#eae7dc;z-index:-1}
.hero h1{max-width:960px;font-size:60px;line-height:1.18;font-weight:400;letter-spacing:-2px;margin:0 0 23px}
.hero p{font-size:19px;max-width:58ch;margin:0;color:#5f5f5f}
.actions{margin-top:27px;gap:30px}
.text-link{font-size:14px;font-weight:500}
.section h2,.about h2{font-size:39px;font-weight:400;letter-spacing:-1.2px;line-height:1.25}
em{color:inherit;font-style:normal;font-family:inherit}
.section-head p{max-width:36ch}
.project h3{font-size:27px;font-weight:400;line-height:1.3}
.project p{font-size:14px}
.help{background:var(--paper);color:var(--ink)}
.help .eyebrow{color:var(--purple)}.help p{color:var(--muted)}
.help em{color:inherit}
.help-grid article{border-color:var(--line)}
.help-grid .num{color:var(--purple)}
.help-grid h3{font-size:24px;font-weight:400}
.about .signature{color:#737f60}
p,li{max-inline-size:52ch}
.case-body{max-width:52ch}
.case-body h2{font-weight:400;font-size:28px;line-height:1.3}
.case-body p,.case-body li{color:#505244;max-inline-size:52ch}
.case-hero h1{max-width:24ch;font-size:55px;line-height:1.2;font-weight:400;letter-spacing:-1.5px}
.case-deck{max-width:55ch}
.button{background:#737f60;border-color:#737f60}
.button:hover{background:#282914}
.contact h2{font-size:34px;line-height:1.3}
@media(min-width:1200px){.hero:before{inset-inline:calc((1104px - 100vw)/2)}}
@media(max-width:1199px){.hero:before{inset-inline:-48px}}
@media(max-width:900px){.hero:before{inset-inline:-30px}.hero h1{font-size:53px;max-width:780px}.hero{padding:65px 0 55px;min-height:410px}.brand{max-width:230px}.case-hero h1{font-size:46px}}
@media(max-width:650px){header{padding:23px 0;gap:20px}.brand{font-size:19px;max-width:155px;line-height:1.25}nav{font-size:13px;max-width:160px;gap:12px 18px}.hero{padding:48px 0 43px;min-height:360px}.hero:before{inset-inline:-22px}.hero h1{font-size:39px;line-height:1.22;letter-spacing:-1.3px;max-width:19ch}.hero p{font-size:16px;max-width:29ch}.actions{gap:25px;margin-top:25px}.section h2,.about h2{font-size:32px}.section-head{margin-bottom:28px}.section-head p{max-width:34ch}.case-hero h1{font-size:36px;letter-spacing:-1px}.project h3{font-size:25px}.contact h2{font-size:29px}.case-layout{gap:30px}}

/* Portrait supplied by Jess; preserve the original image. */
.hero{display:grid;grid-template-columns:minmax(0,1fr) 300px;align-items:center;gap:65px;padding-block:60px}
.hero h1{font-size:49px;line-height:1.2;letter-spacing:-1.6px}
.hero p{font-size:17px}
.hero-portrait{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:2px}
@media(max-width:1000px) and (min-width:651px){.hero{grid-template-columns:minmax(0,1fr) 250px;gap:38px}.hero h1{font-size:42px}}
@media(max-width:650px){.hero{grid-template-columns:1fr;gap:30px;padding-block:40px}.hero h1{font-size:37px;letter-spacing:-1.2px}.hero p{font-size:16px}.hero-portrait{width:180px}}

/* Keep the section title and its introduction in one visual group. */
.section-head{display:block;margin-bottom:42px}
.section-head p{margin:18px 0 0;max-width:52ch}
@media(max-width:650px){.section-head{margin-bottom:34px}.section-head p{margin-top:16px}}

/* A personal welcome and a simple matted portrait frame. */
.hero .hero-intro{font-family:'Libre Caslon Text',Georgia,serif;font-size:25px;line-height:1.3;color:#737f60;margin:0 0 17px}
.hero-portrait{padding:10px;background:#f9f8f4;border:1px solid #737f60;box-shadow:7px 7px 0 #c7cbb8}
@media(max-width:650px){.hero .hero-intro{font-size:23px;margin-bottom:15px}.hero-portrait{padding:7px;box-shadow:5px 5px 0 #c7cbb8}}

/* A soft, subtly asymmetric outline for the personal portrait. */
.hero-portrait{border-radius:44% 40% 36% 42% / 36% 42% 38% 44%;box-shadow:8px 9px 0 #c7cbb8,0 14px 26px rgba(48,40,32,.06)}
@media(max-width:650px){.hero-portrait{box-shadow:5px 6px 0 #c7cbb8,0 9px 18px rgba(48,40,32,.05)}}

/* An upright rounded photograph, held with a small paper-tape detail. */
.portrait-frame{position:relative;margin:0;width:100%;transform:none}
.portrait-frame:before{content:'';position:absolute;z-index:1;top:-13px;left:50%;width:94px;height:31px;transform:translateX(-50%);background:linear-gradient(0deg,rgba(222,218,209,.9) 0 49%,rgba(249,248,241,.94) 50% 100%);clip-path:polygon(4% 0,97% 0,100% 17%,97% 34%,100% 52%,97% 73%,99% 100%,3% 100%,0 78%,3% 57%,0 36%,3% 17%)}
.portrait-frame .hero-portrait{display:block;width:100%;height:auto;aspect-ratio:5/6;object-fit:cover;object-position:50% center;padding:0;border:0;border-radius:34px;background:transparent;box-shadow:0 15px 30px rgba(48,40,32,.12);transform:none}
@media(max-width:650px){.portrait-frame{width:190px;margin-top:8px}.portrait-frame .hero-portrait{border-radius:25px;box-shadow:0 10px 22px rgba(48,40,32,.1)}.portrait-frame:before{width:69px;height:25px;top:-10px}}

/* A small olive pushpin and a slight, relaxed tilt. */
.portrait-frame{transform:rotate(-3deg);transform-origin:50% 8px}
.portrait-frame:before{top:-5px;width:19px;height:19px;border-radius:50%;clip-path:none;background:radial-gradient(circle at 34% 28%,#c4cbae 0%,#879568 35%,#4c593a 78%);box-shadow:2px 3px 3px rgba(48,40,32,.3);z-index:3}
.portrait-frame:after{content:'';position:absolute;top:10px;left:50%;width:3px;height:11px;background:linear-gradient(90deg,#c1bfb3,#716f64);border-radius:0 0 2px 2px;transform:translateX(-50%) rotate(-22deg);transform-origin:top center;box-shadow:2px 2px 2px rgba(48,40,32,.2);z-index:2}
@media(max-width:650px){.portrait-frame:before{top:-5px;width:16px;height:16px}.portrait-frame:after{top:8px;height:9px}}

/* Restore paper tape while keeping the current portrait and tilt. */
.portrait-frame:before{top:-13px;width:94px;height:31px;border-radius:0;background:linear-gradient(0deg,rgba(222,218,209,.9) 0 49%,rgba(249,248,241,.94) 50% 100%);clip-path:polygon(4% 0,97% 0,100% 17%,97% 34%,100% 52%,97% 73%,99% 100%,3% 100%,0 78%,3% 57%,0 36%,3% 17%);box-shadow:none}
.portrait-frame:after{content:none}
@media(max-width:650px){.portrait-frame:before{width:69px;height:25px;top:-10px}}

/* Exact requested olive fill and pale divider, with darker olive for small text. */
:root{--accent:rgb(115,127,96);--purple:var(--accent);--line:rgb(232,232,232)}
.help .eyebrow,.help-grid .num{color:#526141}
a:hover{color:#526141}
.button{background:var(--accent);border-color:var(--accent);color:#080a06}
.button:hover{background:#526141;color:white}

.contact-email{font-size:17px;font-weight:400}
@media(max-width:650px){.contact-email{display:inline-block;margin-top:22px}}

/* A compact navigation button and a viewport-aware personal introduction. */
.nav-contact{display:inline-flex;align-items:center;justify-content:center;background:var(--accent);color:#080a06;border:1px solid var(--accent);border-radius:24px;padding:7px 19px;text-decoration:none;min-height:40px;font-family:'Manrope',Arial,sans-serif;font-size:13px;line-height:1.2}
.nav-contact:hover{background:#526141;border-color:#526141;color:white}
.home{--header-height:84px}
.home header{height:var(--header-height);padding-block:0}
.home .hero{height:calc(100svh - var(--header-height));min-height:0;padding:clamp(18px,5svh,50px) 0 16px;grid-template-columns:minmax(0,1fr) min(28vw,300px);grid-template-rows:minmax(0,1fr) auto;column-gap:65px;row-gap:24px}
.home .hero:before{top:calc(-1 * var(--header-height))}
.home .hero-copy{min-width:0}
.home .hero .actions{margin-top:24px}
.home .portrait-frame{width:100%;max-width:300px;justify-self:center;align-self:center}
.hero-explore{grid-column:1/-1;align-self:end;justify-self:center;display:flex;flex-direction:column;align-items:center;gap:3px;color:#526141;text-decoration:none;font-size:13px;line-height:1.3;padding:6px 22px;min-height:50px;text-align:center}
.hero-explore:hover{color:var(--ink)}
.down-arrow{font-size:25px;line-height:1}
@media(min-width:651px) and (max-width:1000px){.home .hero{column-gap:35px}.home .hero h1{font-size:clamp(36px,4.5vw,45px)}.home .hero p{font-size:16px}.home .hero .hero-intro{font-size:24px}}
@media(max-width:650px){
 .home{--header-height:88px}
 header{align-items:center}.nav-contact{padding:6px 14px;min-height:34px;font-size:12px}
 .home .hero{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr) auto;padding:24px 0 10px;row-gap:14px}
 .home .hero h1{font-size:clamp(28px,8.5vw,35px);line-height:1.15;letter-spacing:-1px;margin-bottom:14px;max-width:24ch}
 .home .hero .hero-intro{font-size:22px;margin-bottom:12px}
 .home .hero-copy>p:not(.hero-intro){font-size:14px;line-height:1.45;max-width:34ch}
 .home .hero .actions{margin-top:14px}
 .home .portrait-frame{width:min(42vw,22svh,185px);margin:0;align-self:center}
 .hero-explore{min-height:46px;font-size:12px;padding-block:4px}
}
@media(max-width:650px) and (max-height:650px){
 .home{--header-height:78px}
 .home .hero{padding-top:14px;row-gap:8px}
 .home .hero h1{font-size:28px;line-height:1.12;margin-bottom:11px}
 .home .hero .hero-intro{font-size:20px;margin-bottom:8px}
 .home .hero .actions{margin-top:10px}
 .home .portrait-frame{width:min(33vw,18svh,124px)}
}
@media(min-width:651px) and (max-height:550px){
 .home{--header-height:64px}
 .home .hero{padding-block:12px;row-gap:8px;column-gap:35px;grid-template-columns:minmax(0,1fr) min(25vw,190px)}
 .home .hero h1{font-size:32px;line-height:1.12;margin-bottom:12px;max-width:26ch}
 .home .hero .hero-intro{font-size:20px;margin-bottom:8px}
 .home .hero-copy>p:not(.hero-intro){font-size:13px;line-height:1.4}
 .home .hero .actions{margin-top:10px}
 .home .portrait-frame{width:min(22vw,calc((100svh - 150px)*.8333),190px)}
 .hero-explore{min-height:38px;font-size:12px;padding-block:0}
 .down-arrow{font-size:22px}
}
@media(max-width:650px) and (max-height:480px){
 .home{--header-height:64px}
 .home .hero{grid-template-columns:minmax(0,1fr) 80px;grid-template-rows:minmax(0,1fr) auto;column-gap:16px;padding-top:10px}
 .home .hero h1{font-size:23px;line-height:1.1}
 .home .hero .hero-intro{font-size:18px}
 .home .hero-copy>p:not(.hero-intro){font-size:12px}
 .home .portrait-frame{width:80px}
 .hero-explore{min-height:34px}
}

/* Let project artwork shrink with narrow phone layouts. */
.project{min-width:0}
.mini-prices{width:100%;max-width:318px}
.price{flex:1;min-width:0;width:auto;padding-inline:8px}
@media(max-width:650px){.work-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:360px){.home header .brand{font-size:16px;letter-spacing:-.4px}}

/* Layout and spacing from Jess's supplied portfolio wireframe. */
.home .wrap{max-width:1240px;padding-inline:44px}
.home .masthead{max-width:1380px;padding-inline:28px}
.home .hero-wrap{max-width:1120px;padding-inline:32px}
.home .hero{height:auto;min-height:360px;padding:30px 0 48px;grid-template-columns:minmax(0,1fr) 250px;grid-template-rows:auto;column-gap:90px;row-gap:0;align-items:center}
.home .hero:before{inset-inline:calc((1056px - 100vw)/2);top:calc(-1 * var(--header-height))}
.home .hero h1{font-size:46px;line-height:1.15;max-width:22ch;margin-bottom:25px}
.home .hero .hero-intro{font-size:20px;margin-bottom:13px}
.home .hero-copy>p:not(.hero-intro){font-size:16px;max-width:52ch}
.home .portrait-frame{width:250px;max-width:100%;margin:0}
.work-surface,.about-surface{background:#fff}
.home #work{padding:42px 0 68px}
.home .section-head{margin-bottom:48px}
.section-title{display:flex;align-items:center;gap:30px}
.home .section-title h2{margin:0;font-size:34px;line-height:1.2;white-space:nowrap}
.section-rule{height:1px;background:var(--line);flex:1}
.home .section-head p{margin-top:27px;max-width:52ch;font-size:15px}
.home .work-grid{column-gap:38px;row-gap:66px}
.home .project{border:0}
.home .project .art{height:200px;margin-bottom:18px;background:#efefe6;border-radius:4px;padding:22px}
.home .project .diagram{max-width:none}
.home .mini-window{width:100%;box-shadow:none;padding:16px}
.home .window-bar{padding-bottom:8px;margin-bottom:10px}
.home .comment{margin-top:10px}
.home .mini-prices{max-width:none;gap:12px}
.home .price{min-height:100px;padding:13px 8px}
.home .price.mid{transform:none}
.home .price b{font-size:18px;margin:8px 0 5px}
.home .loop{width:100%;transform:none;gap:12px}
.home .loop span{padding:13px 15px}
.home .project h3{font-size:25px;line-height:1.22;margin:8px 0 12px}
.home .project p{font-size:14px;line-height:1.5;margin-bottom:20px}
.home .project .read{font-size:13px;text-decoration:underline;text-underline-offset:4px;font-weight:500}
.home .help{padding:64px 0 88px}
.home .help h2{font-size:33px;line-height:1.25;max-width:none;margin:8px 0 0}
.home .help-grid{gap:34px;margin-top:42px}
.home .help-grid article{border:0;padding-top:0}
.home .help-grid h3{font-size:20px;line-height:1.3;margin:10px 0 12px}
.home .help-grid p{font-size:14px;line-height:1.5;margin:0}
.home .about{grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:75px;padding:78px 0 82px}
.home .about h2{font-size:34px;line-height:1.25;margin-top:10px}
.home .about p{font-size:15px;line-height:1.55;margin-bottom:15px}
.home .about .text-link{display:inline-block;margin-top:8px}
.contact{display:block;border:0;padding:58px 0 55px}
.contact h2{font-size:32px;margin-bottom:12px}
.contact p{max-inline-size:65ch}
footer{justify-content:center;border:0;padding:23px 0;font-size:12px;text-align:center}
@media(min-width:651px) and (max-width:1000px){
 .home .hero{min-height:330px;grid-template-columns:minmax(0,1fr) 215px;column-gap:45px;padding-block:28px 42px}
 .home .hero h1{font-size:37px}
 .home .portrait-frame{width:215px}
 .home .hero:before{inset-inline:-32px}
 .home .wrap{padding-inline:32px}
 .home .about{gap:40px}
 .home .help h2{font-size:29px}
 .home .help-grid{gap:25px}
 .home .project h3{font-size:23px}
}
@media(max-width:650px){
 .home .wrap{padding-inline:22px}
 .home .masthead{padding-inline:22px}
 .home .hero{height:auto;min-height:0;grid-template-columns:minmax(0,1fr) 110px;grid-template-rows:auto;column-gap:20px;padding:30px 0 40px}
 .home .hero:before{inset-inline:-22px}
 .home .hero h1{font-size:29px;line-height:1.14;margin-bottom:16px;max-width:24ch}
 .home .hero .hero-intro{font-size:20px;margin-bottom:10px}
 .home .hero-copy>p:not(.hero-intro){font-size:13px;line-height:1.5}
 .home .portrait-frame{width:110px;align-self:center}
 .home #work{padding:34px 0 48px}
 .home .section-title h2{font-size:29px}
 .section-title{gap:20px}
 .home .section-head{margin-bottom:32px}
 .home .section-head p{font-size:14px;margin-top:20px}
 .home .work-grid{row-gap:42px}
 .home .project .art{height:180px;padding:18px}
 .home .project h3{font-size:23px}
 .home .help{padding:45px 0 50px}
 .home .help h2{font-size:28px}
 .home .help-grid{margin-top:30px;gap:30px}
 .home .help-grid h3{font-size:22px}
 .home .about{grid-template-columns:1fr;gap:25px;padding:48px 0 52px}
 .home .about h2{font-size:30px;max-width:18ch}
 .contact{padding:42px 0 38px}
 .contact h2{font-size:29px}
 footer{font-size:11px;padding:22px 0}
}
@media(max-width:380px){
 .home .hero{grid-template-columns:1fr;gap:25px;padding-top:22px}
 .home .hero h1{font-size:29px;max-width:23ch}
 .home .portrait-frame{width:122px;justify-self:center}
}
@media(min-width:651px) and (max-height:550px){
 .home .hero{min-height:0;grid-template-columns:minmax(0,1fr) 150px;padding-block:22px;column-gap:36px}
 .home .hero h1{font-size:31px;margin-bottom:15px}
 .home .portrait-frame{width:150px}
 .home .hero .hero-intro{font-size:19px;margin-bottom:8px}
}

/* Reading measure calibrated against the actual Manrope font: about 75 characters. */
:root{--reading-measure:60ch}
p,li{max-inline-size:var(--reading-measure)}
.case-body{font-size:16px;max-width:var(--reading-measure);min-width:0}
.case-body p,.case-body li{max-inline-size:var(--reading-measure)}
.case-deck{max-width:var(--reading-measure);max-inline-size:var(--reading-measure)}
.home .section-head p,.home .project p,.home .about p,.contact p{max-width:var(--reading-measure);max-inline-size:var(--reading-measure)}
.home .help-grid{display:flex;flex-direction:column;gap:32px}
.home .help-grid article{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,60ch);column-gap:55px;row-gap:8px;font-size:16px;align-content:start}
.home .help-grid .num{grid-column:1;grid-row:1}
.home .help-grid h3{grid-column:1;grid-row:2;margin:0;font-size:23px}
.home .help-grid p{grid-column:2;grid-row:1/3;font-size:16px;line-height:1.55;max-width:var(--reading-measure);max-inline-size:var(--reading-measure);margin:0}
@media(max-width:1100px) and (min-width:651px){.home .work-grid{grid-template-columns:minmax(0,1fr)}.home .project .art{max-width:650px}}
@media(max-width:1000px){
 .case-layout{grid-template-columns:minmax(0,1fr);gap:32px}
 .case-side{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
 .case-side p{margin:0}
 .home .about{grid-template-columns:minmax(0,1fr);gap:28px}
 .home .about h2{max-width:25ch}
 .home .help-grid article{grid-template-columns:minmax(0,1fr);gap:8px}
 .home .help-grid .num,.home .help-grid h3,.home .help-grid p{grid-column:1;grid-row:auto}
 .home .help-grid p{margin-top:5px}
}
@media(max-width:650px){.case-side{grid-template-columns:repeat(2,minmax(0,1fr))}.home .help-grid{gap:30px}.home .help-grid h3{font-size:22px}.home .help-grid p{font-size:15px}}

/* Allow small paragraph-specific optical corrections within the shared reading column. */
.case-body{max-width:65ch}
.home .help-grid article{grid-template-columns:minmax(0,1fr) minmax(0,65ch)}
@media(max-width:1000px){.home .help-grid article{grid-template-columns:minmax(0,1fr)}}

/* Restore responsive columns for the three ways Jess can help. */
.home .help-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px;margin-top:42px}
.home .help-grid article{display:block;min-width:0;font-size:14px}
.home .help-grid .num{display:block}
.home .help-grid h3{font-size:20px;line-height:1.3;margin:10px 0 12px}
.home .help-grid p{font-size:14px;line-height:1.5;margin:0;max-width:100%;max-inline-size:100%}
@media(min-width:651px) and (max-width:900px){.home .help-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}}
@media(max-width:650px){.home .help-grid{grid-template-columns:minmax(0,1fr);gap:30px;margin-top:30px}.home .help-grid h3{font-size:22px}.home .help-grid p{font-size:15px}}

.home .hero-copy>p.hero-location{margin-top:6px}

/* Research screenshots supplied for the pricing case. */
.home .project .art.project-screenshot{padding:16px;background:#f5f5f3}
.home .project .project-screenshot img{display:block;width:100%;height:100%;object-fit:contain}
.case-stimulus{margin:32px 0 40px;min-width:0}
.case-stimulus a{display:block;border:1px solid #e8e8e8;border-radius:8px;overflow:hidden}
.case-stimulus img{display:block;width:100%;height:auto}
.case-stimulus figcaption{margin-top:12px;font-size:14px;line-height:1.55;color:#555}

/* Text links use underlines instead of directional arrows. */
nav a:not(.nav-contact),.back,.next-case,.text-link,.project .read{ text-decoration:underline;text-underline-offset:5px }