/* RENDKRAFT — landing styles */
:root{
  --bone:#F2F0EB;
  --ink:#0A0A0A;
  --lime:#C5D634;
  --flame:#FF5A1F;
  --blood:#E63329;
  --fog:#D9D6CE;

  --f-display:'Bricolage Grotesque',sans-serif;
  --f-num:'Anton',sans-serif;
  --f-body:'Space Grotesk',sans-serif;
  --f-mono:'JetBrains Mono',monospace;

  --gutter:clamp(16px,3vw,40px);
  --sec-pad:clamp(70px,10vh,130px);
  --ease-out:cubic-bezier(.2,.7,.2,1);
  --ease-soft:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bone)}
body{color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
ul{list-style:none}
input,textarea,button{font-family:inherit}
*:focus-visible{outline:3px solid var(--blood);outline-offset:3px}
::selection{background:var(--lime);color:var(--ink)}

@keyframes rk-marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes rk-pulse{0%{transform:scale(1);opacity:.9}70%{transform:scale(2.8);opacity:0}100%{opacity:0}}
@keyframes rk-hero{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:translateY(0)}}

#rk-root{position:relative;overflow-x:clip;background:var(--bone)}

/* Loader */
#rk-loader{position:fixed;inset:0;z-index:100;background:var(--bone);display:flex;align-items:center;justify-content:center;
  transition:opacity .9s ease,transform 1.1s var(--ease-soft)}
#rk-loader.is-out{opacity:0;transform:scale(1.05);pointer-events:none}
.rk-loader__word{font-family:var(--f-display);font-weight:800;font-size:clamp(2.5rem,14vw,12rem);letter-spacing:-.045em;line-height:1;color:var(--ink)}
html:not(.js) #rk-loader{display:none}

/* Custom cursor (bone + difference = always visible, inverts what's underneath) */
#rk-cursor{position:fixed;top:0;left:0;width:16px;height:16px;border-radius:50%;background:var(--bone);pointer-events:none;z-index:90;
  display:none;align-items:center;justify-content:center;mix-blend-mode:difference;will-change:transform;
  transition:width .25s var(--ease-out),height .25s var(--ease-out)}
#rk-cursor.is-big{width:92px;height:92px}
.rk-cursor__label{font-family:var(--f-mono);font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--ink);opacity:0;transition:opacity .2s}
#rk-cursor.is-view .rk-cursor__label{opacity:1}
html.has-cursor #rk-cursor{display:flex}
html.has-cursor, html.has-cursor *{cursor:none!important}

/* Header */
.rk-header{position:fixed;top:0;left:0;right:0;z-index:70;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:16px var(--gutter);font-family:var(--f-mono);color:var(--ink);transition:color .3s}
.rk-header.is-dark{color:var(--bone)}
.rk-logo{font-family:var(--f-display);font-weight:800;font-size:clamp(18px,1.6vw,24px);letter-spacing:-.03em;line-height:1}
.rk-logo sup{font-size:.5em;font-weight:600}
.rk-header__mid{font-size:11px;letter-spacing:.04em;text-align:center;line-height:1.4;white-space:nowrap}
.rk-nav{display:flex;align-items:center;gap:clamp(12px,1.5vw,24px);font-size:12px;letter-spacing:.08em}
.rk-lang{display:inline-flex;align-items:center;gap:7px}
.rk-lang button,.rk-menu__lang button{background:none;border:none;color:inherit;cursor:pointer;font-size:11px;letter-spacing:.08em;padding:0;opacity:.4;font-weight:400}
.rk-lang button[aria-pressed="true"],.rk-menu__lang button[aria-pressed="true"]{opacity:1;font-weight:700}
.rk-lang__sep{opacity:.35}
.rk-available{display:inline-flex;align-items:center;gap:9px;border:1.5px solid currentColor;border-radius:100px;padding:8px 15px;white-space:nowrap}
.rk-dot{position:relative;width:8px;height:8px;display:inline-block}
.rk-dot span{position:absolute;inset:0;border-radius:50%;background:var(--lime)}
.rk-dot span:last-child{animation:rk-pulse 1.9s ease-out infinite}
.rk-hamb{display:none;background:none;border:1.5px solid currentColor;border-radius:8px;padding:8px 12px;color:inherit;font-size:12px;letter-spacing:.12em;cursor:pointer;font-family:var(--f-mono)}
@media (max-width:860px){
  .rk-nav,.rk-header__mid{display:none}
  .rk-hamb{display:inline-flex}
}

/* Mobile menu */
.rk-menu{position:fixed;inset:0;z-index:80;background:var(--ink);color:var(--bone);display:flex;flex-direction:column;justify-content:center;gap:4px;
  padding:clamp(30px,8vw,80px);transform:translateY(-100%);opacity:0;pointer-events:none;
  transition:transform .55s cubic-bezier(.7,0,.2,1),opacity .4s}
