:root{--ink:#121313;--paper:#f2f2ef;--muted:#a4a6a2;--blue:#007fff;--line:rgba(18,19,19,.16);--max:1440px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",Arial,sans-serif;font-size:16px;line-height:1.55}
a{color:inherit;text-decoration:none}
.site-header{height:84px;position:absolute;inset:0 0 auto;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,4vw,68px);color:white;border-bottom:1px solid rgba(255,255,255,.25)}
.brand{display:inline-flex;align-items:center;gap:14px;font-family:"Manrope",sans-serif;font-size:1rem;letter-spacing:.13em;font-weight:600;white-space:nowrap}.brand b{font-weight:400;color:#b8bab8}
.brand-mark{width:31px;height:31px;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;transform:skewY(-12deg)}.brand-mark i{background:var(--blue)}.brand-mark i:nth-child(2){height:72%}.brand-mark i:nth-child(3){height:44%}
nav{display:flex;align-items:center;gap:clamp(24px,3vw,52px);font-size:.9rem}nav a{opacity:.83;transition:.2s}nav a:hover,nav a:focus-visible{opacity:1}.nav-cta{border-left:1px solid rgba(255,255,255,.25);padding-left:clamp(24px,3vw,52px)}
.menu-button{display:none;background:none;border:0;color:white;padding:8px}.menu-button span{display:block;width:24px;height:1px;background:white;margin:5px}.menu-button em{position:absolute;clip:rect(0 0 0 0)}
.hero{height:min(900px,100vh);min-height:700px;position:relative;overflow:hidden;color:white;background:#202221}.hero-image{position:absolute;inset:0;background:url("assets/fides-hero.webp") center/cover no-repeat;transform:scale(1.01)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,10,10,.88) 0%,rgba(8,10,10,.55) 39%,rgba(8,10,10,.08) 72%),linear-gradient(0deg,rgba(8,10,10,.62),transparent 45%)}
.hero-grid,.contact-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(90deg,#000,transparent 60%)}
.hero-copy{position:relative;z-index:2;max-width:850px;padding:clamp(165px,23vh,230px) clamp(24px,8vw,128px) 80px}.eyebrow{display:flex;align-items:center;gap:14px;text-transform:uppercase;letter-spacing:.18em;font-size:.73rem;font-weight:600}.eyebrow span{color:var(--blue)}
h1,h2,h3,p{margin-top:0}.hero h1{font-family:"Manrope",sans-serif;font-weight:500;font-size:clamp(4.2rem,9vw,8.7rem);line-height:.86;letter-spacing:-.068em;margin:36px 0 38px}.hero h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.8)}.hero-intro{max-width:560px;color:#dadbd8;font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.55}
.primary-button,.contact-button{margin-top:22px;display:inline-flex;align-items:center;gap:60px;background:var(--blue);padding:18px 22px;font-weight:600;font-size:.92rem;transition:.25s}.primary-button:hover,.contact-button:hover{background:#2792ff;gap:72px}
.scroll-cue{position:absolute;z-index:2;left:clamp(24px,4vw,68px);bottom:42px;display:flex;align-items:center;gap:15px;text-transform:uppercase;font-size:.68rem;letter-spacing:.18em}.scroll-cue i{height:42px;width:1px;background:white;display:block}
.section{max-width:var(--max);margin:auto;padding:110px clamp(24px,7vw,108px)}.section-label{text-transform:uppercase;letter-spacing:.17em;font-size:.72rem;font-weight:600}.section-label span{color:var(--blue);margin-right:18px}
.statement{display:grid;grid-template-columns:1fr 3fr;gap:50px}.statement-body h2,.company h2{font-family:"Manrope",sans-serif;font-size:clamp(2.4rem,4.8vw,5rem);line-height:1.06;letter-spacing:-.055em;font-weight:500;max-width:930px;margin-bottom:48px}.statement-body p{font-size:1.2rem;color:#555856;max-width:720px;margin-left:auto}
.services{padding-top:0;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line)}.service-card{background:var(--paper);min-height:360px;padding:42px;display:grid;grid-template-columns:auto 1fr auto;gap:32px;position:relative}.service-card.featured{background:var(--ink);color:white}.service-number{color:var(--blue);font-family:"Manrope"}.service-card div{align-self:end}.service-card h3{font-family:"Manrope";font-size:clamp(1.75rem,3vw,3rem);line-height:1.06;letter-spacing:-.04em;font-weight:500;margin-bottom:18px}.service-card p{color:#7c7f7b;max-width:440px}.featured p{color:#b6b8b4}.service-arrow{font-size:1.8rem;transition:.25s}.service-card:hover .service-arrow{transform:translate(5px,-5px)}
.approach{max-width:none;background:var(--ink);color:white;display:grid;grid-template-columns:1fr 3fr;padding-left:max(clamp(24px,7vw,108px),calc((100vw - var(--max))/2 + 108px));padding-right:max(clamp(24px,7vw,108px),calc((100vw - var(--max))/2 + 108px));gap:50px}.light{color:white}.approach-heading>p{color:var(--blue);text-transform:uppercase;letter-spacing:.14em;font-size:.75rem}.approach-heading h2{font-family:"Manrope";font-size:clamp(3rem,6.5vw,6.4rem);line-height:.94;letter-spacing:-.06em;font-weight:500;margin-bottom:80px}.process-list{grid-column:2;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #414340}.process-list article{padding:35px 30px 20px 0;border-right:1px solid #414340;margin-right:30px}.process-list article:last-child{border:0;margin:0}.process-list span{color:var(--blue);font-size:.75rem}.process-list h3{font-family:"Manrope";font-size:1.5rem;font-weight:500;margin:32px 0 16px}.process-list p{color:#aeb0ad;font-size:.95rem}
.company{display:grid;grid-template-columns:1fr 3fr;gap:50px}.wordmark{font-family:"Manrope";font-size:clamp(5rem,14vw,13rem);line-height:.8;letter-spacing:-.09em;color:transparent;-webkit-text-stroke:1px #c9cac6;margin-bottom:75px}.company-columns{display:grid;grid-template-columns:1fr 1fr;gap:55px;border-top:1px solid var(--line);padding-top:35px}.company-columns p{font-size:1.05rem;color:#565956}
.contact{max-width:none;position:relative;overflow:hidden;background:var(--blue);padding-left:max(clamp(24px,12vw,180px),calc((100vw - var(--max))/2 + 108px));color:white}.contact-grid{opacity:.24;mask-image:linear-gradient(90deg,transparent,#000)}.contact>*:not(.contact-grid){position:relative}.contact .eyebrow span{color:#101c39}.contact h2{font-family:"Manrope";font-size:clamp(4rem,9vw,8rem);line-height:.88;letter-spacing:-.065em;font-weight:500;margin:45px 0}.contact>p:not(.eyebrow){font-size:1.18rem;max-width:530px}.contact-form{margin-top:52px;max-width:920px;display:grid;grid-template-columns:1fr 1fr;gap:24px 40px}.contact-form label{display:block}.contact-form label>span{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.78)}.contact-form input,.contact-form textarea,.contact-form select{width:100%;color:white;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.55);border-radius:0;padding:12px 0;outline:none;resize:vertical}.contact-form select{appearance:none;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,white 50%),linear-gradient(135deg,white 50%,transparent 50%);background-position:calc(100% - 10px) 50%,calc(100% - 5px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}.contact-form select option{color:var(--ink);background:white}.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{border-color:white}.contact-form .wide{grid-column:1/-1}.contact-form button{grid-column:2;justify-self:end;display:flex;align-items:center;gap:28px;border:0;border-bottom:1px solid white;color:white;background:transparent;padding:12px 0;cursor:pointer;text-transform:uppercase;font-size:.78rem;font-weight:600;letter-spacing:.12em}.contact-form button:disabled{opacity:.55;cursor:wait}.form-honey{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}.form-status{min-height:24px;margin:0;color:rgba(255,255,255,.78)}.form-status.success{color:white}.form-status.error{color:#fff0b8}
footer{background:#0b0c0c;color:#b1b3b0;padding:50px clamp(24px,4vw,68px);display:grid;grid-template-columns:1fr 1fr auto;align-items:center;gap:30px;font-size:.83rem}footer .footer-brand{color:white}footer>a:not(.brand){color:white}footer small{grid-column:1/-1;border-top:1px solid #2c2e2d;padding-top:25px}
@media(max-width:800px){.site-header{height:72px}.brand b{display:none}.menu-button{display:block;z-index:2}nav{position:absolute;top:0;left:0;right:0;padding:98px 24px 30px;background:#121313;display:none;flex-direction:column;align-items:flex-start;gap:23px}nav.open{display:flex}.nav-cta{border:0;padding:0;color:var(--blue)}.hero{min-height:680px}.hero-copy{padding-top:165px}.hero h1{font-size:clamp(4rem,18vw,6rem)}.statement,.company,.approach{grid-template-columns:1fr}.statement-body,.company-copy,.approach-heading,.process-list{grid-column:1}.section{padding-top:78px;padding-bottom:78px}.services{grid-template-columns:1fr}.service-card{grid-column:auto;min-height:290px;padding:30px 24px}.process-list{grid-template-columns:1fr}.process-list article{border-right:0;border-bottom:1px solid #414340;margin:0;padding:28px 0}.company-columns{grid-template-columns:1fr;gap:12px}.wordmark{margin:15px 0 55px}.contact{padding-top:90px;padding-bottom:90px}.contact h2{font-size:clamp(3.8rem,19vw,6rem)}.contact-form{grid-template-columns:1fr}.contact-form .wide,.contact-form button{grid-column:1}.contact-form button{justify-self:start}footer{grid-template-columns:1fr;align-items:start}footer small{grid-column:1}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
