@font-face{font-family:Bricolage;src:url('fonts/bricolage.woff2') format('woff2');font-weight:200 800;font-stretch:75% 100%;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url('fonts/inter.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --paper:#fafaf6;--ink:#29351f;--olive:#626b43;--wash:#e0e5c7;--muted:#596050;--line:#d9dccd;
  --night-text:#c9cfba;--night-muted:#8a9472;--night-line:rgba(224,229,199,.16);
  --gutter:clamp(20px,5vw,72px);
  --display:Bricolage,'Arial Narrow',Arial,sans-serif;
  --ease:cubic-bezier(.2,.75,.15,1);
  font-family:Inter,Arial,sans-serif;color:var(--ink);background:var(--paper);
  font-size:16px;line-height:1.6;font-synthesis:none;color-scheme:light;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--paper)}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
:focus-visible{outline:2px solid currentColor;outline-offset:5px;border-radius:2px}
p,ol,ul{margin:0}
ol,ul{padding:0;list-style:none}
h1,h2,h3{margin:0;font-family:var(--display);font-weight:600;font-stretch:88%;letter-spacing:-.04em;line-height:.98;text-wrap:balance}
h2{font-size:clamp(38px,5.2vw,76px)}
p{text-wrap:pretty}
::selection{background:var(--ink);color:var(--paper)}

.wrap{width:min(100% - 2 * var(--gutter),1280px);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.preview{background:#d5dbc0;color:#455137;text-align:center;font-size:11px;line-height:1.4;padding:6px 16px}
.skip{position:absolute;top:-100px;left:20px;z-index:5;background:var(--paper);padding:12px 20px}
.skip:focus{top:10px}

.eyebrow{display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.4;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--olive)}
.eyebrow::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}

/* Header */
.top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:24px}
.brand{display:inline-flex;align-items:center;gap:13px;text-decoration:none}
.brand-symbol{width:auto;height:34px}
.brand-word{width:auto;height:18px;margin-top:3px}
.nav-link{display:inline-flex;align-items:center;gap:10px;padding:10px 0;font-size:14px;font-weight:550;text-decoration:none;background:linear-gradient(currentColor,currentColor) no-repeat 0 calc(100% - 6px)/0 1px;transition:background-size .4s var(--ease)}
.nav-link:hover{background-size:100% 1px}
.nav-link span{color:var(--olive);transition:transform .4s var(--ease)}
.nav-link:hover span{transform:translateY(2px)}

/* Hero */
.hero{position:relative;overflow:hidden;margin-top:-82px;padding-top:82px}
.hero-inner{display:flex;flex-direction:column;min-height:clamp(560px,calc(88svh - 82px),860px);padding-block:48px clamp(48px,7vw,96px)}
.hero-main{position:relative;flex:1;display:flex;flex-direction:column;justify-content:flex-end}
.hero-main>:not(.hero-mark){position:relative}
.hero-mark{display:none}
@supports (mask-size:contain) or (-webkit-mask-size:contain){
  .hero-mark{display:block;position:absolute;bottom:0;right:0;height:min(calc(100% + 64px),640px);aspect-ratio:1042/1130;background:var(--wash);
    -webkit-mask:url('nekso-symbol.png') no-repeat 50% 50%/contain;mask:url('nekso-symbol.png') no-repeat 50% 50%/contain}
}
.hero h1{margin-top:clamp(20px,2.4vw,32px);font-size:clamp(52px,11vw,168px);font-weight:600;line-height:.9;letter-spacing:-.035em}
.line{display:block;overflow:hidden;padding:.06em 0 .07em;margin:-.06em 0 -.07em}
.line>span{display:block}
.line-accent{color:var(--olive)}
.hero-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:32px 48px;margin-top:clamp(36px,4.4vw,64px);padding-top:28px;border-top:1px solid var(--ink)}
.lead{max-width:44ch;font-size:clamp(17px,1.35vw,20px);line-height:1.5}
.button{display:inline-flex;align-items:center;gap:18px;min-height:56px;padding:0 26px 0 28px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:15px;font-weight:600;line-height:1;text-decoration:none;white-space:nowrap;flex:none;transition:background-color .25s}
.button:hover{background:var(--olive)}
.button span{font-size:18px;transition:transform .4s var(--ease)}
.button:hover span{transform:translate(3px,-3px)}