.rk-menu.is-open{transform:translateY(0);opacity:1;pointer-events:auto}
.rk-menu > a{font-family:var(--f-display);font-weight:800;font-size:clamp(3rem,14vw,7rem);line-height:.92;letter-spacing:-.04em}
.rk-menu__close{position:absolute;top:20px;right:clamp(16px,4vw,40px);background:none;border:1.5px solid var(--bone);border-radius:8px;color:var(--bone);
  font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;padding:8px 12px;cursor:pointer}
.rk-menu__lang{display:flex;gap:14px;align-items:center;font-family:var(--f-mono);font-size:14px;letter-spacing:.08em;margin-top:24px}
.rk-menu__lang button{font-size:14px}
.rk-menu__meta{font-family:var(--f-mono);font-size:12px;letter-spacing:.05em;margin-top:20px;opacity:.6;line-height:1.9}

/* Reveal — JS adds .is-in, then drops [data-reveal] once settled so components' own transitions take over */
html.js [data-reveal]{opacity:0;transform:translateY(38px);transition:opacity .9s var(--ease-soft),transform .9s var(--ease-soft);will-change:opacity,transform}
html.js [data-reveal].is-in{opacity:1;transform:none}

/* Marquee */
.rk-marquee{display:flex;width:max-content}
.rk-marquee--26{animation:rk-marq 26s linear infinite}
.rk-marquee--30{animation:rk-marq 30s linear infinite}

/* Sections — shared */
.rk-section{padding:var(--sec-pad) var(--gutter);position:relative}
.rk-section__head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:clamp(30px,5vh,60px)}
.rk-h2{font-family:var(--f-display);font-weight:800;font-size:clamp(2.6rem,9vw,9rem);line-height:.83;letter-spacing:-.045em}
.rk-section__meta{font-family:var(--f-mono);font-size:13px;letter-spacing:.05em;text-align:right;line-height:1.7}
.rk-section__meta--dim{opacity:.7}

/* Hero */
.rk-hero{position:relative;min-height:100vh;background:var(--bone);color:var(--ink);padding:clamp(92px,13vh,150px) var(--gutter) 0;overflow:hidden;display:flex;flex-direction:column}
.rk-hero__fig{position:absolute;top:clamp(92px,12vh,130px);right:var(--gutter);font-family:var(--f-mono);font-size:11px;letter-spacing:.05em;text-align:right;line-height:1.7;opacity:.6}
.rk-hero__title-wrap{position:relative;flex:1;display:flex;align-items:center;min-height:34vh}
.rk-hero__title{position:relative;z-index:2;font-family:var(--f-display);font-weight:800;font-size:clamp(3rem,18vw,20rem);line-height:.8;letter-spacing:-.05em;
  animation:rk-hero 1.1s var(--ease-soft) .85s both}
@media (max-width:420px){ .rk-hero__title{font-size:17vw} }
html.no-intro .rk-hero__title{animation-delay:.1s}
.rk-hero__cols{position:relative;z-index:2;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(20px,4vw,60px);align-items:end;padding-bottom:clamp(72px,10vh,112px)}
.rk-hero__statement{font-family:var(--f-body);font-size:clamp(1.2rem,2vw,1.9rem);line-height:1.15;max-width:24ch;font-weight:500}
.rk-meta{font-family:var(--f-mono);font-size:12px;letter-spacing:.03em;display:grid}
.rk-meta > div{display:flex;justify-content:space-between;gap:12px;border-top:1px solid rgba(10,10,10,.25);padding:7px 0}
.rk-meta > div:first-child{border-top:1.5px solid var(--ink)}
.rk-ticker{position:absolute;left:0;right:0;bottom:0;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);background:var(--lime);overflow:hidden}
.rk-ticker__item{flex:0 0 auto;white-space:nowrap;font-family:var(--f-display);font-weight:800;font-size:clamp(14px,1.4vw,20px);letter-spacing:.02em;padding:11px 0;color:var(--ink)}

