/* A short introduction with one clear reading order. */
.home-profile .profile-story{display:block}
.home-profile .profile-story h2{font:400 clamp(32px,4.1vw,54px)/1.16 Ranade,Satoshi,sans-serif;letter-spacing:-1.4px;max-width:none;margin:10px 0 28px}
.home-profile .profile-story h2 em{font-family:Caveat,cursive;font-size:1.15em;letter-spacing:0;color:var(--accent);white-space:nowrap}
.profile-story-body{display:grid;grid-template-columns:1.25fr 1fr;gap:50px;max-width:1070px}
.profile-story-body p{font:400 15px/1.8 Satoshi,sans-serif;color:var(--muted);margin:0}
.profile-story-body .profile-story-lead{font-size:19px;line-height:1.7;color:var(--ink)}
.profile-story-links{display:flex;align-items:center;flex-wrap:wrap;gap:12px 30px;margin-top:24px}
.profile-story-links>a{font-size:13px;min-height:44px;display:inline-flex;align-items:center;gap:8px}

/* Give the AI title its own type rule instead of inheriting paragraph size. */
.home-capabilities .home-ai-note .ai-feature-copy .ai-personal-note{font:500 clamp(24px,2.5vw,32px)/1.3 Ranade,Satoshi,sans-serif;letter-spacing:-.6px;color:var(--ink);margin:0 0 14px}
.home-capabilities .home-ai-note .ai-feature-copy>p{font:400 14px/1.85 Satoshi,sans-serif;margin-bottom:18px}
.home-contact #home-contact-heading{color:var(--accent)}

/* FontReady is a visible part of the toolkit, with its own identity. */
.toolkit-heading{align-items:center}
.toolkit-heading .toolkit-intro{font-size:14px;color:var(--muted);margin:16px 0 0;max-width:38ch}
.own-tool-note{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:start;gap:15px;width:370px;max-width:42%;padding:18px 20px;background:color-mix(in srgb,var(--accent) 7%,var(--bg));border-radius:5px}
.own-tool-note>img{width:40px;height:40px;object-fit:contain;margin-top:3px}
.own-tool-note>div{display:grid;gap:7px;min-width:0}
.own-tool-kicker{font-size:9px;letter-spacing:1.1px;color:var(--accent)}
.own-tool-name{display:flex;align-items:center;gap:12px;font:500 22px/1.2 Ranade,Satoshi,sans-serif;text-decoration:none!important}
.own-tool-name>span{font:400 18px Satoshi,sans-serif;color:var(--accent)}
.own-tool-note p{font-size:12px;line-height:1.6;margin:0;color:var(--muted)}
.own-tool-plugin{font-size:12px;line-height:1.5;display:inline-flex;min-height:28px;align-items:center}

/* A project entry, rather than a product link hidden in a paragraph. */
.portfolio-build-note .activity-copy h3{font-size:clamp(23px,2.1vw,29px);line-height:1.3;margin-bottom:26px}
.current-build-project{display:grid;grid-template-columns:46px minmax(0,1fr);gap:18px;align-items:start;max-width:450px;margin:0 0 25px;text-decoration:none!important}
.current-build-project>img{display:block;width:46px;height:46px;object-fit:contain;transition:transform .25s}
.current-build-project>span{display:grid;gap:9px}
.current-build-status{font-size:9px;letter-spacing:1px;color:var(--accent)}
.current-build-project strong{font:500 25px/1.2 Ranade,Satoshi,sans-serif}
.current-build-project>span>span:not(.current-build-status){font-size:14px;line-height:1.7;color:var(--muted)}
.current-build-project b{font-size:12px;font-weight:500;margin-top:4px}
.current-build-project:hover>img{transform:rotate(-5deg)}
.current-build-project:focus-visible,.own-tool-name:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.brand-group .brand-abisoye img,.brand-group .brand-abisoye:hover img{filter:brightness(0);opacity:.85}
.brand-group .brand-tall img{max-height:72px;width:auto;max-width:150px}
.organisations .brand-track{animation-duration:55s}
@media(max-width:760px){
 .home-profile .profile-story h2{font-size:34px;letter-spacing:-.8px;line-height:1.2;margin-bottom:24px}
 .home-profile .profile-story h2 em{display:block;margin-top:4px}
 .profile-story-body{grid-template-columns:minmax(0,1fr);gap:16px}
 .profile-story-body .profile-story-lead{font-size:18px}
 .profile-story-body p{font-size:14px}
 .profile-story-links{gap:8px 20px;margin-top:20px}
 .profile-story-links>a{font-size:12px}
 .home-capabilities .home-ai-note .ai-feature-copy .ai-personal-note{font-size:24px;letter-spacing:-.3px}
 .home-capabilities .home-ai-note .ai-feature-copy>p{font-size:13px}
 .own-tool-note{width:100%;max-width:none;margin-top:22px;padding:17px 18px}
 .own-tool-name{font-size:21px}
 .current-build-project{grid-template-columns:40px minmax(0,1fr);gap:14px;margin-bottom:22px}
 .current-build-project>img{width:40px;height:40px}
 .current-build-project strong{font-size:23px}
 .current-build-project>span>span:not(.current-build-status){font-size:13px}
}
@media(prefers-reduced-motion:reduce){.current-build-project>img{transition:none}.current-build-project:hover>img{transform:none}}

