/* Papo Digital — art-directed interactive layer */
:root{--lime:#d7f76b;--navy:#0b1720;--cream:#f4f3ee}
html{scroll-padding-top:75px}
body{font-family:Arial,"Noto Sans Hebrew",sans-serif}
.hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 82% 32%,#234a4c 0,transparent 46%),#09141e}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;opacity:.34;background:linear-gradient(110deg,transparent 15%,#4b897722 40%,transparent 55%),repeating-linear-gradient(90deg,transparent 0,transparent calc(20% - 1px),#b2e6ce16 20%)}
.hero::after{content:"P / D";position:absolute;left:-4%;bottom:-10%;font:900 clamp(150px,23vw,390px)/1 Arial;letter-spacing:-.14em;color:#ffffff09;pointer-events:none;z-index:-1;direction:ltr}
.hero-grid{position:relative;min-height:690px}
.hero h1{font-size:clamp(62px,7.8vw,118px);line-height:.97;letter-spacing:-.085em;max-width:800px}
.hero h1 em{display:inline-block;position:relative}
.hero h1 em:after{content:"";position:absolute;bottom:-8px;right:0;left:0;height:4px;background:var(--lime);transform:scaleX(.65);transform-origin:right}
.hero .mock{position:relative;background:transparent;transform:perspective(1100px) rotateY(10deg) rotateX(5deg);box-shadow:none;padding:10px;will-change:transform}
.hero .mock::before{content:"";position:absolute;inset:6% -4%;border:1px solid #7cae9c66;transform:translate(20px,-18px);pointer-events:none}
.hero .mock::after{content:"PROJECT / 01";position:absolute;top:-22px;left:20px;color:#c8f1cb;font:11px monospace;direction:ltr}
.hero .mock img{border:7px solid #e9eee8;box-shadow:0 40px 90px #000a}
.hero .btn{transition:transform .25s,background .25s}.hero .btn:hover{transform:translateY(-3px)}
.motion-label{position:absolute;left:6px;bottom:18px;writing-mode:vertical-rl;font:11px monospace;color:#a9c7bc;letter-spacing:.15em;direction:ltr}
.motion-rail{position:absolute;bottom:28px;right:0;left:0;display:flex;justify-content:space-between;align-items:center;gap:15px;color:#c2d7d3;font:11px monospace;direction:ltr;opacity:.85}
.motion-rail span:last-child{width:30%;height:1px;background:linear-gradient(90deg,#d7f76b,#d7f76b33)}
.editorial-main{overflow:hidden}.editorial-main strong{position:relative;z-index:2}
.editorial-main .editorial-mark{transition:transform .6s ease}.editorial-main:hover .editorial-mark{transform:translate(35px,-35px)}
.section h2,.editorial h2,.experience h2{font-weight:900}
.section .grid .card{border-radius:0;position:relative;overflow:hidden}
.section .grid .card:before{content:"";position:absolute;right:0;top:0;width:100%;height:4px;background:var(--lime);transform:scaleX(0);transform-origin:right;transition:transform .35s}
.section .grid .card:hover:before{transform:scaleX(1)}
.journey>div{cursor:pointer;transition:background .25s,border-color .25s,transform .25s}
.journey>div:hover,.journey>div.is-selected{background:#203c3e;border-color:#d7f76b;transform:translateY(-4px)}
.journey>div:focus-visible{outline:3px solid #d7f76b;outline-offset:3px}
.journey>div b{font-size:clamp(20px,2vw,28px)}
.journey-detail{display:grid;grid-template-columns:130px 1fr;gap:25px;margin-top:18px;padding:27px 32px;background:#d7f76b;color:#0b1d20;min-height:140px;align-items:center}
.journey-detail .step-index{font:800 39px/1 monospace;direction:ltr}
.journey-detail h3{font-size:27px;line-height:1.1;margin:0 0 6px}
.journey-detail p{margin:0;color:#405a50}
.journey-progress{height:4px;background:#49615d;margin-top:18px;overflow:hidden}
.journey-progress span{display:block;height:100%;width:25%;background:#d7f76b;transition:transform .35s}
.kinetic-band{background:#d7f76b;overflow:hidden;padding:19px 0;white-space:nowrap;color:#0b1921;border-top:1px solid #0b1921;border-bottom:1px solid #0b1921}
.kinetic-track{display:flex;gap:40px;width:max-content;animation:kinetic-scroll 30s linear infinite;direction:ltr}
.kinetic-track span{font:900 clamp(22px,3.3vw,46px)/1 Arial;letter-spacing:-.05em}
.kinetic-track .star{font-size:28px}
@keyframes kinetic-scroll{to{transform:translateX(-50%)}}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal.in-view{opacity:1;transform:none}
.showcase-screen img{transition:opacity .28s,transform .55s cubic-bezier(.2,.7,.2,1)}
.showcase-screen img.is-changing{opacity:.35;transform:perspective(1000px) rotateY(-4deg) rotateZ(0) scale(.97)}
.form input:focus,.form select:focus{outline:2px solid #659b84;outline-offset:2px}
@media(max-width:850px){.hero-grid{min-height:0}.motion-label{display:none}.journey-detail{grid-template-columns:85px 1fr;padding:20px}.journey-detail .step-index{font-size:27px}}
@media(max-width:600px){.hero h1{font-size:clamp(53px,13vw,75px)}.hero .mock{will-change:auto}.motion-rail{position:static;margin-top:15px}.journey>div{min-height:150px}.journey-detail{grid-template-columns:1fr;gap:8px}.journey-detail h3{font-size:23px}.kinetic-track span{font-size:25px}.reveal{transform:translateY(14px)}}
@media(prefers-reduced-motion:reduce){.kinetic-track{animation:none}.reveal{opacity:1;transform:none;transition:none}.journey>div,.showcase-screen img,.hero .mock{transition:none!important;transform:none!important}}