/* Section heads */
.section{padding-block:clamp(96px,12vw,176px)}
.split-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:end;margin-bottom:clamp(44px,5.4vw,80px)}
.split-head>div{grid-column:1/8}
.split-head>p{grid-column:9/13;max-width:40ch;color:var(--muted);font-size:17px;line-height:1.65}
.split-head .eyebrow{margin-bottom:24px}

/* Routine: tasks crossed out */
.routine{background:var(--ink);color:var(--paper);padding-block:clamp(96px,12vw,176px)}
.routine .eyebrow{color:#b9c39d}
.routine .split-head>p{color:var(--night-text)}
.strike-list{counter-reset:task;border-top:1px solid var(--night-line)}
.strike-list li,.payoff{display:grid;grid-template-columns:clamp(44px,8.4vw,128px) minmax(0,1fr);align-items:baseline;font-family:var(--display);font-stretch:88%;font-size:clamp(28px,5.1vw,76px);line-height:1.06;letter-spacing:-.04em}
.strike-list li{counter-increment:task;padding-block:clamp(14px,1.5vw,22px);border-bottom:1px solid var(--night-line);font-weight:500}
.strike-list li::before{content:counter(task,decimal-leading-zero);font-family:Inter,Arial,sans-serif;font-size:12px;font-weight:600;letter-spacing:.12em;color:var(--night-muted)}
.strike-list s{--stroke:max(2px,.05em);text-decoration:none;color:var(--night-muted);background:linear-gradient(var(--wash),var(--wash)) no-repeat 0 52%/100% var(--stroke)}
.payoff{padding-top:clamp(28px,3.4vw,48px);font-weight:600;color:var(--wash)}
.payoff::before{content:'→';font-family:Inter,Arial,sans-serif;font-size:.42em;font-weight:400;letter-spacing:0;color:#b9c39d}

/* Audiences */
.rows{border-top:1px solid var(--ink)}
.row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;padding-block:clamp(32px,4vw,52px);border-bottom:1px solid var(--line)}
.row-num,.step-num{font-size:12px;font-weight:600;letter-spacing:.12em;color:var(--olive)}
.row-num{grid-column:1/2;padding-top:.7em}
.row h3{grid-column:2/7;font-size:clamp(30px,3.3vw,48px);line-height:1}
.row-body{grid-column:8/13}
.row-body>p:first-child{max-width:48ch;color:var(--muted);font-size:17px;line-height:1.65}
.flow{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:26px;font-size:15px;line-height:1.5}
.flow-label{flex-basis:100%;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.from{color:var(--muted)}
.to{font-weight:550}
.arrow{position:relative;width:40px;height:1px;background:var(--olive);flex:none;transition:width .5s var(--ease)}
.arrow::after{content:'';position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid var(--olive);border-right:1px solid var(--olive);transform:rotate(45deg)}
.row:hover .arrow{width:68px}

/* Process */
.process{padding-top:0}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3.2vw,48px)}
.steps li{position:relative;padding-top:30px;border-top:1px solid var(--ink)}
.steps li::before{content:'';position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--olive)}
.step-num{display:block;margin-bottom:clamp(24px,3vw,40px)}
.steps h3{font-size:clamp(25px,2.4vw,34px);line-height:1.05;margin-bottom:14px}
.steps p{max-width:34ch;color:var(--muted);font-size:16px;line-height:1.65}

