:root{--bg:#080910;--panel:#10121d;--panel2:#141725;--text:#f4f5fb;--muted:#989caf;--line:rgba(255,255,255,.09);--purple:#9b7bff;--blue:#5a8cff;--cyan:#66d9ed;--font:'DM Sans',sans-serif;--display:'Manrope',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);overflow-x:hidden}a{color:inherit;text-decoration:none}.ambient{position:absolute;z-index:-1;pointer-events:none;border-radius:50%;filter:blur(100px);opacity:.15}.ambient-one{width:520px;height:520px;top:0;left:45%;background:#6444d8}.ambient-two{width:400px;height:500px;top:1150px;right:-240px;background:#176cbd}.section-wrap{width:min(1160px,calc(100% - 64px));margin-inline:auto}.site-header{height:88px;width:min(1320px,calc(100% - 64px));margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:10}.brand{display:flex;align-items:center;gap:12px;font:800 13px var(--display);letter-spacing:1.3px}.brand-light{font-weight:500;color:#a7aabc}.brand-mark{width:30px;height:30px;border:1.5px solid #9a80ff;border-radius:10px;display:grid;place-items:center;transform:rotate(-9deg);box-shadow:0 0 22px #7955ff35}.brand-mark span{width:13px;height:13px;border:3px solid #b8a6ff;border-right-color:transparent;border-radius:50%;transform:rotate(-35deg)}.main-nav{display:flex;align-items:center;gap:38px;font-size:12px;color:#c0c3d0}.main-nav>a:not(.nav-contact):hover,.text-link:hover{color:white}.nav-contact{padding:13px 17px;border:1px solid #ffffff2c;border-radius:7px;color:white;transition:.25s}.nav-contact:hover{background:#fff;color:#090a12}.nav-contact span{margin-left:12px}.menu-toggle{display:none}.hero{min-height:690px;display:grid;grid-template-columns:1fr 1fr;align-items:center;position:relative;padding-top:35px;padding-bottom:65px}.hero-copy{position:relative;z-index:2;padding-bottom:30px}.eyebrow{font-size:10px;letter-spacing:2px;color:#aaaec1;font-weight:700;display:flex;align-items:center;gap:10px}.pulse-dot,.tag-dot{width:7px;height:7px;border-radius:50%;background:#7ce0cf;box-shadow:0 0 12px #7ce0cf}.hero h1,.section-heading h2,.studio-copy h2,.contact-inner h2{font:700 clamp(54px,6.4vw,88px)/1.04 var(--display);letter-spacing:-5px;margin:30px 0 23px}.gradient-text{background:linear-gradient(105deg,#b9a4ff 0%,#8297ff 48%,#74d8e7 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-lead{max-width:470px;font-size:16px;line-height:1.85;color:#aeb2c2}.hero-actions{display:flex;align-items:center;gap:30px;margin-top:35px}.button{min-height:50px;padding:0 20px;display:inline-flex;align-items:center;gap:26px;border-radius:6px;font-size:12px;font-weight:700;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px);box-shadow:0 12px 35px #7155db38}.button-primary{background:linear-gradient(110deg,#8a6bfa,#638cfb);color:white}.button-primary span{font-size:17px}.text-link{font-size:12px;color:#d1d3df;font-weight:600}.text-link span{margin-left:10px;color:#a996ff}.hero-note{display:flex;align-items:center;gap:12px;margin-top:70px;font-size:8px;letter-spacing:1.7px;color:#73788d}.note-line{width:32px;height:1px;background:#7e6bca}.hero-art{height:520px;position:relative;display:grid;place-items:center}.art-grid{position:absolute;inset:30px 0;background-image:linear-gradient(#ffffff09 1px,transparent 1px),linear-gradient(90deg,#ffffff09 1px,transparent 1px);background-size:36px 36px;mask-image:radial-gradient(ellipse,black 0%,transparent 72%);opacity:.6}.orbit{position:absolute;border:1px solid #a69aff28;border-radius:50%;transform:rotate(-28deg)}.orbit-a{width:430px;height:220px}.orbit-b{width:350px;height:460px;transform:rotate(58deg);border-color:#68b8e52c}.orbit-c{width:490px;height:300px;transform:rotate(76deg);border-style:dashed;border-color:#9c82ff25}.art-core{width:250px;height:250px;border-radius:50%;position:relative;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#34305c,#15172c 48%,#0c0d17 72%);box-shadow:inset 0 0 45px #9e8aff28,0 0 100px #6e58d52c;border:1px solid #b9a9ff38}.core-glow{position:absolute;inset:18px;border-radius:50%;border:1px solid #a7a1ff30;box-shadow:0 0 30px #8e75ff25}.core-c{font:800 145px/.8 var(--display);letter-spacing:-18px;padding-right:16px;background:linear-gradient(135deg,#f4efff,#a58bff 55%,#5fcde6);color:transparent;background-clip:text;filter:drop-shadow(0 0 25px #a18aff72)}.core-caption{position:absolute;bottom:48px;right:23px;font:800 8px/1.4 var(--display);letter-spacing:2px;color:#d5d1f3}.core-caption span{color:#8c91ac;font-weight:500}.float-tag{position:absolute;padding:11px 14px;border:1px solid #ffffff1a;background:#10121dcc;backdrop-filter:blur(12px);border-radius:5px;font-size:8px;letter-spacing:1.5px;color:#c7c9d6;box-shadow:0 12px 40px #0005}.tag-top{top:75px;right:0}.tag-icon{font-size:15px;color:#ad9bff;margin-right:8px}.tag-bottom{bottom:70px;left:2px}.tag-dot{display:inline-block;margin-right:8px;width:6px;height:6px}.art-cross{position:absolute;color:#a797ff;font-size:22px;font-weight:200}.cross-one{top:100px;left:45px}.cross-two{right:50px;bottom:120px}.hero-index{position:absolute;bottom:30px;right:0;display:flex;align-items:center;gap:13px;color:#656a7d;font-size:9px}.hero-index span:first-child{color:#d4c8ff}.index-rule{width:55px;height:1px;background:#44465a}.ticker{overflow:hidden;border-block:1px solid var(--line);background:#0c0e17;padding:20px 0}.ticker-track{display:flex;align-items:center;justify-content:space-around;gap:45px;white-space:nowrap;min-width:1000px;animation:marquee 36s linear infinite}.ticker-track span{font:700 10px var(--display);letter-spacing:2px;color:#9da1b4}.ticker-track i{font-style:normal;color:#9880ff;font-size:14px}@keyframes marquee{to{transform:translateX(-15%)}}.section{padding-top:130px;padding-bottom:130px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:55px}.section-heading h2,.studio-copy h2,.contact-inner h2{font-size:clamp(42px,5vw,62px);letter-spacing:-3.5px;line-height:1.12;margin:24px 0 0}.muted-heading{color:#73788d}.section-heading>p{max-width:320px;color:var(--muted);font-size:13px;line-height:1.8;margin:0 0 5px}.expertise-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.expertise-card{min-height:265px;padding:27px 27px 25px;background:linear-gradient(145deg,#131522,#0e1019);border:1px solid var(--line);border-radius:9px;transition:.3s}.expertise-card:hover,.project-card:hover{transform:translateY(-5px);border-color:#9d8bff55}.card-top{display:flex;align-items:center;justify-content:space-between}.card-number{font-size:10px;color:#747a90;letter-spacing:1px}.line-icon{font-size:25px;color:#a997ff}.expertise-card h3{font:700 20px var(--display);margin:35px 0 12px}.expertise-card p,.project-info p{font-size:12px;line-height:1.8;color:#999eb2;margin:0}.card-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:24px}.card-tags span{font-size:9px;color:#b8b4d2;background:#a38aff12;border:1px solid #a38aff22;padding:6px 9px;border-radius:3px}.projects-section{background:#0b0d15;border-block:1px solid var(--line)}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.project-card{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#10121c;transition:.3s}.project-visual{height:285px;position:relative;overflow:hidden;display:grid;place-items:center}.project-large{grid-column:span 2}.project-large .project-visual{height:350px}.visual-label{position:absolute;bottom:17px;left:18px;font-size:8px;letter-spacing:2px;color:#ffffff8a}.visual-timood{background:radial-gradient(ellipse at 55% 40%,#463d85,#1c2044 50%,#101426)}.mock-window{width:310px;height:255px;border-radius:12px;background:#f5f4ff;box-shadow:0 25px 80px #05071688;overflow:hidden;transform:rotate(-4deg)}.mock-bar{height:28px;background:#e7e5f5;display:flex;align-items:center;padding:0 10px;gap:4px}.mock-bar i{width:5px;height:5px;border-radius:50%;background:#b0abc9}.mock-bar span{margin-left:auto;font:800 8px var(--display);letter-spacing:1px;color:#565074}.mood-content{padding:24px 28px;color:#272448;position:relative}.mood-orb{position:absolute;width:115px;height:115px;border-radius:50%;right:28px;top:36px;background:radial-gradient(circle at 35% 30%,#fff9,#c2a6ff 28%,#7d72df 70%);box-shadow:0 8px 25px #8772db65}.mood-content small{font-size:7px;letter-spacing:1.5px;color:#7c779e}.mood-content strong{display:block;font:800 25px/1.15 var(--display);margin-top:13px;letter-spacing:-1px}.mood-pills{display:flex;gap:9px;margin-top:25px}.mood-pills b{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#e8e3ff;color:#7563c3;font-size:12px}.visual-spingo{background:radial-gradient(circle at 50% 45%,#4c2c89,#20173e 55%,#131020)}.wheel{width:205px;height:205px;border-radius:50%;background:conic-gradient(#8b65ed 0 25%,#4234a5 25% 50%,#c17be9 50% 75%,#6259d8 75%);border:8px solid #c6aaff;box-shadow:0 0 0 8px #ffffff18,0 20px 50px #05020f88;position:relative;display:grid;place-items:center}.wheel:after{content:'';position:absolute;top:-19px;border-left:12px solid transparent;border-right:12px solid transparent;border-top:24px solid #fff;filter:drop-shadow(0 3px 4px #0008)}.wheel-center{width:54px;height:54px;background:#151024;border:3px solid #d7c4ff;border-radius:50%;display:grid;place-items:center;font:800 24px var(--display);z-index:1}.wheel>span{position:absolute;font-size:9px;font-weight:700;color:white}.wheel>span:nth-of-type(1){top:25px;right:43px}.wheel>span:nth-of-type(2){bottom:36px;right:32px}.wheel>span:nth-of-type(3){bottom:36px;left:32px}.wheel>span:nth-of-type(4){top:25px;left:43px}.visual-homespace{background:radial-gradient(ellipse at 50% 80%,#244b65,#142b3c 52%,#101923)}.home-ui{width:235px;height:245px;border-radius:14px;background:#f0f5f8;color:#203a4c;padding:16px;box-shadow:0 25px 65px #020a1280;transform:rotate(4deg)}.home-top{display:flex;justify-content:space-between;font:800 12px var(--display)}.home-top span span{color:#4ba8b8}.home-top b{font-size:17px}.home-welcome{font-size:12px;margin-top:26px;line-height:1.5}.home-widgets{display:flex;gap:7px;margin-top:18px}.home-widgets i{height:55px;flex:1;border-radius:7px;background:linear-gradient(145deg,#cce7ed,#a9d3dc)}.home-widgets i:nth-child(2){background:linear-gradient(145deg,#e8dcff,#c7b9ee)}.home-widgets i:nth-child(3){background:linear-gradient(145deg,#ffe8c9,#e9cba9)}.home-nav{display:flex;justify-content:space-around;margin-top:23px;color:#5b8795}.visual-waterly{background:radial-gradient(circle at 50% 50%,#1f627e,#102a45 60%,#0c1b31)}.water-phone{width:155px;height:240px;border-radius:19px;background:linear-gradient(155deg,#e8f8ff,#cdeafa);padding:15px;color:#174a68;box-shadow:0 25px 60px #030b1d99;transform:rotate(-5deg)}.water-header{font:800 13px var(--display);display:flex;justify-content:space-between}.water-header span{color:#42a9d1}.water-ring{width:105px;height:105px;border-radius:50%;margin:20px auto 13px;border:8px solid #b4e2f1;border-top-color:#329ac4;border-right-color:#329ac4;display:grid;place-items:center;transform:rotate(-25deg)}.water-ring>div{transform:rotate(25deg);display:flex;flex-direction:column;align-items:center}.water-ring strong{font:800 24px var(--display)}.water-ring small{font-size:8px;color:#6e9cb1}.water-bars{display:flex;gap:5px;justify-content:center}.water-bars i{width:17px;height:5px;border-radius:5px;background:#76c4df}.water-bars i:nth-child(n+4){background:#c3e5f0}.visual-smartgate{background:linear-gradient(145deg,#29324b,#111a2c)}.gate-scene{width:260px;height:190px;position:relative}.gate-sun{position:absolute;right:25px;top:12px;width:55px;height:55px;border-radius:50%;background:linear-gradient(135deg,#d4c7ff,#6e86cb);box-shadow:0 0 40px #8da2ff66}.gate-line{position:absolute;bottom:40px;width:100%;height:1px;background:#8ea2c855}.gate-door{position:absolute;bottom:42px;left:35px;width:180px;height:100px;border:2px solid #9aadd1;background:linear-gradient(145deg,#384a67,#1a2a43);display:flex;gap:8px;padding:9px}.gate-door i{flex:1;border:1px solid #9baecc66;background:#9eb3d01a}.gate-base{position:absolute;bottom:29px;left:20px;width:210px;height:10px;background:#9aabc6;border-radius:3px}.gate-signal{position:absolute;top:15px;left:0;font-size:8px;letter-spacing:2px;color:#a4d6df}.visual-security{background:radial-gradient(circle at 50%,#253b4d,#101c2c 65%,#0b1421)}.security-radar{width:200px;height:200px;border:1px solid #6ac7d044;border-radius:50%;position:relative;background:repeating-radial-gradient(circle,transparent 0 32px,#65d0dc25 33px 34px),linear-gradient(90deg,transparent 49.5%,#65d0dc25 50%,transparent 50.5%),linear-gradient(0deg,transparent 49.5%,#65d0dc25 50%,transparent 50.5%);overflow:hidden}.radar-sweep{position:absolute;inset:0;background:conic-gradient(from 0deg,transparent 0 270deg,#67d5d04c 360deg);border-radius:50%;animation:spin 7s linear infinite}.radar-center{position:absolute;inset:0;display:grid;place-items:center;color:#8be0d8;font-size:27px}.radar-point{position:absolute;width:7px;height:7px;border-radius:50%;background:#8be0d8;top:54px;right:48px;box-shadow:0 0 15px #8be0d8}@keyframes spin{to{transform:rotate(360deg)}}.project-info{display:flex;justify-content:space-between;align-items:center;padding:22px 23px 24px}.project-type{font-size:8px;letter-spacing:1.7px;color:#9385d3}.project-info h3{font:700 21px var(--display);margin:7px 0}.project-info p{max-width:390px}.project-arrow{font-size:21px;color:#a897ff;padding:0 5px}.projects-footnote{font-size:10px;color:#777d91;margin-top:22px}.studio-section{display:grid;grid-template-columns:.85fr 1fr;gap:110px;align-items:center}.studio-symbol{height:350px;display:grid;place-items:center;position:relative}.symbol-ring{width:250px;height:250px;border:1px solid #a48aff40;border-radius:50%;box-shadow:0 0 90px #7d62db20,inset 0 0 50px #7d62db12;position:absolute}.symbol-ring:before,.symbol-ring:after{content:'';position:absolute;inset:-27px;border:1px dashed #8f7be52a;border-radius:50%;transform:rotate(35deg)}.symbol-ring:after{inset:25px;border-style:solid;border-color:#8f7be522;transform:rotate(-25deg)}.symbol-letter{font:800 180px var(--display);letter-spacing:-20px;padding-right:20px;background:linear-gradient(135deg,#e3dcff,#9073ff 55%,#5fc9e2);color:transparent;background-clip:text;filter:drop-shadow(0 0 25px #8b75f966)}.studio-symbol>span{position:absolute;bottom:35px;font-size:8px;letter-spacing:3px;color:#777d92}.studio-copy h2{margin-bottom:22px}.studio-copy p{color:#9fa4b7;font-size:13px;line-height:1.9;max-width:500px}.studio-copy .studio-lead{font-size:16px;color:#e0e1eb;line-height:1.7}.studio-copy .text-link{display:inline-block;margin-top:20px}.contact-section{border-block:1px solid var(--line);background:radial-gradient(ellipse at 75% 40%,#24204b 0%,#10111d 48%,#0b0d15 100%);padding:110px 0}.contact-inner{display:grid;grid-template-columns:1fr .75fr;gap:80px;align-items:center}.contact-inner h2{margin-bottom:22px}.contact-inner>div:first-child>p{color:#a2a6b7;font-size:13px;line-height:1.8;max-width:390px}.contact-card{padding:30px;background:#111321c9;border:1px solid #ffffff1a;border-radius:10px;box-shadow:0 20px 70px #0004}.contact-orb{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#9476ff,#65bfe5);font-size:20px;margin-bottom:25px}.contact-card>span{font-size:8px;letter-spacing:1.7px;color:#9990c9}.contact-card h3{font:700 27px var(--display);margin:10px 0}.contact-card p{font-size:12px;line-height:1.8;color:#9da2b5;margin-bottom:22px}.contact-card small{display:block;margin-top:13px;font-size:9px;color:#777d90}.site-footer{background:#080910}.footer-main{height:105px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.footer-main>p{font-size:11px;color:#8b90a2}.back-top{font-size:8px;letter-spacing:1.5px;color:#9b9fb0}.footer-bottom{min-height:65px;display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#707588}.footer-bottom b{color:#a18bff;margin-left:7px}
@media(max-width:800px){.section-wrap{width:min(100% - 42px,620px)}.site-header{width:calc(100% - 42px);height:75px}.main-nav{gap:18px}.main-nav>a{font-size:10px}.nav-contact{padding:11px}.hero{min-height:auto;grid-template-columns:1fr;padding-top:85px;padding-bottom:65px}.hero-copy{padding-bottom:0}.hero h1{font-size:76px}.hero-art{height:430px;margin-top:25px}.hero-index{bottom:15px}.section{padding-top:95px;padding-bottom:95px}.section-heading{gap:30px}.section-heading>p{max-width:250px}.expertise-card{padding:22px;min-height:285px}.studio-section{gap:45px}.studio-symbol{height:290px}.symbol-ring{width:205px;height:205px}.symbol-letter{font-size:150px}.contact-inner{gap:35px}}
@media(max-width:600px){.section-wrap{width:calc(100% - 40px)}.site-header{width:calc(100% - 40px)}.menu-toggle{display:flex;width:40px;height:40px;border:1px solid var(--line);border-radius:6px;background:#10121c;flex-direction:column;align-items:center;justify-content:center;gap:5px}.menu-toggle span{width:16px;height:1px;background:white;transition:.2s}.main-nav{position:absolute;top:74px;left:-20px;right:-20px;padding:22px 20px 25px;background:#0c0e18f5;backdrop-filter:blur(18px);border-bottom:1px solid var(--line);display:none;align-items:stretch;flex-direction:column;gap:20px}.main-nav.open{display:flex}.main-nav>a{font-size:13px}.nav-contact{text-align:center}.hero{padding-top:70px}.hero h1{font-size:62px;letter-spacing:-4px}.hero-lead{font-size:14px}.hero-actions{gap:20px;flex-wrap:wrap}.hero-note{margin-top:48px;font-size:7px}.hero-art{height:340px;margin-top:15px}.art-core{width:190px;height:190px}.core-c{font-size:112px}.core-caption{bottom:34px;right:17px;font-size:7px}.orbit-a{width:320px;height:170px}.orbit-b{width:280px;height:360px}.orbit-c{width:350px;height:230px}.tag-top{top:35px;right:-5px}.tag-bottom{bottom:30px;left:-4px;font-size:7px}.cross-one{left:10px;top:70px}.cross-two{right:15px;bottom:85px}.section{padding-top:78px;padding-bottom:78px}.section-heading{display:block;margin-bottom:35px}.section-heading h2,.studio-copy h2,.contact-inner h2{font-size:44px;letter-spacing:-2.5px}.section-heading>p{margin-top:22px}.expertise-grid{grid-template-columns:1fr;gap:12px}.expertise-card{min-height:225px}.expertise-card h3{margin-top:24px}.card-tags{margin-top:17px}.projects-grid{grid-template-columns:1fr;gap:15px}.project-large{grid-column:auto}.project-large .project-visual,.project-visual{height:250px}.mock-window{transform:scale(.88) rotate(-4deg)}.studio-section{grid-template-columns:1fr;gap:25px}.studio-symbol{height:250px;order:2}.studio-copy{order:1}.symbol-ring{width:185px;height:185px}.symbol-letter{font-size:135px}.studio-symbol>span{bottom:12px}.contact-section{padding:80px 0}.contact-inner{grid-template-columns:1fr;gap:30px}.contact-card{padding:25px}.footer-main{height:auto;padding:25px 0;gap:15px;flex-wrap:wrap}.footer-main>p{order:3;width:100%;margin:0}.footer-bottom{padding:17px 0;gap:10px;align-items:flex-start;flex-direction:column}.ticker-track{gap:28px}.ticker{padding:17px 0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Official Creatix Studio identity and replaceable project screenshots */
.brand-logo{display:block;width:54px;height:54px;object-fit:cover;border-radius:12px;border:1px solid #ffffff20}
.brand{gap:12px}
.hero-art{display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-logo-frame{width:min(100%,430px);aspect-ratio:1;border-radius:22px;overflow:hidden;box-shadow:0 25px 90px #0008,0 0 55px #8e70ff30;border:1px solid #ffffff25}
.hero-logo{display:block;width:100%;height:100%;object-fit:cover}
.project-visual{position:relative;overflow:hidden}
.project-screenshot{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:3}
.project-screenshot[hidden]{display:none}
@media(max-width:600px){.brand-logo{width:46px;height:46px}.hero-logo-frame{width:min(88%,340px);border-radius:16px}}

/* Creatix Studio v3 — softer geometry, scroll motion and project status */
:root { --radius-card: 22px; }
.expertise-card,.project-card,.contact-card,.hero-logo-frame,.button,.nav-contact,
.mock-window,.home-ui,.water-phone,.float-tag,.menu-toggle,.card-tags span {
  border-radius: 18px;
}
.project-card { border-radius: 24px; }
.project-visual { border-radius: 22px 22px 0 0; }
.project-info { align-items: flex-start; gap: 18px; }
.project-status {
  display:inline-flex; align-items:center; gap:7px; margin-top:12px;
  padding:7px 11px; border:1px solid #9b87ff35; border-radius:999px;
  background:#8d76ff14; color:#c5b9ff; font-size:9px; font-weight:700;
  letter-spacing:.35px;
}
.project-status::before { content:""; width:6px; height:6px; border-radius:50%; background:#a891ff; box-shadow:0 0 12px #a891ff; }
.project-card[hidden] { display:none !important; }
.reveal { opacity:0; transform:translateY(34px) scale(.985); filter:blur(5px);
  transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1),filter .75s ease;
  transition-delay:var(--reveal-delay,0ms);
}
.reveal.is-visible { opacity:1; transform:translateY(0) scale(1); filter:blur(0); }
.hero-copy.reveal { transform:translateX(-28px); }
.hero-copy.reveal.is-visible { transform:translateX(0); }
.hero-art.reveal { transform:translateX(28px) scale(.97); }
.hero-art.reveal.is-visible { transform:translateX(0) scale(1); }
.expertise-card,.project-card { transition:transform .45s cubic-bezier(.2,.7,.2,1),border-color .35s,box-shadow .35s; }
.expertise-card:hover,.project-card:hover { transform:translateY(-8px); box-shadow:0 22px 70px #0005; }
.closing-section { padding-top:70px; padding-bottom:120px; }
.closing-card { padding:clamp(32px,7vw,76px); border:1px solid #a58cff30; border-radius:30px;
  background:radial-gradient(ellipse at 85% 15%,#51418b55,transparent 45%),linear-gradient(135deg,#171629,#0d101a);
  box-shadow:0 30px 100px #0004; }
.closing-card h2 { font:800 clamp(42px,6vw,68px)/1.05 var(--display); letter-spacing:-3px; margin:25px 0 18px; }
.closing-card p { max-width:530px; color:#aeb2c2; font-size:14px; line-height:1.9; margin-bottom:28px; }
.footer-links { display:flex; align-items:center; gap:22px; }
.admin-entry { color:#777d91; font-size:8px; letter-spacing:1.5px; transition:color .2s; }
.admin-entry:hover { color:#c1b3ff; }
@media(max-width:600px) {
  .closing-section { padding-top:40px; padding-bottom:75px; }
  .closing-card { border-radius:24px; }
  .closing-card h2 { letter-spacing:-2px; }
}
@media(prefers-reduced-motion:reduce) {
  .reveal,.reveal.is-visible { opacity:1; transform:none; filter:none; transition:none; }
}

/* V4: social contact and clickable project details */
.project-card{cursor:pointer}.project-card:focus-visible{outline:2px solid #a996ff;outline-offset:5px}
.contact-reworked{align-items:center}
.social-contact-card{display:grid;gap:13px;padding:22px;border:1px solid #ffffff1b;border-radius:24px;background:#111321c9;box-shadow:0 22px 70px #0004}
.social-link{display:flex;align-items:center;gap:15px;min-width:min(100%,390px);padding:18px;border-radius:17px;text-decoration:none;color:#f7f5ff;background:#ffffff08;border:1px solid #ffffff12;transition:transform .25s,border-color .25s,background .25s}
.social-link:hover{transform:translateY(-3px);border-color:#a18bff70;background:#a18bff12}
.social-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;font-size:20px;background:linear-gradient(135deg,#8d6cff,#4d8be9)}
.youtube-link .social-icon{background:linear-gradient(135deg,#f34d66,#a91f52)}
.social-link small{display:block;color:#8e93a8;font-size:8px;letter-spacing:1.5px;margin-bottom:5px}
.social-link strong{font:700 13px var(--display)}.social-arrow{margin-left:auto;color:#b5a5ff;font-size:19px}
.social-note{margin:5px 3px 0;color:#8f94a8;font-size:10px}
.project-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.project-modal.open{opacity:1;visibility:visible}.project-modal-backdrop{position:absolute;inset:0;background:#05060bdc;backdrop-filter:blur(12px)}
.project-modal-panel{position:relative;width:min(100%,760px);max-height:min(90vh,900px);overflow:auto;border:1px solid #ffffff20;border-radius:28px;background:linear-gradient(145deg,#171827,#0c0e17);box-shadow:0 35px 120px #000b;transform:translateY(24px) scale(.98);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.project-modal.open .project-modal-panel{transform:translateY(0) scale(1)}
.modal-close{position:absolute;z-index:2;top:15px;right:15px;width:42px;height:42px;border:1px solid #ffffff30;border-radius:50%;background:#090a13cc;color:white;font-size:27px;cursor:pointer}
.modal-eyebrow{padding:25px 30px 15px;color:#a997ff;font-size:9px;letter-spacing:2px}
.modal-visual{height:260px;margin:0 22px;overflow:hidden;border-radius:20px;background:radial-gradient(circle at 50% 50%,#43366e,#111522);display:grid;place-items:center}
.modal-visual img{width:100%;height:100%;object-fit:contain}.modal-content{padding:25px 32px 35px}
.modal-type{color:#a997ff;font-size:9px;letter-spacing:1.7px}.modal-content h2{font:800 clamp(32px,5vw,48px)/1.1 var(--display);letter-spacing:-2px;margin:10px 0}
.modal-content>p{color:#c2c5d3;font-size:14px;line-height:1.8;margin:20px 0 12px}.modal-detail{color:#969caf;font-size:13px;line-height:1.9;white-space:pre-line}
body.modal-open{overflow:hidden}.footer-links{flex-wrap:wrap}.footer-links>a:not(.back-top):not(.admin-entry){color:#aaa0d5;font-size:9px}
@media(max-width:600px){.project-modal{padding:10px}.project-modal-panel{border-radius:22px;max-height:94vh}.modal-eyebrow{padding:22px 20px 12px}.modal-visual{height:210px;margin:0 12px;border-radius:16px}.modal-content{padding:22px 21px 28px}.social-contact-card{padding:14px}}

/* V5: colored project states, direct contact form and social image marks */
.project-status{border:1px solid transparent}
.project-status::before{box-shadow:none}
.project-status.status-progress{color:#80b8ff;background:#3188ff18;border-color:#4b9bff40}
.project-status.status-progress::before{background:#55a4ff;box-shadow:0 0 12px #55a4ff}
.project-status.status-soon{color:#f5c66b;background:#f5b94218;border-color:#f5b94245}
.project-status.status-soon::before{background:#f5bd4f;box-shadow:0 0 12px #f5bd4f}
.project-status.status-done{color:#75e0a4;background:#2dd47718;border-color:#2dd47745}
.project-status.status-done::before{background:#49d88b;box-shadow:0 0 12px #49d88b}
.project-status.status-paused{color:#c1a9ff;background:#9b78ff18;border-color:#9b78ff45}
.project-status.status-paused::before{background:#a98aff;box-shadow:0 0 12px #a98aff}
.contact-reworked{align-items:start}
.contact-email{display:inline-flex;gap:12px;align-items:center;margin:16px 0 22px;color:#c6baff;font-size:13px;text-decoration:none}
.contact-socials{display:flex;gap:12px;flex-wrap:wrap}
.social-icon-link{display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid #ffffff1c;border-radius:14px;background:#ffffff08;color:#e9e7f5;text-decoration:none;font-size:11px;transition:transform .2s,border-color .2s}
.social-icon-link:hover{transform:translateY(-3px);border-color:#a995ff88}
.social-icon-link img{width:25px;height:25px;object-fit:contain}
.contact-form{display:grid;gap:10px;padding:26px;border:1px solid #ffffff1c;border-radius:24px;background:linear-gradient(145deg,#171827,#10121d);box-shadow:0 24px 75px #0005}
.form-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}
.form-heading span{font-size:9px;letter-spacing:1.8px;color:#b9aaff;font-weight:700}
.form-heading small,.form-note{color:#858ba0;font-size:10px}
.contact-form label{font-size:10px;color:#b7bbca;margin-top:5px}
.contact-form input,.contact-form textarea{width:100%;border:1px solid #ffffff20;border-radius:12px;background:#090b14;color:#f5f4fb;padding:13px 14px;font:13px "DM Sans",sans-serif;outline:none;resize:vertical}
.contact-form input:focus,.contact-form textarea:focus{border-color:#a28bff;box-shadow:0 0 0 3px #a28bff18}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:#666d82}
.contact-submit{border:0;cursor:pointer;margin-top:8px;justify-content:center}
.form-note{line-height:1.6;margin:0}
.footer-social{display:inline-flex;align-items:center;gap:7px}
.footer-social img{width:17px;height:17px;object-fit:contain}
@media(max-width:760px){.contact-form{padding:20px}.contact-reworked{gap:30px}}

/* V7 — responsive layout, remote media and screenshot galleries */
.admin-identity{margin:34px 0 48px;padding:24px;border:1px solid #ffffff18;border-radius:22px;background:linear-gradient(145deg,#151725,#10121c)}
.admin-section-heading h2{font:700 22px Manrope;margin:0 0 6px}.admin-section-heading p,.admin-hint{font-size:11px;color:#9298ad;line-height:1.6;margin:0 0 18px}
.identity-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.identity-card{min-width:0;padding:18px;border:1px solid #ffffff16;border-radius:17px;background:#0b0d16;display:flex;flex-direction:column;align-items:flex-start;gap:12px}.identity-card h3{font:700 14px Manrope;margin:0}.identity-card input[type=file],.admin-field input[type=file]{max-width:100%;color:#aeb2c4;font:11px 'DM Sans'}.identity-preview{display:block;max-width:100%;object-fit:cover;border:1px solid #ffffff20;background:#161827}.avatar-preview{width:112px;height:112px;border-radius:50%}.banner-preview{width:100%;height:130px;border-radius:13px;object-position:center}.screenshot-previews{display:flex;flex-wrap:wrap;gap:10px;margin-top:5px}.screenshot-thumb{position:relative;width:112px;height:82px;border-radius:10px;overflow:hidden;border:1px solid #ffffff25;background:#171a29}.screenshot-thumb img{width:100%;height:100%;object-fit:cover}.screenshot-thumb button{position:absolute;right:5px;top:5px;width:24px;height:24px;border:0;border-radius:50%;background:#090a13dd;color:#fff;font-size:18px;cursor:pointer}.studio-profile-image{width:100%;height:100%;object-fit:cover;border-radius:inherit;position:absolute;inset:0}.studio-symbol{position:relative;overflow:hidden}.modal-visual{height:auto;min-height:180px;max-height:460px;padding:12px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px}.modal-visual img{width:auto;max-width:100%;height:auto;max-height:420px;object-fit:contain;border-radius:12px;flex:1 1 280px}
@media(max-width:900px){.section-wrap{width:min(100% - 48px,1120px)}.hero{gap:28px}.hero-copy{max-width:620px}.expertise-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.projects-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-inner{gap:32px}}
@media(max-width:640px){.section-wrap{width:calc(100% - 36px)}.site-header{padding-inline:18px}.main-nav{right:18px;left:18px}.hero{min-height:auto;padding-top:64px;padding-bottom:56px;grid-template-columns:1fr}.hero-copy h1{font-size:clamp(42px,12vw,64px);letter-spacing:-2.8px}.hero-lead{font-size:14px}.hero-art{max-width:300px;margin:12px auto 0}.hero-index{display:none}.section{padding-top:72px;padding-bottom:72px}.section-heading{display:grid;grid-template-columns:1fr;gap:14px}.section-heading h2{font-size:clamp(34px,9vw,48px)}.expertise-grid,.projects-grid{grid-template-columns:1fr;gap:16px}.project-card,.project-large{grid-column:auto}.project-visual{min-height:220px}.project-info{padding:20px}.studio-section{grid-template-columns:1fr;gap:30px}.studio-symbol{width:min(100%,270px);margin:auto}.contact-inner{grid-template-columns:1fr}.contact-form{padding:20px}.footer-main{display:grid;grid-template-columns:1fr;gap:15px}.footer-links{justify-content:flex-start;gap:14px}.footer-bottom{gap:10px;flex-direction:column;align-items:flex-start}.project-modal{padding:8px}.project-modal-panel{max-height:95dvh}.modal-visual{margin:0 10px;max-height:40vh}.modal-visual img{max-height:36vh;flex-basis:100%}.modal-content{padding:20px}.admin-header{height:auto;min-height:68px;flex-wrap:wrap;padding:12px 16px}.admin-back{margin-left:auto}.admin-main{width:calc(100% - 28px);margin:34px auto 60px}.admin-intro h1{font-size:clamp(42px,12vw,60px)}.admin-identity{padding:16px}.identity-grid{grid-template-columns:1fr}.identity-card{width:100%}.admin-toolbar{flex-direction:column;align-items:stretch}.admin-toolbar .admin-button{width:100%}.admin-project{padding:16px}.admin-project-head{align-items:flex-start;gap:8px;flex-direction:column}.admin-session{align-items:flex-start;flex-direction:column}.admin-session .admin-button{width:100%}.admin-project-actions .admin-button{width:100%}}
@media(min-width:641px) and (max-width:900px){.hero{grid-template-columns:1fr .8fr}.studio-section{gap:35px}.contact-inner{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;filter:none;transition:none}}

/* V8 — captures lisibles, sans recadrage ni agrandissement excessif */
.project-visual{display:grid;place-items:center;isolation:isolate;background:#111421;min-height:260px;}
.project-screenshot{position:relative;inset:auto;display:block;width:100%;height:100%;max-height:420px;object-fit:contain;object-position:center;background:transparent;padding:10px;z-index:4;}
.project-screenshot[hidden]{display:none!important}
.project-visual:has(.project-screenshot:not([hidden])) .mock-window,
.project-visual:has(.project-screenshot:not([hidden])) .wheel,
.project-visual:has(.project-screenshot:not([hidden])) .home-ui,
.project-visual:has(.project-screenshot:not([hidden])) .water-phone{display:none!important}
.project-visual:has(.project-screenshot:not([hidden])) .visual-label{z-index:5}
.modal-visual{height:auto;max-height:65vh;min-height:0;padding:12px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));align-items:start;gap:14px;overflow-y:auto;}
.modal-shot{margin:0;min-width:0;display:grid;place-items:center;min-height:120px;max-height:60vh;border:1px solid #ffffff18;border-radius:14px;background:#090b13;overflow:hidden;}
.modal-shot img{display:block;width:100%;height:auto;max-height:58vh;object-fit:contain;border-radius:12px;}
.modal-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;}
.project-link-button{display:inline-flex;align-items:center;gap:8px;padding:11px 15px;border-radius:999px;border:1px solid #9b7bff55;background:linear-gradient(120deg,#8b6cff22,#5a8cff18);color:#d9d0ff;font-size:12px;font-weight:700;transition:transform .2s,border-color .2s,background .2s;}
.project-link-button:hover{transform:translateY(-2px);border-color:#a995ff;background:#8b6cff35;}
@media(max-width:640px){.project-visual{min-height:220px}.project-screenshot{max-height:300px;padding:8px}.modal-visual{grid-template-columns:1fr;max-height:52vh}.modal-shot img{max-height:48vh}.modal-links{gap:8px}.project-link-button{font-size:11px;padding:10px 13px}}

/* V8 — captures lisibles, sans recadrage ni agrandissement excessif */
.project-visual{display:grid;place-items:center;isolation:isolate;background:#111421;min-height:260px;}
.project-screenshot{position:relative;inset:auto;display:block;width:100%;height:100%;max-height:420px;object-fit:contain;object-position:center;background:transparent;padding:10px;z-index:4;}
.project-screenshot[hidden]{display:none!important}
.project-visual:has(.project-screenshot:not([hidden])) .mock-window,
.project-visual:has(.project-screenshot:not([hidden])) .wheel,
.project-visual:has(.project-screenshot:not([hidden])) .home-ui,
.project-visual:has(.project-screenshot:not([hidden])) .water-phone{display:none!important}
.project-visual:has(.project-screenshot:not([hidden])) .visual-label{z-index:5}
.modal-visual{height:auto;max-height:65vh;min-height:0;padding:12px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));align-items:start;gap:14px;overflow-y:auto;}
.modal-shot{margin:0;min-width:0;display:grid;place-items:center;min-height:120px;max-height:60vh;border:1px solid #ffffff18;border-radius:14px;background:#090b13;overflow:hidden;}
.modal-shot img{display:block;width:100%;height:auto;max-height:58vh;object-fit:contain;border-radius:12px;}
.modal-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;}
.project-link-button{display:inline-flex;align-items:center;gap:8px;padding:11px 15px;border-radius:999px;border:1px solid #9b7bff55;background:linear-gradient(120deg,#8b6cff22,#5a8cff18);color:#d9d0ff;font-size:12px;font-weight:700;transition:transform .2s,border-color .2s,background .2s;}
.project-link-button:hover{transform:translateY(-2px);border-color:#a995ff;background:#8b6cff35;}
@media(max-width:640px){.project-visual{min-height:220px}.project-screenshot{max-height:300px;padding:8px}.modal-visual{grid-template-columns:1fr;max-height:52vh}.modal-shot img{max-height:48vh}.modal-links{gap:8px}.project-link-button{font-size:11px;padding:10px 13px}}