/* Work */
.rk-work{background:var(--lime);color:var(--ink)}
.rk-work__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:clamp(16px,2vw,26px)}
.rk-card{position:relative;display:block;background:var(--bone);border:2px solid var(--ink);overflow:hidden}
.rk-card{transition:transform .5s var(--ease-out)}
.rk-card--feature{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.rk-card--feature__body{display:flex;flex-direction:column;justify-content:space-between;gap:24px;padding:clamp(20px,3vw,38px)}
.rk-thumb{aspect-ratio:4/3;background:var(--fog);background-image:repeating-linear-gradient(45deg,rgba(10,10,10,.08) 0 12px,transparent 12px 24px);position:relative;overflow:hidden}
.rk-thumb--wide{aspect-ratio:16/9}
.rk-thumb > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rk-thumb__label{position:absolute;left:12px;top:12px;font-family:var(--f-mono);font-size:10px;letter-spacing:.08em;color:rgba(10,10,10,.5)}
.rk-thumb--wide .rk-thumb__label{left:14px}
.rk-thumb__overlay{position:absolute;inset:0;background:var(--ov);mix-blend-mode:multiply;opacity:0;transition:opacity .45s}
.rk-card__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:16px 18px 18px}
.rk-tags{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;opacity:.6;margin-bottom:6px}
.rk-card--feature .rk-tags{margin-bottom:8px}
.rk-card__title{font-family:var(--f-display);font-weight:800;font-size:clamp(1.3rem,2.4vw,1.9rem);line-height:.95;letter-spacing:-.02em}
.rk-card__title--xl{font-size:clamp(1.8rem,4vw,3.4rem);line-height:.92}
.rk-card__sub{font-family:var(--f-body);font-size:.9rem;opacity:.65;margin-top:4px}
.rk-card__sub--xl{font-size:1.05rem;opacity:.7;margin-top:6px}
.rk-card__num{font-family:var(--f-num);font-size:clamp(2.8rem,5vw,4.6rem);line-height:.75}
.rk-card__num--xl{font-size:clamp(4rem,9vw,9rem)}
@media (hover:hover){
  .rk-card:hover .rk-thumb__overlay,.rk-card:focus-visible .rk-thumb__overlay{opacity:1}
  .rk-card--feature:hover{transform:translateY(-6px)}
  .rk-card--tilt-l:hover{transform:scale(1.015) rotate(-.4deg)}
  .rk-card--tilt-r:hover{transform:scale(1.015) rotate(.4deg)}
}

/* Services
   Fixed 3-column grid: the description owns its own lane, so hover only animates
   opacity/transform — no reflow, no overflow outside the row, no enter/leave loop. */
.rk-services{background:var(--ink);color:var(--bone)}
.rk-svc{border-top:1.5px solid rgba(242,240,235,.28);overflow:hidden}
.rk-svc__row{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,min(34ch,30%));align-items:center;column-gap:clamp(14px,3vw,50px);
  border-bottom:1.5px solid rgba(242,240,235,.28);padding:clamp(18px,3.2vh,34px) clamp(14px,2vw,28px);background:transparent;
  transition:background .4s ease,color .4s ease}
.rk-svc__num{font-family:var(--f-mono);font-size:14px;opacity:.6}
.rk-svc__name{font-family:var(--f-display);font-weight:800;font-size:clamp(1.5rem,4.6vw,3.4rem);line-height:.95;letter-spacing:-.02em;
  transition:transform .45s var(--ease-out)}
.rk-svc__desc{font-family:var(--f-body);font-size:1rem;line-height:1.3;text-align:right;justify-self:end;
  opacity:0;transform:translateX(28px);transition:opacity .25s ease,transform .5s var(--ease-out)}
@media (hover:hover){
  .rk-svc__row:hover{background:var(--flame);color:var(--ink)}
  .rk-svc__row:hover .rk-svc__name{transform:translateX(16px)}
  .rk-svc__row:hover .rk-svc__desc{opacity:1;transform:none;transition:opacity .4s ease .05s,transform .5s var(--ease-out)}
}
@media (hover:none){ .rk-svc__desc{opacity:.7;transform:none} }
@media (max-width:760px){
  .rk-svc__row{grid-template-columns:auto minmax(0,1fr)}
  .rk-svc__desc{display:none}
}

/* About */
.rk-about{background:var(--flame);color:var(--ink)}
.rk-about__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:clamp(30px,5vw,70px);align-items:start}
.rk-portrait{aspect-ratio:1;width:min(100%,360px);border-radius:50%;border:4px solid var(--ink);background:var(--bone);overflow:hidden;position:relative;
  background-image:repeating-linear-gradient(45deg,rgba(10,10,10,.1) 0 14px,transparent 14px 28px);display:flex;align-items:flex-end;padding:20px}
.rk-portrait span{font-family:var(--f-mono);font-size:11px;letter-spacing:.05em}
.rk-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rk-about__caption{font-family:var(--f-mono);font-size:12px;margin-top:18px;line-height:1.8;letter-spacing:.03em}
.rk-about__title{font-family:var(--f-display);font-weight:800;font-size:clamp(2rem,5.5vw,4.4rem);line-height:.88;letter-spacing:-.035em;margin-bottom:clamp(22px,3vh,34px)}
.rk-about__body{font-family:var(--f-body);font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.45;display:grid;gap:1em;max-width:58ch}
.rk-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:clamp(14px,2vw,24px);margin-top:clamp(40px,7vh,90px);border-top:2px solid var(--ink);padding-top:clamp(24px,4vh,42px)}
.rk-stats__num{font-family:var(--f-num);font-size:clamp(3rem,7vw,6.5rem);line-height:.82;font-variant-numeric:tabular-nums}
.rk-stats__label{font-family:var(--f-mono);font-size:12px;margin-top:6px;letter-spacing:.06em}

