@font-face{font-family:Montserrat;src:url('./assets/Montserrat.ttf') format('truetype');font-weight:100 900;font-display:swap}

:root{--bg:#0a0b0d;--text:#f4f3ef;--muted:#aaa9a6;--gold:#edc279;--line:#ffffff19;--gutter:clamp(24px,5.8vw,100px);font-family:Montserrat,Arial,sans-serif;font-synthesis:none;color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-snap-type:y mandatory}
body{margin:0;background:var(--bg);color:var(--text);font-size:16px;line-height:1.7;overflow-x:clip}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit;color:inherit}
button{border:0;cursor:pointer}
a,button{touch-action:manipulation}
a,button,input,textarea{-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
button:disabled{cursor:default;opacity:.55}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
::selection{background:#997139;color:white}
.page-width{width:min(calc(100% - var(--gutter)*2),1400px);margin-inline:auto}
.skip-link{position:fixed;top:-80px;left:20px;background:var(--gold);color:#111;padding:12px 20px;z-index:200}
.skip-link:focus{top:10px}
.reading-progress{position:fixed;top:0;left:0;height:2px;background:var(--gold);width:0;z-index:110}
.site-header{height:84px;padding-inline:var(--gutter);position:fixed;inset:0 0 auto;z-index:100;display:flex;align-items:center;justify-content:space-between;isolation:isolate;background:#08090a;border-bottom:1px solid #caa46526;box-shadow:0 8px 24px #0003}
.site-header:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(90deg,#08090ae8,#08090af2),url('./assets/card-background.webp');background-size:cover;background-position:center 48%}
.site-header:after{content:'';position:absolute;inset:auto 12% -1px;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,#d8b77328,transparent)}
.brand{width:227px;flex-shrink:0}
.desktop-nav{display:flex;gap:30px;font-size:13px;margin-left:auto;margin-right:52px}
.desktop-nav a{color:#c6c5c2;display:flex;align-items:center;min-height:44px}
.desktop-nav a:hover{color:var(--gold)}
.header-actions{display:flex;align-items:center;gap:22px}
.language-switch{display:flex;align-items:center;gap:9px;font-size:12px}
.language-switch a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;background:none;padding:12px 2px;color:#aaa}
.language-switch a[aria-current=true]{color:var(--gold)}
.language-switch>span{color:#59595a}
.menu-toggle{display:none;background:none;width:29px;padding:4px 0}
.menu-toggle span{display:block;height:1px;background:#ddd;margin:7px 0}
.mobile-nav{position:absolute;inset:83px 0 auto;padding:20px var(--gutter);background:#111214;border-bottom:1px solid #333}
.mobile-nav a{display:block;padding:13px 0}
.slide-nav{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;gap:12px}
.slide-nav a{display:flex;align-items:center;justify-content:flex-end;gap:8px;height:24px;position:relative}
.slide-nav span{font-size:9px;opacity:0;color:var(--gold)}
.slide-nav i{width:4px;height:4px;border:1px solid #777;border-radius:50%}
.slide-nav b{font-size:12px;font-weight:400;white-space:nowrap;background:#191a1d;padding:4px 10px;position:absolute;right:34px;opacity:0;pointer-events:none;transition:opacity .2s}
.slide-nav a:hover b,.slide-nav a:focus-visible b{opacity:1}
.slide-nav a.active span{opacity:1}
.slide-nav a.active i{width:6px;height:6px;background:var(--gold);border-color:var(--gold)}
.slide{position:relative;min-height:100svh;height:auto;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;isolation:isolate;background:#0a0b0d;border-bottom:0;overflow:clip}
.slide:nth-child(even){background:#0a0b0d}
/* One subdued business-card texture across the existing sections. */
.slide::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(90deg,rgba(10,11,13,.28),rgba(10,11,13,.08)),url('./assets/card-background.webp');background-size:cover;background-position:center;opacity:.46}
.hero-grid{display:grid;grid-template-columns:.93fr 1.07fr;gap:30px;align-items:center;padding-block:130px 115px;min-height:max(740px,100svh)}
.hero-content{position:relative;z-index:2}
.eyebrow{font-size:11px;letter-spacing:2px;line-height:1.8;font-weight:500;color:var(--gold);display:flex;align-items:center;gap:20px;margin:0 0 26px;text-transform:uppercase}
.hero .eyebrow{font-size:10px;letter-spacing:1.7px}
.hero h1{font-size:clamp(47px,5.2vw,80px);line-height:1.11;letter-spacing:-3.5px;font-weight:500;margin:0 0 29px}
.gold-text{color:var(--gold);background:linear-gradient(120deg,#ffe0a0,#d7a550);background-clip:text;-webkit-text-fill-color:transparent}
.hero-description{font-size:17px;color:#aaa9a7;max-width:415px;line-height:1.9;margin:0 0 32px}
.hero-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap}
.button{min-height:50px;padding:14px 23px;display:inline-flex;align-items:center;justify-content:center;border-radius:3px;font-size:13px;line-height:1.6;font-weight:600;transition:background .2s,transform .2s}
.button-gold{background:linear-gradient(115deg,#f4d497,#ddb265);color:#1e1810}
.button-gold:hover{transform:translateY(-2px);background:linear-gradient(115deg,#ffe3af,#e9bf77)}
.text-link{font-size:13px;display:inline-block;padding:6px 0;border-bottom:1px solid #6c665a;color:#d5cec1}
.text-link:hover{color:var(--gold)}
.brand-signature{display:flex;align-items:center;gap:12px;font-size:9px;letter-spacing:2.4px;color:#b1ada5;margin-top:45px}
.brand-signature i{width:3px;height:3px;background:var(--gold);border-radius:50%}
.hero-visual{position:relative;min-width:0;height:clamp(420px,42vw,570px);perspective:1000px}
.scene{position:absolute;inset:0 0 32px;pointer-events:none}
.scene-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.scene-fallback img{display:block;width:100%;height:100%;object-fit:contain}
.scene-fallback{transform-origin:50% 50%;will-change:transform}
.scene-fallback img{filter:drop-shadow(0 15px 28px #0003)}
.visual-caption{position:absolute;inset:auto 0 0;text-align:center;font-size:9px;letter-spacing:2px;color:#87837b}
.slide-bottom{position:absolute;inset:auto 0 48px;display:flex;justify-content:space-between;align-items:center;gap:30px}
.micro,.next-slide,.scroll-cue{font-size:10px;letter-spacing:1.5px;color:#969188;line-height:1.6}
.scroll-cue{display:flex;align-items:center;gap:15px;font-size:9px}
.scroll-cue i{width:1px;height:27px;background:#65605a;position:relative;overflow:hidden}
.scroll-cue i:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent,#e8c98c,transparent);animation:scroll 3s infinite}
.next-slide:hover{color:var(--gold)}
.slide-content{padding-block:145px 135px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(65px,9vw,150px)}
.service-copy{min-width:0;max-width:470px}
.slide h2{font-size:clamp(38px,4.2vw,66px);line-height:1.13;letter-spacing:-2px;font-weight:500;margin:0 0 25px}
.section-lead{font-size:clamp(22px,2vw,30px);line-height:1.4;letter-spacing:-.45px;margin:0 0 23px;color:#e4e2de}
.body-copy{font-size:16px;color:#a8a7a3;line-height:1.85;max-width:460px;margin:0 0 25px}
.service-cta{margin-top:17px}
.connection-content{padding-block:145px 140px;display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:center}
.connection-slide h2{font-size:clamp(37px,4vw,60px);line-height:1.2}
.connection-tabs{display:flex;max-width:480px;border-bottom:1px solid #4c4435;margin-top:35px}
.connection-tabs button{padding:12px 16px;background:none;border-bottom:1px solid transparent;margin-bottom:-1px;color:#928f89;font-size:12px;white-space:nowrap}
.connection-tabs button:first-child{padding-left:0}
.connection-tabs button[aria-selected=true]{border-color:var(--gold);color:var(--gold)}
#flow-description{font-size:14px;line-height:1.8;max-width:440px;color:#bcb7ab;min-height:76px;margin:21px 0 0}
.approach-content{padding-block:145px 145px}
.approach-slide h2{font-size:clamp(38px,4.1vw,62px);margin-bottom:60px}
.process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:55px}
.process-grid article{border-top:1px solid #827053;padding-top:22px}
.process-number{font-size:12px;letter-spacing:1px;color:var(--gold)}
.process-grid h3{font-size:23px;font-weight:450;line-height:1.4;margin:27px 0 18px}
.process-grid p{font-size:16px;color:#a8a7a3;line-height:1.85;max-width:330px;margin:0}
.contact-content{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(50px,8vw,130px);padding-block:140px 155px;align-items:center}
.contact-heading h2{font-size:clamp(42px,4.5vw,68px);line-height:1.13;letter-spacing:-2.5px}
.contact-heading .body-copy{max-width:340px}
.brief-form{max-width:640px;width:100%;padding:30px 34px;background:#131518;border:1px solid #333438;border-radius:5px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.brief-form label>span,.brief-form legend{font-size:13px;line-height:1.7;color:#d5d2ca}
.brief-form label{display:block}
.brief-form input:not([type=checkbox]),.brief-form textarea{width:100%;border:0;border-bottom:1px solid #55524a;background:#0e101233;padding:10px 0;font-size:16px;color:#fff;border-radius:0;line-height:1.65}
.brief-form textarea{resize:vertical;min-height:100px;max-height:250px;margin-top:5px}
.brief-form textarea::placeholder{color:#97938b;font-size:14px}
.brief-form fieldset{border:0;min-width:0;margin:25px 0;padding:0}
.brief-form legend{padding:0;margin-bottom:11px}
.service-choices{display:flex;gap:8px;flex-wrap:wrap}
.service-choices label{position:relative;cursor:pointer}
.service-choices input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0}
.service-choices label>span{display:block;padding:6px 11px;border:1px solid #56534b;font-size:12px;color:#bab5a8}
.service-choices input:checked+span{color:#ffe0a0;border-color:#c6a86c;background:#ae72221a}
.service-choices input:focus-visible+span{outline:2px solid var(--gold);outline-offset:3px}
.brief-form .consent{display:flex;gap:12px;align-items:flex-start;margin:21px 0}
.consent input{accent-color:#cba568;margin:5px 0 0;width:15px;height:15px;flex-shrink:0}
.brief-form .consent>span{font-size:12px;line-height:1.7;color:#aaa79e}
.form-actions{display:flex;gap:24px;align-items:center}
.privacy-note{font-size:12px;color:#aaa79c;line-height:1.7}
#form-status{font-size:13px;line-height:1.7;color:#e8cf9e;margin:0}
#form-status:not(:empty){margin-top:18px}
.honey-field{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
footer{position:absolute;inset:auto 0 40px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:11px;color:#96938c}
footer a{border-bottom:1px solid #716b5f;padding:5px 0}
.motion-toggle{position:fixed;left:14px;bottom:11px;background:#0a0b0da8;border:1px solid #ffffff10;z-index:60;padding:6px 9px;display:flex;gap:8px;align-items:center;color:#8f8b82;font-size:9px;letter-spacing:.5px;backdrop-filter:blur(7px)}
.pause-icon{width:7px;height:8px;border-left:2px solid #9b9587;border-right:2px solid #9b9587}
.motion-paused .pause-icon{border:0;border-left:6px solid #9b9587;border-top:4px solid transparent;border-bottom:4px solid transparent;height:0;width:0}
.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}
.noscript-note{position:fixed;bottom:0;inset-inline:0;background:#23190b;color:#ffe0a0;padding:20px;z-index:150;text-align:center}
@keyframes scroll{0%{transform:translateY(-100%)}
70%,100%{transform:translateY(100%)}
}

@media(max-width:1100px){.brand{width:195px}
.desktop-nav{gap:20px;margin-right:30px;font-size:12px}
.slide-content{gap:32px;grid-template-columns:.85fr 1.15fr}
.slide h2{font-size:40px}
.hero h1{font-size:58px}
.hero-visual{height:410px}
.connection-content{gap:40px}
.connection-tabs button{font-size:11px;padding-inline:13px}
.process-grid{gap:30px}
.contact-content{gap:45px}
.brief-form{padding:26px}
}

@media(max-width:900px) and (min-width:761px){.hero h1{font-size:47px;letter-spacing:-2.5px}
.hero .eyebrow{font-size:8px}
.hero-actions{gap:15px}
.hero-visual{height:360px}
.desktop-nav a:nth-child(2){display:none}
.slide-content{grid-template-columns:1fr;gap:44px}
.service-copy{max-width:640px}
.slide h2{font-size:48px}
.connection-content{grid-template-columns:1fr;gap:40px}
.contact-content{grid-template-columns:1fr;gap:30px}
.brief-form{max-width:none}
.contact-heading .body-copy{max-width:500px}
}

@media(max-width:760px){:root{--gutter:24px}
html{scroll-snap-type:y proximity}
.site-header{height:72px}
.brand{width:190px}
.desktop-nav{display:none}
.menu-toggle{display:block}
.mobile-nav{top:71px}
.header-actions{gap:16px}
.language-switch{gap:7px}
.slide-nav{right:7px;gap:7px}
.slide-nav a{width:12px;height:21px}
.slide-nav span,.slide-nav b{display:none}
.slide-nav i{width:3px;height:3px}
.slide-nav a.active i{width:5px;height:5px}
.slide{min-height:100svh;scroll-snap-stop:normal}
.hero-grid{grid-template-columns:1fr;gap:17px;padding-block:133px 130px;min-height:100svh}
.hero .eyebrow{font-size:9px;letter-spacing:1.3px;margin-bottom:23px}
.hero h1{font-size:clamp(43px,10vw,62px);letter-spacing:-2.6px;margin-bottom:25px}
.hero-description{font-size:16px;max-width:420px;line-height:1.9}
.hero-actions{gap:22px}
.hero-actions .button{font-size:12px;padding-inline:20px}
.brand-signature{margin-top:32px;font-size:8px;letter-spacing:2px;gap:10px}
.hero-visual{height:clamp(310px,90vw,460px);margin-top:12px}
.scene{inset:0 0 28px}
.visual-caption{font-size:8px;letter-spacing:1.8px;bottom:5px}
.slide-bottom{bottom:47px;gap:20px}
.micro,.next-slide{font-size:8px;letter-spacing:1px;max-width:48%}
.scroll-cue{font-size:8px;letter-spacing:1px;gap:12px}
.slide-content{grid-template-columns:1fr;padding-block:115px 135px;gap:43px}
.eyebrow{font-size:10px;letter-spacing:1.6px;gap:15px;margin-bottom:21px}
.slide h2{font-size:clamp(34px,8.8vw,50px);letter-spacing:-1.6px;margin-bottom:22px}
.section-lead{font-size:25px;line-height:1.4;margin-bottom:20px}
.body-copy{font-size:16px}
.connection-content{grid-template-columns:1fr;padding-block:120px 140px;gap:40px}
.connection-slide h2{font-size:clamp(34px,8vw,47px)}
.connection-tabs{margin-top:28px;justify-content:space-between}
.connection-tabs button,.connection-tabs button:first-child{font-size:10px;padding-inline:5px}
#flow-description{font-size:14px;min-height:65px}
.approach-content{padding-block:120px 140px}
.approach-slide h2{font-size:37px;margin-bottom:40px}
.process-grid{grid-template-columns:1fr;gap:25px}
.process-grid article{display:grid;grid-template-columns:28px 1fr;gap:10px 15px;padding-top:21px}
.process-grid h3{font-size:22px;margin:0}
.process-number{padding-top:5px}
.process-grid p{grid-column:2;font-size:15px;max-width:440px}
.contact-content{grid-template-columns:1fr;gap:24px;padding-block:118px 140px}
.contact-heading h2{font-size:44px}
.contact-heading .body-copy{max-width:500px;font-size:15px}
.brief-form{max-width:none;padding:23px 20px}
.form-row{grid-template-columns:1fr;gap:18px}
.brief-form fieldset{margin-block:23px}
.brief-form textarea{min-height:110px}
.form-actions{gap:18px}
.form-actions .button{font-size:12px;padding-inline:20px}
.privacy-note{font-size:11px}
footer{inset:auto 0 43px;font-size:9px;align-items:flex-start}
footer>span{max-width:220px}
footer a{white-space:nowrap}
.motion-toggle{left:8px;bottom:8px;font-size:8px;padding:5px 7px}
}

@media(max-width:380px){.site-header{padding-inline:16px}
.brand{width:156px}
.header-actions{gap:13px}
.hero h1{font-size:39px;letter-spacing:-2px}
.brand-signature{font-size:7px;letter-spacing:1.6px;gap:8px}
.hero .eyebrow{font-size:8px}
.hero-actions{gap:17px}
.hero-visual{height:300px}
.slide h2{font-size:32px}
.section-lead{font-size:23px}
.connection-slide h2{font-size:31px}
.contact-heading h2{font-size:38px}
.brief-form{padding:20px 16px}
.form-actions{gap:14px}
.form-actions .button{padding-inline:16px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{animation:none!important;transition:none!important}
}


/* Transparent illustrations sit in the page, without panels, captions or UI chrome. */
.brand{display:flex;align-items:center;position:relative;aspect-ratio:682.64185/78;min-height:0}

.brand>img{display:block;width:100%;height:auto}

.service-art{width:100%;max-width:560px;aspect-ratio:1;position:relative;margin:0;justify-self:center;display:grid;place-items:center;opacity:.96}

.service-art>img{display:block;width:100%;height:100%;object-fit:contain}

#automation-visual>img,.connection-art>img{padding:0}

.service-art.art-entered{animation:art-arrive 1.2s cubic-bezier(.2,.7,.2,1) both}

.service-art.art-visible>img{animation:art-drift 10s ease-in-out infinite alternate}

.connection-art{max-width:540px}

.service-slide .eyebrow{margin-bottom:34px}

.service-slide .section-lead{margin-bottom:24px}

.service-slide .body-copy{max-width:410px}

.service-slide .slide-content{padding-block:145px 125px}

.hero h1{font-size:clamp(48px,5.15vw,80px)}

.hero-description{max-width:455px}

.text-link:after{content:'↗';display:inline-block;margin-left:14px;transition:transform .25s}

.text-link:hover:after{transform:translate(3px,-3px)}

@keyframes art-arrive{from{opacity:0;transform:translateY(22px)}
to{opacity:.96;transform:translateY(0)}
}

@keyframes art-drift{from{transform:translateY(0)}
to{transform:translateY(-5px)}
}

@media(max-width:1100px){.service-art{max-width:450px}
.hero h1{font-size:54px}
.service-slide .slide-content{gap:60px}
}

@media(max-width:900px) and (min-width:761px){.hero h1{font-size:45px}
.service-slide .slide-content{grid-template-columns:1fr 1fr;gap:35px}
.service-slide h2{font-size:39px}
.service-slide .body-copy{font-size:15px}
.service-art{max-width:360px}
.connection-art{max-width:400px}
}

@media(max-width:760px){.service-slide .slide-content{padding-block:118px 130px;gap:22px}
.service-art{width:min(100%,470px);max-height:none}
.connection-art{width:min(100%,470px)}
.service-slide .eyebrow{margin-bottom:24px}
.hero h1{font-size:clamp(39px,9.5vw,61px)}
.service-slide .body-copy{max-width:460px}
.service-slide .service-cta{margin-top:7px}
}

@media(max-width:380px){.hero h1{font-size:34px;letter-spacing:-1.8px}
.service-art{max-height:none}
.service-slide .slide-content{gap:16px}
}

@media(prefers-reduced-motion:reduce){.service-art,.service-art>img{animation:none!important}
}

.motion-paused .service-art{animation:none!important;opacity:.96;transform:none}

/* CRM scope from the owner's annotated reference, kept within its existing section. */
.service-capabilities{list-style:none;padding:0;margin:26px 0 10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 22px}
.service-capabilities li{position:relative;padding-left:13px;font-size:12px;line-height:1.55;color:#c9c5bd}
.service-capabilities li:before{content:'';position:absolute;left:0;top:.65em;width:4px;height:1px;background:#d8b97c}
#crm .section-lead{margin-bottom:20px}
#crm .body-copy{margin-bottom:0}
#crm .service-cta{margin-top:19px}
@media(max-width:760px){.service-capabilities{font-size:12px;gap:14px 20px;margin-top:25px}.service-capabilities li{font-size:12px}}
@media(max-width:380px){.service-capabilities{column-gap:15px}.service-capabilities li{font-size:11px}}

/* JS takes one deliberate step per gesture; CSS snapping remains the no-JS fallback. */
html.screen-navigation{scroll-behavior:auto;scroll-snap-type:none}
@media(min-width:1000px) and (min-height:600px){
 .hero-grid{min-height:100svh;padding-block:112px 82px}
 .hero-visual{height:clamp(330px,calc(100svh - 194px),570px)}
 .service-slide .slide-content,.connection-content{padding-block:112px 82px}
 .service-art{max-width:min(560px,calc(100svh - 194px))}
 .connection-art{max-width:min(540px,calc(100svh - 194px))}
 .approach-content{padding-block:112px 82px}
 .contact-content{padding-block:112px 82px}
 .slide-bottom{bottom:37px}
 footer{bottom:33px}
}
@media(min-width:1000px) and (min-height:600px) and (max-height:820px){
 .hero h1{font-size:clamp(46px,4.8vw,66px);margin-bottom:23px}
 .hero .eyebrow{margin-bottom:22px}
 .hero-description{margin-bottom:27px}
 .brand-signature{margin-top:30px}
 .service-slide .eyebrow{margin-bottom:22px}
 .slide h2{font-size:clamp(36px,3.8vw,52px);margin-bottom:20px}
 .section-lead{font-size:23px}
 .service-capabilities{margin-top:20px;gap:11px 20px}
 .approach-slide h2{margin-bottom:36px}
 .process-grid h3{margin-top:19px}
 .brief-form{padding:20px 26px}
 .brief-form fieldset{margin:18px 0}
 .brief-form textarea{min-height:78px}
 .brief-form .consent{margin:16px 0}
}