/* Final alignment and type refinements. */
.home-profile .profile-story .profile-story-links>a{display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;min-height:44px;padding:0;margin:0;border:0;border-radius:0;background:transparent;color:var(--ink);font:500 13px/1.4 Satoshi,sans-serif;text-decoration:none}
.home-profile .profile-story .profile-story-links>a>span{display:inline-block;font:400 15px/1 Satoshi,sans-serif}
.home-profile .profile-story .profile-story-links>a:hover{color:var(--accent)}
.home-capabilities .home-ai-note .ai-feature-copy .ai-personal-note{font:500 clamp(32px,3.4vw,42px)/1.25 Caveat,'Segoe Print',cursive;letter-spacing:0;color:var(--ink)}
.home-tool-section .toolkit-heading{display:block}
.home-tool-section .toolkit-heading h2{margin-bottom:0}
.own-tool-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:18px;margin-top:24px;padding:20px 0 0}
.own-tool-row>img{width:36px;height:36px;object-fit:contain}
.own-tool-row-copy{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:5px 16px}
.own-tool-row .own-tool-kicker{grid-column:1/-1}
.own-tool-row .own-tool-name{font-size:20px}
.own-tool-row p{font-size:12px;line-height:1.6;color:var(--muted);margin:0}
.own-tool-row .own-tool-plugin{font-size:12px;min-height:40px;gap:7px;white-space:nowrap}
/* Let the complete capture determine the preview height. Only the browser gutter is clipped. */
.portfolio-page .project-art:has(.work-preview-full){aspect-ratio:auto;height:auto}
.portfolio-page .project-art:has(.work-preview-full) .project-shot-viewport{height:auto}
.portfolio-page .project-art .project-shot-viewport>.work-preview-full{display:block;width:101.2%!important;max-width:none!important;height:auto!important;object-fit:contain;object-position:top left}
@media(max-width:760px){
 .home-profile .profile-story .profile-story-links>a{font-size:12px}
 .home-capabilities .home-ai-note .ai-feature-copy .ai-personal-note{font-size:32px}
 .own-tool-row{grid-template-columns:32px minmax(0,1fr);gap:12px;margin-top:20px;padding-top:18px}
 .own-tool-row>img{width:32px;height:32px}
 .own-tool-row-copy{display:block}
 .own-tool-row .own-tool-name{font-size:20px;margin:6px 0}
 .own-tool-row p{font-size:12px}
 .own-tool-row .own-tool-plugin{grid-column:2;justify-self:start;white-space:normal;font-size:12px}
}