/* Clients */
.rk-clients{background:var(--bone);color:var(--ink);padding:clamp(50px,8vh,90px) 0}
.rk-clients__label{font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-align:center;margin-bottom:26px;opacity:.6}
.rk-clients__band{overflow:hidden;border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);padding:22px 0}
.rk-clients__set{display:flex;gap:clamp(40px,6vw,90px);padding-right:clamp(40px,6vw,90px);align-items:center;font-family:var(--f-display);font-weight:800;
  font-size:clamp(1.4rem,3vw,2.4rem);white-space:nowrap;letter-spacing:-.02em;opacity:.9;flex:0 0 auto}
.rk-quote{max-width:900px;margin:clamp(40px,7vh,80px) auto 0;padding:0 var(--gutter);text-align:center}
.rk-quote blockquote{font-family:var(--f-display);font-weight:600;font-size:clamp(1.4rem,3vw,2.4rem);line-height:1.12;letter-spacing:-.02em}
.rk-quote figcaption{font-family:var(--f-mono);font-size:12px;margin-top:20px;opacity:.6;letter-spacing:.05em}

/* Contact */
.rk-contact{background:var(--ink);color:var(--lime);padding:clamp(70px,11vh,140px) var(--gutter)}
.rk-contact__title{font-family:var(--f-display);font-weight:800;font-size:clamp(2.4rem,10vw,10rem);line-height:.82;letter-spacing:-.045em;margin-bottom:clamp(40px,6vh,70px)}
.rk-contact__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:clamp(30px,5vw,60px);align-items:start}
.rk-wa{display:flex;align-items:center;justify-content:space-between;gap:18px;background:var(--lime);color:var(--ink);border:2px solid var(--lime);
  padding:clamp(20px,3vw,30px);font-family:var(--f-display);font-weight:800;font-size:clamp(1.3rem,2.6vw,2.2rem);letter-spacing:-.02em;transition:transform .3s}
.rk-wa:hover{transform:translateY(-4px)}
.rk-wa__label{display:flex;align-items:center;gap:16px}
.rk-wa__label svg{flex:0 0 auto}
.rk-wa__arrow{font-size:1.3em}
.rk-links{font-family:var(--f-mono);font-size:14px;line-height:1;margin-top:32px;color:var(--bone);display:grid}
.rk-links > div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(242,240,235,.2);padding:14px 0}
.rk-links dd a{color:var(--lime)}
.rk-form{display:grid;gap:18px}
.rk-form input,.rk-form textarea{background:transparent;border:none;border-bottom:2px solid rgba(242,240,235,.28);color:var(--bone);font-family:var(--f-mono);
  font-size:15px;letter-spacing:.06em;padding:14px 2px;outline:none;border-radius:0;transition:border-color .25s}
.rk-form textarea{resize:vertical}
.rk-form input::placeholder,.rk-form textarea::placeholder{color:rgba(242,240,235,.55)}
.rk-form input:focus,.rk-form textarea:focus{border-bottom-color:var(--lime)}
.rk-form button{background:var(--lime);color:var(--ink);border:2px solid var(--lime);font-family:var(--f-display);font-weight:800;font-size:clamp(1rem,1.6vw,1.3rem);
  letter-spacing:.02em;padding:18px 22px;cursor:pointer;text-align:left;transition:transform .3s}
.rk-form button:hover{transform:translateY(-3px)}
.rk-form button:disabled{opacity:.6;cursor:progress}
.rk-form__status{font-family:var(--f-mono);font-size:12px;letter-spacing:.05em;color:var(--bone);min-height:1em}

/* Footer */
.rk-footer{background:var(--bone);color:var(--ink);padding:clamp(40px,6vh,70px) var(--gutter);border-top:2px solid var(--ink);font-family:var(--f-mono)}
.rk-footer__inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:flex-end}
.rk-footer__logo{font-family:var(--f-display);font-weight:800;font-size:clamp(2rem,8vw,6rem);line-height:.82;letter-spacing:-.04em}
.rk-footer__meta{font-size:11px;line-height:1.9;text-align:right;letter-spacing:.03em}

/* Lenis */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;animation-delay:0s!important}
  html.js [data-reveal]{opacity:1;transform:none}
}