/* Contact */
.contact{background:var(--wash);padding-block:clamp(96px,12vw,176px)}
.contact h2{max-width:15ch;font-size:clamp(34px,4.4vw,64px)}
.contact .split-head{margin-bottom:0}
.contact .split-head>p{color:#4a5240}
.email{display:inline-flex;align-items:baseline;gap:.12em;max-width:100%;margin-top:clamp(48px,6vw,96px);padding-bottom:.1em;font-family:var(--display);font-stretch:88%;font-weight:600;font-size:clamp(40px,9.6vw,152px);line-height:1;letter-spacing:-.05em;text-decoration:none;background:linear-gradient(currentColor,currentColor) no-repeat 0 100%/100% max(2px,.025em);transition:color .25s}
.email:hover{color:var(--olive)}
.email span{font-family:Inter,Arial,sans-serif;font-size:.42em;font-weight:300;letter-spacing:0;transition:transform .45s var(--ease)}
.email:hover span{transform:translate(.1em,-.1em)}
.contact-hint{margin-top:24px;font-size:14px;color:#4a5240}

/* Footer */
.footer{padding-block:56px 28px}
.footer-top{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:32px}
.footer-brand img{width:auto;height:18px}
.footer-top p{font-size:14px;color:var(--muted)}
.privacy{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.privacy summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:52px;padding:14px 0;font-size:14px;font-weight:550}
.privacy summary::-webkit-details-marker{display:none}
.privacy summary span{display:grid;place-items:center;width:24px;height:24px;font-size:20px;line-height:1;font-weight:300;transition:transform .3s var(--ease)}
.privacy[open] summary span{transform:rotate(45deg)}
.privacy-body{max-width:760px;padding:16px 0 32px;color:var(--muted);font-size:14px}
.privacy-body h2{margin-bottom:18px;font-family:Inter,Arial,sans-serif;font-size:21px;font-weight:600;font-stretch:normal;letter-spacing:-.015em;line-height:1.4;color:var(--ink)}
.privacy-body h3{margin:26px 0 10px;font-family:Inter,Arial,sans-serif;font-size:15px;font-weight:600;font-stretch:normal;letter-spacing:0;line-height:1.4;color:var(--ink)}
.privacy-body p{margin:12px 0}
.privacy-body .privacy-date{margin-top:24px;font-size:12px}
.review-note{background:var(--wash);border-radius:12px;padding:15px 18px;font-size:13px}
.legal{display:flex;justify-content:space-between;gap:6px 18px;flex-wrap:wrap;padding-top:22px;font-size:12px;line-height:1.7;color:var(--muted)}
.legal address{font-style:normal}

/* Motion: entrance on load, strike-through while scrolling */
@media(prefers-reduced-motion:no-preference){
  .line>span{animation:rise 1.1s var(--ease) both}
  .line-accent>span{animation-delay:.09s}
  .reveal{animation:fade 1s var(--ease) .35s both}
  .hero-mark{animation:mark 1.6s var(--ease) both}
  @supports (animation-timeline:view()){
    .strike-list s{animation:strike linear both;animation-timeline:view();animation-range:entry 85% cover 52%}
  }
}
@keyframes rise{from{transform:translateY(105%)}to{transform:none}}
@keyframes fade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes mark{from{opacity:0;transform:translateY(4%) scale(.97)}to{opacity:1;transform:none}}
@keyframes strike{from{background-size:0% var(--stroke);color:var(--paper)}to{background-size:100% var(--stroke);color:var(--night-muted)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

/* Responsive */
@media(max-width:1000px){
  .split-head>div{grid-column:1/9}
  .split-head>p{grid-column:9/13}
  .row h3{grid-column:2/8}
  .row-body{grid-column:8/13}
}
@media(max-width:760px){
  .top{padding-block:18px}
  .brand{gap:10px}
  .brand-symbol{height:30px}
  .brand-word{height:16px}
  .hero{margin-top:-68px;padding-top:68px}
  .hero-mark{top:-104px;bottom:auto;right:-16vw;height:min(74vw,380px)}
  .hero-inner{min-height:0;padding-block:clamp(128px,36vw,200px) 56px}
  .hero .eyebrow{font-size:11px;letter-spacing:.1em}
  .hero h1{font-size:clamp(46px,14.6vw,84px)}
  .hero-foot{flex-direction:column;align-items:flex-start;gap:28px;padding-top:24px}
  .lead{font-size:17px}
  .split-head{grid-template-columns:1fr;gap:20px}
  .split-head>div,.split-head>p{grid-column:auto}
  .split-head>p{font-size:16px}
  .strike-list li,.payoff{grid-template-columns:38px minmax(0,1fr);font-size:clamp(26px,7.6vw,44px);line-height:1.1}
  .row{grid-template-columns:38px minmax(0,1fr);gap:14px 0}
  .row-num{grid-column:1/2;padding-top:.55em}
  .row h3{grid-column:2/3;font-size:clamp(28px,8vw,40px)}
  .row-body{grid-column:1/3}
  .row-body>p:first-child{font-size:16px}
  .steps{grid-template-columns:1fr;gap:44px}
  .step-num{margin-bottom:18px}
  .contact h2{font-size:clamp(32px,9vw,48px)}
  .email{font-size:clamp(34px,11.4vw,64px)}
  .footer{padding-block:44px 24px}
  .footer-top{flex-direction:column;align-items:flex-start;gap:10px}
  .legal{flex-direction:column}
}
@media(max-width:350px){
  .button{gap:14px;padding-inline:22px;font-size:14px}
}