/* A maker's note beside a small typography specimen, outside the tool panel. */
.home-tool-section .own-tool-row{display:grid;grid-template-columns:175px minmax(0,1fr);gap:36px;align-items:center;max-width:760px;margin:38px auto 0;padding:8px 12px;background:none;border:0}
.own-tool-specimen{position:relative;height:160px;isolation:isolate}
.specimen-paper{position:absolute;display:flex;align-items:center;justify-content:center;width:122px;height:145px;border:1px solid #ddd5c9;border-radius:2px;box-shadow:0 5px 12px #00000010}
.specimen-paper-back{left:8px;top:2px;transform:rotate(-9deg);background:#eee7ff;color:#8565bd;font:400 60px/1 Georgia,serif}
.specimen-paper-front{left:43px;top:10px;transform:rotate(7deg);flex-direction:column;gap:18px;background:#fffdf8;color:#35243f}
.specimen-letters{font:400 64px/1 Georgia,serif;letter-spacing:-5px;padding-right:5px}
.specimen-caption{font:500 7px/1.2 Satoshi,sans-serif;letter-spacing:1.1px;color:#766a7c}
.home-tool-section .own-tool-row-copy{display:block;min-width:0}
.home-tool-section .own-tool-kicker{display:block;font:500 27px/1.2 Caveat,cursive;letter-spacing:0;color:var(--accent);margin:0 0 6px}
.home-tool-section .own-tool-row h3{display:flex;align-items:center;gap:10px;margin:0 0 10px;font:500 23px/1.3 Ranade,Satoshi,sans-serif;color:var(--ink)}
.home-tool-section .own-tool-row h3 img{display:block;width:28px;height:28px;object-fit:contain}
.home-tool-section .own-tool-row p{font:400 13px/1.75 Satoshi,sans-serif;color:var(--muted);max-width:47ch;margin:0}
.own-tool-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;margin-top:13px}
.home-tool-section .own-tool-name,.home-tool-section .own-tool-plugin{display:inline-flex;align-items:center;gap:8px;min-height:42px;font:500 12px/1.4 Satoshi,sans-serif;white-space:normal;text-decoration:none;color:var(--ink)}
.home-tool-section .own-tool-name{padding:0 15px;border:1px solid var(--accent);border-radius:4px;color:var(--accent)}
.home-tool-section .own-tool-name>span{font-size:15px}
.home-tool-section .own-tool-plugin:hover{color:var(--accent)}
@media(max-width:760px){
 .home-tool-section .own-tool-row{grid-template-columns:95px minmax(0,1fr);gap:18px;align-items:start;margin-top:28px;padding:8px 0}
 .own-tool-specimen{height:120px;margin-top:14px}
 .specimen-paper{width:76px;height:96px}
 .specimen-paper-back{left:0;top:0;font-size:40px}
 .specimen-paper-front{left:17px;top:7px;gap:12px}
 .specimen-letters{font-size:42px;letter-spacing:-3px}
 .specimen-caption{font-size:5px;letter-spacing:.5px}
 .home-tool-section .own-tool-kicker{font-size:25px}
 .home-tool-section .own-tool-row h3{font-size:20px}
 .home-tool-section .own-tool-row p{font-size:12px}
 .own-tool-actions{gap:5px 14px;margin-top:10px}
 .home-tool-section .own-tool-name,.home-tool-section .own-tool-plugin{font-size:11px;margin:0}
}

/* Two personal products, equal weight and a shared paper language. */
.maker-projects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;margin-top:38px}
.home-tool-section .maker-projects .own-tool-row{grid-template-columns:112px minmax(0,1fr);gap:23px;align-items:start;max-width:none;margin:0;padding:8px 0}
.maker-projects .own-tool-specimen{height:136px;margin-top:20px}
.maker-projects .specimen-paper{width:88px;height:113px}
.maker-projects .specimen-paper-back{left:0;top:0;font-size:45px}
.maker-projects .specimen-paper-front{left:21px;top:8px;gap:14px}
.maker-projects .specimen-letters{font-size:48px;letter-spacing:-3px}
.maker-projects .specimen-caption{font-size:5.5px;letter-spacing:.6px}
.home-tool-section .maker-projects .own-tool-row-copy{display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;min-width:0}
.home-tool-section .maker-projects .own-tool-row h3{margin-bottom:6px}
.own-tool-status{display:block;font:500 8px/1.5 Satoshi,sans-serif;letter-spacing:.8px;color:var(--accent);margin:0 0 10px}
.maker-projects .own-tool-actions{padding-top:13px;margin-top:auto;gap:8px 18px}
.maker-projects .own-tool-templogin .specimen-paper-back{background:#e4edce;color:#607744}
.maker-projects .own-tool-templogin .specimen-paper-front{transform:rotate(5deg)}
.maker-projects .own-tool-templogin .specimen-paper-front img{display:block;width:44px;height:44px;object-fit:contain}
@media(max-width:1000px){
 .maker-projects{grid-template-columns:minmax(0,1fr);gap:32px;max-width:700px;margin:30px auto 0}
 .home-tool-section .maker-projects .own-tool-row{grid-template-columns:112px minmax(0,1fr);gap:25px}
 .maker-projects .own-tool-actions{margin-top:0}
}
@media(max-width:480px){
 .home-tool-section .maker-projects .own-tool-row{grid-template-columns:90px minmax(0,1fr);gap:18px}
 .maker-projects .specimen-paper{width:70px;height:96px}
 .maker-projects .specimen-paper-front{left:16px;gap:12px}
 .maker-projects .specimen-letters{font-size:40px}
 .maker-projects .specimen-caption{font-size:4.5px;letter-spacing:.35px}
 .maker-projects .own-tool-templogin .specimen-paper-front img{width:36px;height:36px}
 .maker-projects .own-tool-specimen{height:115px;margin-top:18px}
 .home-tool-section .maker-projects .own-tool-kicker{font-size:24px}
 .own-tool-status{font-size:7px;letter-spacing:.6px}
}
