/* Ludusware Studio — ludusware.com
   Rebuilt 1:1 from the confirmed Webflow design (ludusware-f0654a.webflow.io). */

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%}
html,body{margin:0;background-color:#050505;color:#F2EDE3}
body{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img,video{display:block;max-width:100%}
a{color:inherit}
::selection{background:#C8141B;color:#F2EDE3}

.lw-skip{position:absolute;left:16px;top:-60px;z-index:100;padding:10px 16px;background:#C8141B;color:#F2EDE3;font-weight:700;text-decoration:none;border-radius:3px;transition:top .2s}
.lw-skip:focus{top:16px}

/* ---------- Page + film grain ---------- */
.lw-page{position:relative;min-height:100vh;overflow-x:clip;counter-reset:lwsec}
.lw-page::after{content:"";position:fixed;inset:-50%;pointer-events:none;z-index:50;opacity:.025;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");animation:lw-grain 1s steps(6) infinite}
@keyframes lw-grain{0%,100%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,3%)}80%{transform:translate(3%,1%)}}

.lw-container{max-width:1280px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.lw-mono,.lw-nav-link,.lw-tag,.lw-thumb-label{font-family:'JetBrains Mono',ui-monospace,Menlo,monospace}
.lw-mono{font-size:13px;letter-spacing:.14em;color:#A8A39A}

/* ---------- Navigation ---------- */
.lw-nav{position:fixed;top:0;left:0;right:0;z-index:10;background-color:rgba(5,5,5,0);border-bottom:1px solid rgba(31,31,31,0);-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);transition:background-color .5s cubic-bezier(.2,.8,.2,1),border-color .5s,backdrop-filter .5s,-webkit-backdrop-filter .5s}
.lw-nav::before{content:"";position:absolute;inset:0 0 -40px 0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(5,5,5,.45),rgba(5,5,5,0));transition:opacity .5s}
.lw-nav.is-scrolled{background-color:rgba(5,5,5,.72);border-bottom-color:#1F1F1F;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.lw-nav.is-scrolled::before{opacity:0}
.lw-nav-inner,.lw-logo-img{transition:padding .5s cubic-bezier(.2,.8,.2,1),height .5s cubic-bezier(.2,.8,.2,1)}
.lw-nav.is-scrolled .lw-nav-inner{padding-top:10px;padding-bottom:10px}
.lw-nav.is-scrolled .lw-logo-img{height:48px}
.lw-nav-links{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.lw-nav-link{text-shadow:0 1px 12px rgba(0,0,0,.5)}
.lw-nav.is-scrolled .lw-nav-link{text-shadow:none}
.lw-page>main{display:block}

.lw-nav-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:14px;padding-bottom:14px}
.lw-brand{display:flex;align-items:center;text-decoration:none;color:#F2EDE3}
.lw-logo-img{height:64px;width:auto}
.lw-nav-links{display:flex;gap:26px;flex-wrap:wrap}
.lw-nav-link{position:relative;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#F2EDE3;text-decoration:none;transition:color .2s}
.lw-nav-link::after{content:"";position:absolute;left:0;bottom:-6px;height:2px;width:100%;background:#C8141B;transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.lw-nav-link:hover::after,.lw-nav-link:focus-visible::after{transform:scaleX(1)}
.lw-nav-link-red{color:#F0473F}

/* ---------- Hero ---------- */
.lw-hero{position:relative;overflow:hidden;isolation:isolate;z-index:0;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;padding-top:140px;padding-bottom:96px}
.lw-hero>.lw-container{width:100%}
.lw-hero-bg{position:absolute;inset:0;z-index:-1;overflow:hidden;background:#050505 url("media/hero-drone-poster.webp") center/cover no-repeat}
.lw-hero-video{width:100%;height:100%;object-fit:cover;display:block;max-width:none}
.lw-hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,5,5,.25) 0%,rgba(5,5,5,.08) 28%,rgba(5,5,5,.4) 62%,rgba(5,5,5,.92) 100%)}
.lw-hero::after{content:"SCROLL";position:absolute;right:24px;bottom:30px;z-index:2;font:500 11px/1 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.3em;color:#CFC9BE;writing-mode:vertical-rl;padding-bottom:56px;background:linear-gradient(#C8141B,#C8141B) bottom center/1px 44px no-repeat;animation:lw-scroll 2.4s ease-in-out infinite}
@keyframes lw-scroll{0%,100%{background-size:1px 44px;opacity:.9}50%{background-size:1px 18px;opacity:.5}}
.lw-hero-inner{display:flex;flex-direction:column;gap:40px}
.lw-hero-inner>*{animation:lw-up .9s cubic-bezier(.2,.8,.2,1) both}
.lw-hero-inner>*:nth-child(2){animation-delay:.08s}
.lw-hero-inner>*:nth-child(3){animation-delay:.18s}
@keyframes lw-up{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}
.lw-rec{display:flex;align-items:center;gap:12px}
.lw-rec-dot{width:10px;height:10px;border-radius:50%;background-color:#C8141B;animation:lw-blink 1.2s steps(2) infinite}
@keyframes lw-blink{50%{opacity:.15}}
.lw-hero-title{margin:0;font-weight:900;font-size:clamp(52px,10.5vw,168px);line-height:.86;letter-spacing:-.035em;text-transform:uppercase;color:#F2EDE3;text-shadow:0 2px 30px rgba(0,0,0,.45)}
.lw-red-text{color:#E0301E}
.lw-hero-row{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.lw-hero-lead{margin:0;max-width:560px;font-size:clamp(17px,1.4vw,20px);color:#EDE8DF;text-shadow:0 2px 30px rgba(0,0,0,.45)}

/* ---------- Buttons ---------- */
.lw-btn-row{display:flex;gap:12px;flex-wrap:wrap}
.lw-btn{display:inline-flex;align-items:center;min-height:48px;padding-left:26px;padding-right:26px;border-radius:3px;font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:#F2EDE3;transition:transform .2s,background-color .2s,color .2s}
.lw-btn-red{background-color:#C8141B}
.lw-btn-red:hover{background-color:#E0301E;transform:translateY(-2px)}
.lw-btn-ghost{border:1px solid #F2EDE3}
.lw-btn-ghost:hover{background-color:#F2EDE3;color:#0A0A0A;transform:translateY(-2px)}
.lw-page a:focus-visible{outline:2px solid #E0301E;outline-offset:4px}

/* ---------- Clients marquee ---------- */
.lw-clients{border-top:1px solid #1F1F1F;border-bottom:1px solid #1F1F1F}
.lw-clients-inner{display:flex;align-items:center;gap:40px;flex-wrap:nowrap;overflow:hidden;padding-top:28px;padding-bottom:28px}
.lw-clients-label{flex-shrink:0}
.lw-marquee{flex:1 1 auto;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 48px,#000 calc(100% - 48px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 48px,#000 calc(100% - 48px),transparent 100%)}
.lw-client-list{display:flex;flex-wrap:nowrap;gap:0;width:max-content;animation:lw-marquee 32s linear infinite}
.lw-clients:hover .lw-client-list{animation-play-state:paused}
.lw-client{display:flex;align-items:center;white-space:nowrap;padding-right:40px;font-weight:800;font-size:20px;letter-spacing:.02em;text-transform:uppercase}
.lw-client::after{content:"\2726";color:#C8141B;font-size:13px;margin-left:40px}
@keyframes lw-marquee{to{transform:translateX(-50%)}}

/* ---------- Sections ---------- */
.lw-section{padding-top:88px;padding-bottom:88px}
.lw-stack{display:flex;flex-direction:column;gap:40px}
.lw-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;padding-bottom:28px;border-bottom:1px solid #1F1F1F}
.lw-h2{margin:0;font-weight:900;font-size:clamp(38px,6.4vw,96px);line-height:.9;letter-spacing:-.03em;text-transform:uppercase;color:#F2EDE3}
.lw-h2::before{counter-increment:lwsec;content:"(" counter(lwsec,decimal-leading-zero) ")";display:block;margin-bottom:18px;font:500 12px/1 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.2em;color:#E0301E}

/* ---------- Work grid ---------- */
.lw-work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:dense;column-gap:28px;row-gap:40px}
.lw-card{position:relative;display:flex;flex-direction:column;gap:14px}
.lw-card-feature{grid-column:span 2}
.lw-thumb{position:relative;overflow:hidden;aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;border:1px solid #262626;background-color:#0A0A0A;background-image:radial-gradient(ellipse at center,#1B1B1B 0%,#080808 72%);transition:transform .5s cubic-bezier(.2,.8,.2,1),border-color .3s}
.lw-card:hover .lw-thumb{border-color:#C8141B;transform:translateY(-6px)}
.lw-thumb::after,.lw-game-media::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background-image:linear-gradient(#F2EDE3 0 0),linear-gradient(#F2EDE3 0 0),linear-gradient(#F2EDE3 0 0),linear-gradient(#F2EDE3 0 0),linear-gradient(#F2EDE3 0 0),linear-gradient(#F2EDE3 0 0),linear-gradient(#F2EDE3 0 0),linear-gradient(#F2EDE3 0 0),radial-gradient(ellipse at center,rgba(0,0,0,0) 50%,rgba(0,0,0,.55) 100%);background-repeat:no-repeat;background-position:top 14px left 14px,top 14px left 14px,top 14px right 14px,top 14px right 14px,bottom 14px left 14px,bottom 14px left 14px,bottom 14px right 14px,bottom 14px right 14px,center;background-size:22px 2px,2px 22px,22px 2px,2px 22px,22px 2px,2px 22px,22px 2px,2px 22px,100% 100%}
.lw-cover{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;filter:saturate(.95) contrast(1.04);transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .6s}
.lw-card:hover .lw-cover,.lw-game-media:hover .lw-cover{transform:scale(1.04);filter:saturate(1.08) contrast(1.08)}

/* placeholders */
.lw-thumb-empty,.lw-game-media-empty{background-image:repeating-linear-gradient(135deg,rgba(242,237,227,.035) 0 1px,transparent 1px 14px),radial-gradient(ellipse at center,#161616 0%,#080808 75%)}
.lw-thumb-label{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:10px}
.lw-thumb-label::before{content:"";width:34px;height:34px;border:1.5px solid #3A3732;border-radius:50%;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M8 5v14l11-7z' fill='%233A3732'/></svg>") 56% 50%/14px no-repeat}
.lw-thumb-label::after{content:"VISUAL COMING SOON";font:500 11px/1 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.2em;color:#6E6A63}

/* play button on covers that open a full video */
.lw-card-link::before{content:"";position:absolute;inset:0;z-index:4}
.lw-card-playable .lw-thumb::before{content:"";position:absolute;z-index:3;left:50%;top:50%;width:68px;height:68px;margin:-34px 0 0 -34px;border-radius:50%;background:rgba(200,20,27,.92) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M8 5v14l11-7z' fill='%23F2EDE3'/></svg>") 55% 50%/26px no-repeat;box-shadow:0 10px 40px rgba(0,0,0,.45);transition:transform .35s cubic-bezier(.2,.8,.2,1),background-color .3s}
.lw-card-playable:hover .lw-thumb::before{transform:scale(1.14);background-color:#E0301E}

.lw-tag{font-size:12px;letter-spacing:.12em;color:#F0473F}
.lw-h3{margin:0;font-weight:800;font-size:24px;line-height:1.15;color:#F2EDE3}
.lw-card-feature .lw-h3{font-size:30px}
.lw-card-text{margin:0;color:#CFC9BE}
.lw-card-link{align-self:flex-start;font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:#F2EDE3;text-decoration:none;padding-bottom:4px;background:linear-gradient(#C8141B,#C8141B) left bottom/0 2px no-repeat;transition:background-size .35s}
.lw-card-link:hover{background-size:100% 2px}

/* ---------- Studio (two crafts) ---------- */
.lw-studio{background-color:#F2EDE3;color:#0A0A0A;padding-top:88px;padding-bottom:88px}
.lw-studio .lw-section-head{border-bottom-color:#CFC7B8}
.lw-studio .lw-h2{color:#0A0A0A}
.lw-studio .lw-h2::before{color:#A3121A}
.lw-studio-lead{margin:0;max-width:480px;color:#3A3732}
.lw-craft-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.lw-craft{padding:36px;border-radius:4px;display:flex;flex-direction:column;gap:20px;color:#F2EDE3;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.lw-craft:hover{transform:translateY(-6px)}
.lw-craft-dark{background-color:#0A0A0A}
.lw-craft-red{background-color:#C8141B}
.lw-tag-light{color:#F2EDE3}
.lw-craft-title{margin:0;font-weight:900;font-size:34px;line-height:1;text-transform:uppercase;color:#F2EDE3}
.lw-craft-text{margin:0;color:#CFC9BE}
.lw-craft-red .lw-craft-text{color:#F2EDE3}
.lw-craft-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;border-top:1px solid #2A2A2A}
.lw-craft-item{padding-top:11px;padding-bottom:11px;border-bottom:1px solid #2A2A2A}
.lw-craft-red .lw-craft-item{border-bottom-color:rgba(242,237,227,.45)}

/* ---------- DeadLived ---------- */
.lw-game{display:flex;gap:48px;flex-wrap:wrap;align-items:center}
.lw-game-text{flex:1 1 380px;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.lw-game-title{margin:0;font-weight:900;font-size:clamp(56px,9vw,140px);line-height:.95;letter-spacing:-.03em;text-transform:uppercase;color:#F2EDE3}
.lw-game-lead{margin:0;font-size:19px;color:#CFC9BE;max-width:512px}
.lw-game-media{position:relative;overflow:hidden;flex:1 1 420px;max-width:620px;aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;border:1px solid #262626;background-color:#111111}

/* ---------- About ---------- */
.lw-about{border-top:1px solid #1F1F1F;padding-top:88px;padding-bottom:88px}
.lw-about-inner{display:flex;gap:48px;flex-wrap:wrap}
.lw-about-title{flex:0 1 320px}
.lw-about-text{flex:1 1 420px;display:flex;flex-direction:column;gap:16px;max-width:704px}
.lw-about-p{margin:0;font-size:clamp(19px,1.6vw,23px);line-height:1.5;color:#DCD6CB}

/* ---------- Contact ---------- */
.lw-contact{background-color:#C8141B;color:#F2EDE3;padding-top:88px;padding-bottom:88px}
.lw-contact-title{margin:0;font-weight:900;font-size:clamp(56px,11vw,190px);line-height:.86;letter-spacing:-.035em;text-transform:uppercase;color:#F2EDE3}
.lw-contact-links{display:flex;gap:40px;flex-wrap:wrap}
.lw-contact-link{font-weight:700;font-size:19px;color:#F2EDE3;text-decoration:none;padding-bottom:4px;background:linear-gradient(#F2EDE3,#F2EDE3) left bottom/0 2px no-repeat;transition:background-size .35s}
.lw-contact-link:hover{background-size:100% 2px}

/* ---------- Footer ---------- */
.lw-footer{padding-top:32px;padding-bottom:32px}
.lw-footer-inner{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* ---------- Scroll reveal ---------- */
@supports (animation-timeline:view()){
  .lw-card,.lw-craft,.lw-game-text,.lw-game-media,.lw-about-text,.lw-contact-title{animation:lw-up linear both;animation-timeline:view();animation-range:entry 0% cover 22%}
}

/* ---------- Responsive ---------- */
@media screen and (max-width:991px){
  .lw-work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media screen and (max-width:767px){
  .lw-work-grid{grid-template-columns:minmax(0,1fr)}
  .lw-card-feature{grid-column:auto}
  .lw-card-feature .lw-h3{font-size:24px}
  .lw-section,.lw-studio,.lw-about,.lw-contact{padding-top:64px;padding-bottom:64px}
  .lw-craft-grid{grid-template-columns:minmax(0,1fr)}
  .lw-craft{padding:24px}
  .lw-nav-links{gap:16px}
  .lw-hero{padding-bottom:64px}
  .lw-hero-video{display:none}
  .lw-hero::after{display:none}
}
@media screen and (max-width:479px){
  .lw-nav-link:not(.lw-nav-link-red){display:none}
  .lw-logo-img{height:52px}
  .lw-nav.is-scrolled .lw-logo-img{height:44px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .lw-hero-video{display:none}
}

.lw-hero .lw-rec .lw-mono{color:#E6E1D8;text-shadow:0 1px 14px rgba(0,0,0,.6)}
