/* TRANSCEND TALENT GROUP — static review build.
   Client-specific monochrome tokens. No external font requests or runtime dependencies. */
:root{--ink:#101010;--paper:#f5f5f1;--white:#fff;--muted:#aaa;--line:#353535;--light-line:#d0d0c9;--body-font:"Helvetica Neue",Helvetica,Arial,sans-serif;--display-font:Arial,Helvetica,sans-serif;--wrap:1320px;--gutter:clamp(22px,4.15vw,64px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--ink);color:var(--paper);font:16px/1.6 var(--body-font);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid currentColor;outline-offset:6px}input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:3px;outline-color:#111}img{max-width:100%;height:auto;display:block}figure,blockquote,p{margin:0}h1,h2,h3{font-family:var(--display-font);margin:0;line-height:1.04;letter-spacing:-.055em}h2{font-size:clamp(36px,4.1vw,60px);font-weight:600}h3{font-weight:600}p{text-wrap:pretty}::selection{background:var(--paper);color:var(--ink)}.section-paper ::selection,.contact-panel ::selection{background:var(--ink);color:var(--paper)}.wrap{width:min(var(--wrap),calc(100% - 2*var(--gutter)));margin-inline:auto}.section{padding-block:110px}.section-paper{background:var(--paper);color:var(--ink)}.eyebrow{font-size:10px;letter-spacing:.18em;font-weight:600;line-height:1.7}.section-label{margin-bottom:25px}.line-marker{display:inline-block;width:22px;height:1px;background:currentColor;vertical-align:middle;margin-right:10px}.arrow{width:21px;height:21px;flex:none;vertical-align:middle}.small-index{font-size:10px;letter-spacing:.14em;line-height:1.5}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:54px;padding:16px 23px;font-size:12px;font-weight:600;line-height:1.5;border:1px solid transparent;transition:background .2s,color .2s,transform .2s}.button-light{background:var(--paper);color:var(--ink)}.button-dark{background:var(--ink);color:var(--paper)}.button-light:hover{background:#deded6;transform:translateY(-2px)}.button-dark:hover{background:#353535;transform:translateY(-2px)}.button .arrow{width:19px;height:19px}.text-link{display:inline-flex;align-items:center;gap:24px;min-height:44px;font-size:12px;font-weight:600;border-bottom:1px solid currentColor;line-height:1.5}.text-link:hover .arrow{transform:translate(2px,-2px)}.arrow{transition:transform .2s}.outline-text{color:transparent;-webkit-text-stroke:1.3px var(--paper)}.muted-heading{color:#979793}.lead{font-size:clamp(18px,1.8vw,24px);line-height:1.45;letter-spacing:-.025em}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0,0,0,0);overflow:hidden;white-space:nowrap}[hidden]{display:none!important}.skip-link{position:fixed;top:-150px;left:20px;z-index:100;background:white;color:black;padding:12px 18px}.skip-link:focus{top:12px}
/* Navigation */
.site-header{background:var(--ink);position:sticky;top:0;z-index:30;border-bottom:1px solid #282828}.nav-wrap{min-height:104px;display:flex;align-items:center;justify-content:space-between;gap:32px}.brand{display:inline-flex;align-items:center;gap:20px;flex:none}.brand-mark{width:76px;height:54px;object-fit:contain;filter:brightness(0) invert(1)}.brand-name{font-size:12px;letter-spacing:.16em;line-height:1.25;font-weight:600}.brand-name span{display:block;font-size:8px;letter-spacing:.38em;font-weight:400;margin-top:7px}.primary-navigation{display:flex;align-items:center;gap:34px;font-size:12px}.primary-navigation>a{display:inline-flex;gap:24px;align-items:center;min-height:44px;position:relative}.primary-navigation>a:not(.nav-contact)::after{content:"";position:absolute;height:1px;background:currentColor;left:0;right:0;bottom:7px;transform:scaleX(0);transform-origin:left;transition:transform .2s}.primary-navigation>a:hover::after,.primary-navigation>a[aria-current=page]::after{transform:scaleX(1)}.nav-contact{border:1px solid #666;padding:10px 18px}.nav-contact:hover,.nav-contact[aria-current=page]{background:var(--paper);color:var(--ink)}.menu-toggle{display:none}
/* Homepage hero */
.hero{display:grid;grid-template-columns:55% 45%;min-height:660px;margin-top:30px;margin-bottom:38px}.hero-copy{display:flex;flex-direction:column;justify-content:center;padding:32px 30px 0 0;position:relative;z-index:1}.hero h1{font-size:clamp(65px,8.65vw,130px);line-height:.93;letter-spacing:-.066em;font-weight:700;margin:33px 0 30px}.hero-description{font-size:17px;line-height:1.6;color:#bababa;letter-spacing:-.01em;max-width:380px}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:14px 24px;margin-top:34px}.hero-actions .text-link{font-size:11px;gap:16px;border:0}.hero-footnote{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid var(--line);margin-top:45px;padding-top:20px;font-size:8px;letter-spacing:.13em;line-height:1.8;color:#aaa}.hero-footnote a{display:flex;align-items:center;gap:18px;min-height:44px}.hero-footnote a span{font-size:22px}.hero-visual{position:relative;min-height:630px;isolation:isolate;overflow:hidden}.hero-photo,.hero-photo img{width:100%;height:100%;display:block}.hero-photo{position:absolute;inset:0}.hero-photo img{object-fit:cover;object-position:52% 30%;filter:grayscale(1)}.hero-photo-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12),transparent 45%,rgba(0,0,0,.75))}.photo-corner{position:absolute;top:24px;left:25px;font-size:8px;letter-spacing:.16em;background:rgba(16,16,16,.65);padding:7px 10px;color:white}.hero-image-caption{position:absolute;left:28px;right:28px;bottom:29px;display:flex;justify-content:space-between;align-items:end;font-size:19px;line-height:1.1;letter-spacing:-.02em;font-weight:600;color:white}.large-arrow{font-size:52px;font-weight:400}.statement-strip{border-block:1px solid var(--line)}.statement-strip .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:88px;font-size:12px;letter-spacing:.14em;font-weight:500}.strip-cross{font-size:20px;color:#858585;font-weight:400}
/* Introduction and focus */
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}.intro-text{padding-top:5px}.intro-text>p+p{margin-top:25px;font-size:14px;line-height:1.8;color:#54544f}.intro-text>.text-link{margin-top:20px}.principle-row{display:grid;grid-template-columns:repeat(3,1fr);gap:60px;margin-top:70px}.principle-row>div{border-top:1px solid var(--light-line);padding-top:22px}.principle-row span{font-size:10px;color:#666}.principle-row h3{font-size:27px;letter-spacing:-.04em;margin:20px 0 12px}.principle-row p{font-size:12px;color:#575750}.focus-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}.focus-heading h2{font-size:clamp(32px,3.55vw,53px)}.focus-heading>p:not(.eyebrow){font-size:14px;color:#aaa;max-width:430px;margin-top:30px;line-height:1.8}.focus-heading>.text-link{margin-top:22px}.focus-list{align-self:center;border-top:1px solid var(--line)}.focus-list>div{display:grid;grid-template-columns:27px 1fr 20px;align-items:center;gap:23px;padding-block:35px;border-bottom:1px solid var(--line)}.focus-list .small-index{color:#aaa}.focus-list h3{font-size:22px;letter-spacing:-.03em;line-height:1.25;font-weight:500}.focus-list>div>span:last-child{font-size:26px;color:#aaa}.image-story{padding-bottom:95px}.story-heading{display:flex;justify-content:space-between;gap:30px;align-items:center;border-top:1px solid var(--line);padding-block:23px}.story-heading .small-index{color:#aaa;font-size:9px}.story-grid{display:grid;grid-template-columns:1fr 2fr;gap:24px}.story-grid figure{min-width:0}.story-photo{display:block;height:390px;overflow:hidden;background:#242424}.story-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(.85);transition:filter .4s,transform .5s}.story-portrait img{object-position:50% 55%}.story-grid figcaption{padding-top:14px;color:#b7b7b2;font-size:11px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:55px}.section-heading>p{font-size:12px;color:#61615a}.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}.quote-card{border-top:1px solid var(--light-line);display:flex;flex-direction:column}.quote-top{display:flex;justify-content:space-between;align-items:center;min-height:90px}.quote-symbol{font-family:Georgia,serif;font-size:78px;line-height:1;transform:translateY(16px)}.quote-top .small-index{color:#666}.quote-card blockquote{font-size:16px;line-height:1.8;letter-spacing:-.01em;flex:1}.quote-card figcaption{margin-top:29px;padding-top:16px;border-top:1px solid var(--light-line);font-size:12px;font-weight:600;letter-spacing:.02em}
/* Shared closing section and footer */
.closing-cta{padding:85px 0}.cta-grid{display:flex;align-items:end;justify-content:space-between;gap:50px}.closing-cta h2{font-size:clamp(32px,4.15vw,61px);margin-top:25px;line-height:1.08;font-weight:500}.closing-cta h2 span{color:#aaa}.closing-cta .button{min-width:176px;flex:none}.site-footer{border-top:1px solid var(--line)}.footer-top{display:grid;grid-template-columns:1.2fr 1fr .65fr;align-items:start;gap:70px;padding-top:54px;padding-bottom:55px}.footer-top>p{font-size:12px;color:#aaa;line-height:1.8}.footer-links{display:flex;flex-direction:column;align-items:start;gap:9px;font-size:12px}.footer-links>a{min-height:30px}.footer-links>a:hover{text-decoration:underline;text-underline-offset:5px}.footer-links .arrow{width:13px;height:13px;margin-left:9px}.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid var(--line);padding-block:25px;font-size:9px;color:#999;line-height:1.8}.footer-bottom p:last-child{letter-spacing:.05em}
/* About */
.page-hero{padding-block:65px 70px}.about-hero{display:grid;grid-template-columns:1.5fr 1fr;gap:65px;align-items:center}.about-hero h1{font-size:clamp(37px,4.95vw,76px);line-height:1.01;font-weight:700;margin:28px 0}.about-hero .hero-description{max-width:500px;font-size:15px}.about-photo{height:570px;position:relative}.about-photo picture,.about-photo img{height:100%;width:100%;display:block}.about-photo img{object-fit:cover;filter:grayscale(.9);object-position:center 65%}.vertical-label{position:absolute;right:15px;top:24px;writing-mode:vertical-rl;background:#111;color:#fff;letter-spacing:.17em;font-size:8px;padding:12px 8px}.about-story{display:grid;grid-template-columns:1fr 1fr;gap:90px}.about-emblem{width:170px;height:auto;margin-top:54px}.about-body p{font-size:15px;line-height:1.9;color:#4b4b46}.about-body p+p{margin-top:23px}.about-body p.lead{font-size:22px;line-height:1.6;color:var(--ink)}.about-body p:nth-last-child(2){font-weight:600;color:#111}.purpose-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;margin-top:50px}.purpose-grid article{border-top:1px solid var(--line);padding-top:25px}.purpose-grid h2{margin:28px 0 26px;font-size:48px}.purpose-grid p{color:#aaa;font-size:15px;line-height:1.85;max-width:450px}.about-wide{margin-bottom:35px}.about-wide-image{height:550px;position:relative;overflow:hidden}.about-wide-image picture,.about-wide-image img{height:100%;width:100%;display:block}.about-wide-image img{object-fit:cover;object-position:50% 35%;filter:grayscale(1)}.about-wide-image::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.7),rgba(0,0,0,0) 80%)}.about-wide-caption{position:absolute;z-index:1;left:45px;bottom:40px}.about-wide-caption>p:last-child{font-size:clamp(27px,3.5vw,48px);line-height:1.14;letter-spacing:-.04em;margin-top:24px}.about-wide-caption strong{font-weight:600}
/* Contact */
.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:75px;padding-top:74px;padding-bottom:90px;align-items:start}.contact-copy h1{font-size:clamp(43px,5.55vw,82px);line-height:.99;margin:29px 0}.contact-copy .hero-description{max-width:400px;font-size:15px}.contact-details{display:flex;flex-direction:column;gap:28px;margin-top:55px}.contact-details .small-index{display:block;color:#aaa;font-size:9px;margin-bottom:10px}.contact-details a{display:inline-flex;align-items:center;gap:16px;font-size:15px;line-height:1.5;overflow-wrap:anywhere;min-height:40px}.contact-details a:hover{text-decoration:underline;text-underline-offset:6px}.contact-details .arrow{width:16px;height:16px}.contact-panel{background:var(--paper);color:var(--ink);padding:38px;min-width:0}.contact-panel h2{font-size:36px;line-height:1.1;margin-top:21px}.form-intro{font-size:12px;color:#606059;margin:20px 0 29px;line-height:1.8}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}label{display:block;font-size:11px;font-weight:600;line-height:1.5;margin-bottom:21px}label>span{font-weight:400;font-size:9px;color:#62625c}input,textarea,select{width:100%;display:block;background:transparent;border:0;border-bottom:1px solid #a0a099;border-radius:0;padding:13px 0 12px;font-size:12px;color:var(--ink);margin-top:6px;min-height:44px}input::placeholder,textarea::placeholder{color:#74746d;opacity:1}textarea{resize:vertical;min-height:120px}select{padding-right:22px}.form-privacy{font-size:10px;color:#686861;line-height:1.8;margin:8px 0 20px}#enquiry-form>.button{width:100%}.direct-email{border-top:1px solid var(--light-line);padding-top:20px;margin-top:24px;font-size:10px;color:#64645d}.direct-email a{color:#111;display:inline-flex;align-items:center;gap:6px;font-weight:600;min-height:32px}.direct-email .arrow{width:12px;height:12px}.draft-result{padding:23px 19px;border:1px solid #888;margin-top:25px}.draft-result h3{font-size:22px}.draft-result p{font-size:12px;margin:12px 0 19px;line-height:1.7}.draft-result>.button{width:100%}.copy-button{width:100%;margin-top:12px;border:0;background:transparent;text-decoration:underline;text-underline-offset:4px;font-size:11px;min-height:44px}.page-contact .footer-top{padding-top:40px}
/* Reduced-motion friendly enhancement; nothing starts invisible. */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
@media(min-width:1550px){.hero{min-height:705px}.hero-visual{min-height:685px}}
@media(max-width:1100px){.primary-navigation{gap:24px}.hero{grid-template-columns:54% 46%;min-height:600px}.hero-visual{min-height:590px}.hero h1{font-size:8.3vw}.hero-copy{padding-right:24px}.hero-description{font-size:15px}.hero-actions{gap:15px}.hero-footnote{margin-top:28px}.hero-footnote>span{display:none}.hero-footnote{justify-content:flex-start}.intro-grid,.focus-grid,.about-story{gap:50px}.principle-row{gap:30px}.focus-list h3{font-size:20px}.focus-list>div{gap:16px}.quote-grid{gap:26px}.quote-card blockquote{font-size:14px}.story-photo{height:340px}.about-hero{gap:40px}.about-photo{height:490px}.contact-layout{gap:35px}.contact-panel{padding:28px}.contact-copy h1{font-size:5.1vw}.contact-details a{font-size:13px;gap:10px}.form-row{grid-template-columns:1fr;gap:0}.footer-top{gap:40px}}
@media(max-width:760px){:root{--gutter:23px}.section{padding-block:65px}.nav-wrap{min-height:86px;gap:15px;flex-wrap:wrap}.brand{gap:12px}.brand-mark{width:63px;height:45px}.brand-name{font-size:10px;letter-spacing:.14em}.brand-name span{font-size:7px;letter-spacing:.29em;margin-top:5px}.primary-navigation{width:100%;padding-bottom:22px;gap:22px;font-size:11px}.js .menu-toggle{display:inline-flex;align-items:center;gap:15px;color:var(--paper);background:none;border:0;min-height:44px;padding:0 4px;font-size:10px;letter-spacing:.06em}.menu-lines{display:block;width:20px;height:10px;border-block:1px solid currentColor;transition:transform .2s}.menu-toggle[aria-expanded=true] .menu-lines{transform:rotate(-45deg);height:0;border-bottom:0}.js .primary-navigation{display:none}.js .primary-navigation.is-open{display:flex}.hero{display:flex;flex-direction:column;margin-top:0;margin-bottom:23px;gap:30px}.hero-copy{padding:45px 0 0}.hero h1{font-size:clamp(58px,12.7vw,91px);margin:26px 0 25px}.hero .eyebrow{font-size:8px;letter-spacing:.15em}.hero-description{font-size:15px}.hero-actions{gap:12px 25px;margin-top:28px}.hero-actions .text-link{font-size:11px}.hero-footnote{display:none}.hero-visual{min-height:0;height:490px}.hero-photo img{object-position:50% 24%}.hero-image-caption{font-size:17px;left:23px;right:23px;bottom:22px}.photo-corner{left:20px;top:20px;font-size:7px}.statement-strip .wrap{gap:12px;min-height:68px;font-size:8px;letter-spacing:.07em}.strip-cross{font-size:13px}.intro-grid,.focus-grid,.about-story{grid-template-columns:1fr;gap:30px}.intro-text{padding-top:0}.intro-text>p+p{font-size:14px}.principle-row{grid-template-columns:1fr;gap:24px;margin-top:45px}.principle-row>div{display:block;padding-top:18px}.principle-row h3{font-size:25px;margin:0 0 11px}.principle-row p{margin:0}.principle-row span{padding-top:5px}.focus-heading h2{font-size:40px}.focus-heading>p:not(.eyebrow){margin-top:24px}.focus-list>div{padding-block:26px;gap:13px}.focus-list h3{font-size:19px}.image-story{padding-bottom:65px}.story-heading{align-items:start;padding-block:20px}.story-heading .eyebrow{font-size:8px;max-width:190px}.story-heading .small-index{display:none}.story-grid{grid-template-columns:1fr;gap:30px}.story-photo{height:auto;aspect-ratio:1.33}.story-portrait{aspect-ratio:1.05}.story-portrait img{object-position:center 60%}.story-grid figcaption{padding-top:10px}.section-heading{display:block;margin-bottom:30px}.section-heading>p{margin-top:20px}.quote-grid{grid-template-columns:1fr;gap:35px}.quote-top{min-height:75px}.quote-card blockquote{font-size:16px;line-height:1.7}.quote-card figcaption{margin-top:20px}.cta-grid{align-items:start;flex-direction:column;gap:28px}.closing-cta{padding-block:60px}.closing-cta h2{font-size:35px}.closing-cta .eyebrow{font-size:8px}.footer-top{grid-template-columns:1fr 1fr;gap:32px;padding-block:35px}.footer-top .brand{grid-column:1/-1}.footer-top>p{font-size:11px}.footer-links{font-size:11px;gap:3px}.footer-bottom{align-items:start;flex-direction:column;gap:7px;padding-block:20px;font-size:8px}.about-hero{display:flex;flex-direction:column;align-items:stretch;gap:35px;padding-block:42px 40px}.about-hero h1{font-size:clamp(43px,8.8vw,65px);margin:26px 0;line-height:1.03}.about-hero .representation-line{font-size:.88em}.about-hero .hero-description{font-size:14px}.about-photo{height:430px;max-width:100%}.about-photo img{object-position:50% 53%}.about-emblem{width:125px;margin-top:32px}.about-story{gap:42px}.about-body p.lead{font-size:20px}.about-body p{font-size:14px}.purpose-grid{grid-template-columns:1fr;gap:43px;margin-top:32px}.purpose-grid h2{font-size:38px;margin-block:24px}.purpose-grid p{font-size:14px}.about-wide{margin-bottom:10px}.about-wide-image{height:400px}.about-wide-image img{object-position:51% 30%}.about-wide-caption{left:25px;bottom:25px}.about-wide-caption .eyebrow{font-size:7px}.contact-layout{grid-template-columns:1fr;gap:40px;padding-block:42px 50px}.contact-copy h1{font-size:clamp(43px,8.8vw,65px);line-height:1.03}.contact-copy .hero-description{font-size:14px}.contact-details{margin-top:32px;gap:20px}.contact-details a{font-size:13px}.contact-panel{padding:25px}.contact-panel h2{font-size:32px}.contact-panel .eyebrow{font-size:9px}.contact-panel label{font-size:11px}.contact-panel input,.contact-panel textarea,.contact-panel select{font-size:16px}.form-row{grid-template-columns:1fr}.contact-details .email-link{font-size:clamp(11px,3.4vw,14px)}.form-intro{font-size:12px}.form-privacy{font-size:11px}.direct-email{font-size:10px}}
@media(max-width:375px){:root{--gutter:18px}.nav-wrap{min-height:80px}.brand-mark{width:48px;height:37px}.hero h1{font-size:clamp(49px,15.5vw,58px)}.hero-actions{gap:8px}.hero .button{padding:14px 17px;gap:20px}.hero-visual{height:420px}.statement-strip .wrap{font-size:7px;gap:6px}.strip-cross{font-size:10px}.contact-copy h1,.about-hero h1{font-size:39px}.contact-panel{padding:21px}.primary-navigation{gap:16px}.nav-contact{padding:8px 12px}}
@media print{.site-header,.hero-actions,.closing-cta,.site-footer,.menu-toggle,#enquiry-form{display:none!important}body{background:white;color:black}.outline-text{color:black;-webkit-text-stroke:0}.section{padding:25px 0}.wrap{width:100%}.hero-visual{height:300px;min-height:300px}.hero{min-height:0}.hero h1{font-size:60px}.section-paper{background:white}.hero-description,.muted-heading{color:#333}.contact-layout{display:block}.contact-panel{margin-top:30px}.about-wide{display:none}}

/* Prominent contact details, with readable wrapping on narrow screens. */
.page-contact .contact-details { gap: 34px; }
.page-contact .contact-details .small-index { font-size: 11px; color: #c4c4bf; letter-spacing: .13em; margin-bottom: 12px; }
.page-contact .contact-details a { max-width: 100%; min-height: 48px; font-size: clamp(20px, 1.8vw, 26px); font-weight: 500; line-height: 1.45; color: #fff; gap: 14px; }
.page-contact .contact-details .arrow { width: 21px; height: 21px; }
@media (max-width: 760px) {
  .page-contact .contact-details a { font-size: 20px; gap: 12px; }
}

/* Consistent hollow lettering in mobile Safari and Chromium. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
.outline-text {
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--paper);
  text-shadow: none;
}
@media (max-width: 760px) {
  .outline-text { -webkit-text-stroke-width: 1px; letter-spacing: -.035em; }
}
@media print {
  .outline-text { -webkit-text-fill-color: black; -webkit-text-stroke: 0; }
}

/* Real vector contours avoid mobile font-stroke rendering artifacts. */
.outline-vector { display: inline-block; white-space: nowrap; color: var(--paper); -webkit-text-stroke: 0; -webkit-text-fill-color: currentColor; letter-spacing: 0; }
.outline-vector svg { display: inline-block; overflow: visible; }
@media print { .outline-vector { color: #111; } }

/* Discreet site-design credit. */
.footer-bottom { flex-wrap: wrap; }
.footer-bottom .design-credit { font-size: 10px; letter-spacing: 0; }
.design-credit a { color: var(--paper); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: #777; display: inline-block; padding-block: 8px; }
.design-credit a:hover { text-decoration-color: currentColor; }

@media(max-width:350px){.about-hero .representation-line{font-size:.82em}}

/* Quiet motion, with native navigation and no scrolling interception. */
/* The branded curtain owns the transition rather than a second page fade. */
@view-transition { navigation: none; }
.page-curtain { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; background: #080808; color: #f5f5f1; opacity: 0; visibility: hidden; pointer-events: none; }
.curtain-brand { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; }
.curtain-brand::before { content: ''; position: absolute; width: 290px; height: 290px; top: -80px; background: radial-gradient(circle, #ffffff0c, transparent 68%); pointer-events: none; }
.curtain-logo { width: clamp(125px, 18vw, 175px); height: auto; filter: brightness(0) invert(1); }
.curtain-name { font-size: 12px; letter-spacing: .32em; margin: 27px 0 8px; padding-left: .32em; }
.curtain-descriptor { font-size: 8px; letter-spacing: .46em; color: #999; padding-left: .46em; }
.curtain-rule { width: 42px; height: 1px; margin-top: 30px; background: #bdbdbd; transform-origin: center; }
.transition-leaving .page-curtain, .transition-arriving .page-curtain { visibility: visible; opacity: 1; pointer-events: auto; }
@media (prefers-reduced-motion: no-preference) {
  .transition-leaving .page-curtain { animation: curtain-cover 220ms ease-out both; }
  .transition-leaving .curtain-brand { animation: curtain-brand-in 480ms 120ms cubic-bezier(.22,1,.36,1) both; }
  .transition-leaving .curtain-rule { animation: curtain-rule-in 450ms 240ms cubic-bezier(.22,1,.36,1) both; }
  .transition-arriving .page-curtain { animation: curtain-uncover 650ms 80ms cubic-bezier(.76,0,.24,1) both; }
  .transition-arriving .curtain-brand { animation: curtain-brand-out 300ms ease-in both; }
  @keyframes curtain-cover { from { opacity: 0; } to { opacity: 1; } }
  @keyframes curtain-brand-in { from { opacity: 0; transform: translateY(10px) scale(.97); filter: blur(5px); } to { opacity: 1; transform: none; filter: blur(0); } }
  @keyframes curtain-rule-in { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  @keyframes curtain-uncover { from { clip-path: inset(0); } to { clip-path: inset(0 0 100% 0); } }
  @keyframes curtain-brand-out { to { opacity: 0; transform: translateY(-16px); } }
}
@media (prefers-reduced-motion: reduce), print { .page-curtain { display: none !important; } }
@media (prefers-reduced-motion: no-preference) {
  ::view-transition-old(root) { animation: ttg-out 160ms ease-out both; }
  ::view-transition-new(root) { animation: ttg-in 260ms ease-out both; }
  @keyframes ttg-out { to { opacity: 0; } }
  @keyframes ttg-in { from { opacity: 0; } to { opacity: 1; } }
  .button, .nav-contact { transition: background 240ms ease, color 240ms ease, transform 280ms cubic-bezier(.22,1,.36,1); }
  .arrow { transition: transform 300ms cubic-bezier(.22,1,.36,1); }
  .primary-navigation > a:not(.nav-contact)::after { transition: transform 300ms cubic-bezier(.22,1,.36,1); }
  .story-photo img, .work-photo img, .commercial-intro > img, .commercial-gallery > img { transition: filter 650ms ease, transform 850ms cubic-bezier(.22,1,.36,1); }
  .about-photo { overflow: hidden; }
  .about-photo img { transition: transform 900ms cubic-bezier(.22,1,.36,1); }
  input, textarea, select { transition: border-color 220ms ease, background-color 220ms ease; }
  input:focus, textarea:focus, select:focus { border-bottom-color: #101010; background-color: #00000003; }
  .button:focus-visible .arrow, .nav-contact:focus-visible .arrow { transform: translate(2px,-2px); }
  @media (hover: hover) and (pointer: fine) {
    .button:hover .arrow, .nav-contact:hover .arrow { transform: translate(2px,-2px); }

  }
  @media (max-width: 760px) {
    .primary-navigation.is-open { animation: ttg-menu 240ms ease-out both; }
    @keyframes ttg-menu { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
  }
}
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
  .button:hover, .text-link:hover .arrow, .story-photo:hover img { transform: none; }
}

.work-photo { overflow: hidden; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .site-header, .menu-lines::before, .menu-lines::after, .js .primary-navigation, .arrow { transition: none !important; }
}

/* A compact header with a spacious, independent mobile dropdown. */
html { scrollbar-gutter: stable; }
:root { --header-height: 105px; }
.site-header {
  background: transparent;
  border-bottom-color: transparent;
  transition: background-color 280ms ease, border-color 280ms ease;
}
.page-home .site-header { margin-bottom: calc(-1 * var(--header-height)); }
.site-header.is-scrolled {
  background: rgb(16 16 16 / 72%);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  backdrop-filter: blur(18px) saturate(130%);
  border-bottom-color: rgb(255 255 255 / 10%);
}
.menu-open .site-header { background: #101010; }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .site-header.is-scrolled { background: rgb(16 16 16 / 94%); }
}
@media (max-width: 1100px) { :root { --header-height: 87px; } }
@media (max-width: 375px) { :root { --header-height: 81px; } }
.menu-backdrop { position: fixed; inset: 0; z-index: 25; background: #0009; backdrop-filter: blur(3px); }
@media (max-width: 1100px) {
  /* Lock the viewport only: locking body creates a new scroll container and
     pulls the sticky header offscreen when the page is already scrolled. */
  .menu-open { overflow: hidden; }
  .js .nav-wrap { flex-wrap: nowrap; }
  .js .menu-toggle { min-width: 72px; min-height: 44px; justify-content: flex-end; gap: 12px; }
  .js .menu-lines, .js .menu-toggle[aria-expanded=true] .menu-lines { position: relative; width: 20px; height: 16px; border: 0; transform: none; }
  .menu-lines::before, .menu-lines::after { content: ''; position: absolute; left: 0; width: 20px; height: 1px; background: currentColor; transition: transform 240ms ease, top 240ms ease; }
  .menu-lines::before { top: 4px; }
  .menu-lines::after { top: 11px; }
  .menu-toggle[aria-expanded=true] .menu-lines::before { top: 7px; transform: rotate(45deg); }
  .menu-toggle[aria-expanded=true] .menu-lines::after { top: 7px; transform: rotate(-45deg); }
  .js .primary-navigation, .js .primary-navigation.is-open {
    position: absolute; top: 100%; left: 0; right: 0;
    display: flex; flex-direction: column; align-items: stretch; gap: 0;
    width: 100%; padding: 12px var(--gutter) 30px; background: #101010;
    border-bottom: 1px solid #353535;
    max-height: calc(100dvh - 90px); overflow-y: auto; overscroll-behavior: contain;
    animation: none; opacity: 0; visibility: hidden; transform: translateY(-8px); pointer-events: none;
    transition: opacity 220ms ease, transform 260ms cubic-bezier(.22,1,.36,1), visibility 220ms;
  }
  .js .primary-navigation.is-open { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
  .primary-navigation > a { min-height: 72px; padding: 18px 0; font-size: 26px; font-weight: 500; letter-spacing: -.035em; border-bottom: 1px solid #303030; justify-content: space-between; }
  .primary-navigation > a:not(.nav-contact)::after { display: none; }
  .primary-navigation > a[aria-current=page]:not(.nav-contact) { color: #fff; }
  .primary-navigation > a[aria-current=page]:not(.nav-contact)::before { content: ''; position: absolute; right: 4px; width: 5px; height: 5px; border-radius: 50%; background: #eee; }
  .primary-navigation > a:not([aria-current]):not(.nav-contact) { color: #aaa; }
  .primary-navigation > a:not(.nav-contact):hover { color: #fff; }
  .primary-navigation > .nav-contact { margin-top: 26px; min-height: 54px; padding: 15px 19px; border: 0; background: #f5f5f1; color: #101010; font-size: 13px; font-weight: 600; letter-spacing: 0; }
  .primary-navigation > .nav-contact:hover { background: #ddd; }
  .primary-navigation > a:focus-visible { outline-offset: 3px; }
}
@media (prefers-reduced-motion: reduce) { .menu-backdrop { backdrop-filter: none; } }
@media print { .menu-backdrop { display: none; } }

/* Shared social link stays visible beside the mobile menu. */
.header-instagram { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: none; color: #f5f5f1; margin-left: auto; transition: opacity 180ms ease; }
.header-instagram:hover { opacity: .7; }
@media (min-width: 1101px) {
  .primary-navigation { margin-left: 0; }
}
@media (max-width: 1100px) {
  .js .nav-wrap { column-gap: 12px; }
  .header-instagram { width: 40px; }
}
@media (max-width: 375px) {
  .js .nav-wrap { column-gap: 6px; }
  .js .menu-toggle { min-width: 64px; gap: 8px; }
}

/* Do not interpolate backdrop blur while the mobile viewport is scrolling. */
@media (max-width: 1100px), (pointer: coarse) {
  .site-header { transition: background-color 200ms ease, border-color 200ms ease; }
}

/* Home: expansive photography, a short message, and one clear action. */
.hero.hero-cinematic {
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: end;
  width: 100%;
  height: min(1005px, 100svh);
  min-height: 775px;
  margin: 0;
  overflow: hidden;
  background: #101010;
  grid-template-columns: 1fr;
}
.cinematic-photo { position: absolute; inset: 0 0 0 22%; z-index: -3; mask-image: linear-gradient(90deg, transparent, #000 22%); }
.cinematic-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; filter: grayscale(1); }
.cinematic-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, #101010 0%, #101010ed 17%, #1010109c 35%, #10101008 68%), linear-gradient(0deg, #101010b8, transparent 65%); }
.cinematic-content { padding-block: 185px 66px; }
.hero-cinematic::after { content: ''; position: absolute; inset: 0 0 auto; height: 170px; z-index: -1; pointer-events: none; background: linear-gradient(#0007, transparent); }
.hero-cinematic .hero-copy { display: block; padding: 0; max-width: 760px; }
.hero-cinematic .eyebrow { font-size: 9px; letter-spacing: .22em; color: #d7d7d2; }
.hero-cinematic h1 { font-size: clamp(80px, 9.6vw, 148px); line-height: .88; letter-spacing: -.065em; margin: 29px 0 26px; color: #fff; }
.hero-cinematic .hero-description { font-size: 16px; line-height: 1.6; color: #d3d3cf; max-width: 300px; }
.hero-cinematic .hero-actions { margin-top: 27px; }
.hero-cinematic .button { min-width: 190px; min-height: 56px; padding: 17px 24px; font-size: 13px; }
@media (max-width: 1100px) and (min-width: 761px) {
  .hero.hero-cinematic { min-height: 725px; }
  .cinematic-photo { left: 12%; }
  .cinematic-shade { background: linear-gradient(90deg, #101010eb, #10101090 38%, #10101010 75%), linear-gradient(0deg, #101010b8, transparent 70%); }
}
@media (max-width: 760px) {
  .hero.hero-cinematic { min-height: 737px; height: min(937px, 100svh); gap: 0; }
  .cinematic-photo { inset: 0; mask-image: none; }
  .cinematic-photo img { object-position: 51% 0; }
  .cinematic-shade { background: linear-gradient(0deg, #101010 0%, #101010f0 16%, #101010a6 39%, #1010100a 73%); }
  .cinematic-content { padding-block: 347px 38px; }
  .hero-cinematic .hero-copy { padding: 0; }
  .hero-cinematic .eyebrow { font-size: 8px; letter-spacing: .14em; }
  .hero-cinematic h1 { font-size: clamp(54px, 15.3vw, 106px); margin: 22px 0 20px; line-height: .9; }
  .hero-cinematic .hero-description { font-size: 14px; }
  .hero-cinematic .hero-actions { margin-top: 23px; }
  .hero-cinematic .button { min-width: 180px; padding: 16px 23px; }
}
@media (prefers-reduced-motion: no-preference) {
  .cinematic-photo img { animation: hero-image-settle 1600ms cubic-bezier(.22,1,.36,1) both; }
  @keyframes hero-image-settle { from { transform: scale(1.035); opacity: .65; } to { transform: scale(1); opacity: 1; } }
}
@media print { .hero.hero-cinematic { height: auto; min-height: 0; }.cinematic-photo,.cinematic-shade { display: none; }.cinematic-content { padding: 25px 0; }.hero-cinematic h1,.hero-cinematic .hero-description,.hero-cinematic .eyebrow { color: #111; } }

@media (max-width: 760px) {
  .hero-cinematic h1 { font-size: clamp(46px, 14.3vw, 100px); line-height: .98; }
  .hero-cinematic h1 .outline-text { display: inline-block; white-space: nowrap; }
}

/* Avoid repainting a large transformed photograph during touch scrolling. */
@media (max-width: 760px), (pointer: coarse) {
  .cinematic-photo, .cinematic-photo img { animation: none !important; transform: none !important; }
}

/* Paul's September review: shared typography and editorial pages. */
:root { --body-font: Arial, Helvetica, sans-serif; --display-font: Arial, Helvetica, sans-serif; }
.brand-name, .brand-name span { font-size: 11px; letter-spacing: .14em; }
.brand-name span { margin-top: 5px; }
.curtain-name, .curtain-descriptor { font-size: 12px; letter-spacing: .18em; }
.hero-cinematic .eyebrow, .hero-cinematic .hero-description { font-family: var(--body-font); font-size: 15px; font-weight: 400; line-height: 1.6; letter-spacing: .015em; }
.hero-cinematic .eyebrow { max-width: 340px; }
.intro-text > p, .intro-text > p + p { font-size: 18px; line-height: 1.8; font-weight: 400; color: #4b4b46; }
.about-hero h1 { font-weight: 400; }
.about-hero h1 strong { font-weight: 700; }
.about-story > div:first-child { text-align: center; }
.about-emblem { margin-inline: auto; }
.cinematic-photo { left: 40%; mask-image: linear-gradient(90deg, transparent, #000 24%); }
.cinematic-photo img { object-position: 50% 54%; }
.primary-navigation { gap: 24px; white-space: nowrap; }
.arrow { flex-shrink: 0; vertical-align: middle; }
.editorial-hero { padding-block: 76px 70px; }
.editorial-hero h1 { font-size: clamp(38px, 4.7vw, 70px); line-height: 1.08; font-weight: 500; max-width: 1100px; margin-top: 28px; }
.work-list { padding-bottom: 70px; }
.work-row { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(35px,6vw,90px); align-items: center; padding-block: 60px; border-top: 1px solid #353535; }
.work-photo img { width: 100%; aspect-ratio: 1.12; object-fit: cover; object-position: center 25%; filter: grayscale(1); }
.work-copy h2 { margin: 22px 0; font-size: clamp(32px,3.8vw,54px); }
.work-copy > p:last-child { font-size: 16px; line-height: 1.85; color: #c1c1bc; }
.commercial-intro { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(35px,6vw,90px); align-items: center; padding-bottom: 90px; }
.commercial-intro img { width: 100%; aspect-ratio: 1; object-fit: cover; filter: grayscale(1); }
.commercial-intro p { font-size: clamp(19px,2vw,27px); line-height: 1.65; }
.commercial-story { display: grid; grid-template-columns: 1fr 2fr; gap: 60px; }
.commercial-story p:not(.eyebrow) { font-size: 18px; line-height: 1.85; }
.commercial-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; padding-block: 80px; align-items: start; }
.commercial-gallery img { width: 100%; height: auto; filter: grayscale(1); }
@media (max-width:1100px) {
  .js .menu-toggle { display:inline-flex; align-items:center; color:var(--paper); background:none; border:0; padding:0 4px; font-size:10px; }
  .js .nav-wrap { min-height: 87px; }
  .primary-navigation { white-space: normal; }
  .cinematic-photo { left: 26%; }
}
@media (max-width:760px) {
  .brand-name, .brand-name span { font-size: 10px; }
  .brand-mark { width: 48px; height: 37px; }
  .brand { gap: 10px; }
  .cinematic-photo { inset: 0; mask-image: none; }
  .cinematic-photo img { object-position: 50% 47%; }
  .hero-cinematic .eyebrow, .hero-cinematic .hero-description { font-size: 13px; }
  .intro-text > p, .intro-text > p + p { font-size: 16px; }
  .editorial-hero { padding-block: 42px; }
  .editorial-hero h1 { font-size: clamp(32px,8.4vw,54px); margin-top: 24px; }
  .work-row, .commercial-intro, .commercial-story, .commercial-gallery { grid-template-columns: 1fr; gap: 28px; }
  .work-row { padding-block: 35px; }
  .work-copy h2 { margin-block: 16px; }
  .commercial-intro { padding-bottom: 55px; }
  .commercial-story p:not(.eyebrow) { font-size: 16px; }
  .commercial-gallery { padding-block: 45px; }
  .footer-links { gap: 8px; }
}
@media (max-width:375px) {
  .brand-mark { width:40px; }
  .header-instagram { width:32px; }
  .js .menu-toggle { min-width:56px; }
}

/* Shared photographic interaction and type scale for every page. */
:root {
  --type-page: clamp(39px, 4.7vw, 70px);
  --type-section: clamp(32px, 3.8vw, 54px);
  --type-card: clamp(22px, 2vw, 28px);
  --type-body: 18px;
  --type-label: 10px;
}
.about-hero h1, .contact-copy h1, .editorial-hero h1 {
  font-size: var(--type-page); line-height: 1.06; letter-spacing: -.055em; font-weight: 400;
}
.about-hero h1 strong { font-weight: 700; }
h2, .focus-heading h2, .purpose-grid h2, .work-copy h2, .closing-cta h2 {
  font-size: var(--type-section); line-height: 1.1; letter-spacing: -.05em; font-weight: 600;
}
.principle-row h3, .focus-list h3 { font-size: var(--type-card); line-height: 1.2; font-weight: 500; }
.intro-text > p, .intro-text > p + p, .about-body p, .about-body p.lead,
.focus-heading > p:not(.eyebrow), .purpose-grid p, .work-copy > p:last-child,
.commercial-intro p, .commercial-story p:not(.eyebrow),
.about-hero .hero-description, .contact-copy .hero-description, .quote-card blockquote,
.principle-row p {
  font-size: var(--type-body); line-height: 1.8; letter-spacing: 0;
}
.eyebrow, .story-heading .eyebrow, .closing-cta .eyebrow, .about-wide-caption .eyebrow,
.contact-panel .eyebrow { font-size: var(--type-label); line-height: 1.7; letter-spacing: .16em; }
/* The home headline and its matching supporting lines retain their own scale. */
.hero-cinematic .eyebrow, .hero-cinematic .hero-description { font-size: 15px; letter-spacing: .015em; line-height: 1.6; }
.contact-panel h2 { font-size: 32px; line-height: 1.1; }
.form-intro, .draft-result p, .direct-email { font-size: 14px; line-height: 1.7; }
.contact-panel label { font-size: 13px; }
.contact-panel input, .contact-panel textarea, .contact-panel select { font-size: 16px; }
.photo-frame { display: block; overflow: hidden; }
.photo-frame img { filter: grayscale(1); scale: 1; }
.commercial-intro > .photo-frame { min-width: 0; }
.commercial-gallery > .photo-frame { width: 100%; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .photo-frame img { transition: filter 650ms ease, scale 850ms cubic-bezier(.22,1,.36,1); }
  .photo-frame:hover img, .hero-cinematic:hover .cinematic-photo img { filter: grayscale(0); scale: 1.025; }
  .brand-mark, .about-emblem { transition: opacity 300ms ease; }
  .brand:hover .brand-mark, .about-emblem:hover { opacity: .75; }
}
@media (max-width:760px) {
  :root { --type-page: clamp(43px,8.8vw,65px); --type-section: 36px; --type-card: 22px; --type-body: 16px; }
  .hero-cinematic .eyebrow, .hero-cinematic .hero-description { font-size: 13px; }
  .focus-list { min-width: 0; }
  .focus-list h3 { font-size: 20px; }
}
@media (max-width:375px) {
  :root { --type-page: 39px; --type-section: 32px; --type-card: 21px; }
}
@media (prefers-reduced-motion: reduce), (hover: none), (pointer: coarse) {
  .photo-frame img { transition: none; scale: 1; }
}

/* One shared inner-page hero treatment, with the home masthead kept distinct. */
.about-hero h1, .contact-copy h1, .editorial-hero h1 {
  font-family: var(--display-font); font-weight: 400; line-height: 1.06; letter-spacing: -.055em;
}
.about-hero h1 strong { font-weight: 700; }
.page-hero-intro { max-width: 620px; margin-top: 28px; font-size: var(--type-body); line-height: 1.8; color: #bdbdb7; }
.partnership-heading { min-width: 0; }
@media (max-width:350px) { :root { --type-page: 37px; } }

/* Keep the introductory About paragraph the same ink as its body copy. */
.about-body p.lead { color: #4b4b46; }

/* Keep the image statement on three deliberate lines, even on small phones. */
.about-wide-caption { right:25px; }
.about-wide-caption .caption-line { white-space:nowrap; }
@media (max-width:760px) {
  .about-wide-caption > p:last-child { font-size:clamp(20px,6.4vw,27px); }
}

/* Mobile colour reveal changes only the filter, never photo position or size. */
@media (max-width:760px), (hover:none), (pointer:coarse) {
  .photo-frame img { transition:filter 1100ms ease; }
  .photo-frame img.is-colour-revealed { filter:grayscale(0); }
}
@media (prefers-reduced-motion:reduce) {
  .photo-frame img { transition:none; }
}

.inline-content-link { color:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.2em; }
.inline-content-link:focus-visible { outline:2px solid currentColor; outline-offset:4px; }

/* Make existing content navigable without adding buttons or changing the grid. */
.inline-page-link { text-decoration: underline; text-decoration-color: #99998f; text-underline-offset: .2em; }
.inline-page-link:hover { text-decoration-color: currentColor; }
.focus-list > div { position: relative; grid-template-columns: minmax(0, 1fr) auto; }
.focus-page-link::after { content: ''; position: absolute; inset: 0; }
.focus-page-link:focus-visible { outline: none; }
.focus-list > div:has(.focus-page-link:focus-visible) { outline: 2px solid currentColor; outline-offset: 4px; }
.focus-page-link:hover { text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1px; }
.story-page-link { display: block; min-width: 0; }
.story-page-link figcaption { text-decoration: underline; text-underline-offset: .25em; text-decoration-color: #777; }
.story-page-link:hover figcaption { text-decoration-color: currentColor; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
 .focus-list > div:hover .arrow { transform: translate(2px,-2px); }
 .story-page-link:hover .photo-frame img, .story-page-link:focus-visible .photo-frame img { filter: grayscale(0); scale: 1.025; }
}
