/* v2 — vitrine de travaux */
.nav ul a.on{color:var(--paper)}
.nav ul a.on::after{content:"";display:block;height:2px;margin-top:4px;background:var(--grad)}
.ph{padding:150px 0 70px;border-bottom:1px solid #F3F2F714;position:relative;overflow:hidden}
.ph::before{content:"";position:absolute;width:700px;height:700px;right:-200px;top:-300px;background:radial-gradient(circle,#7B5CFF44,transparent 65%)}
.ph h1{font-size:clamp(38px,6vw,76px);margin:14px 0 20px;position:relative}
.ph .lead{position:relative}
.crumb{color:var(--fog)}.crumb a{text-decoration:none}
/* hero v2 */
.h2grid{display:grid;grid-template-columns:1.5fr 1fr;gap:56px;align-items:end;position:relative}
.hero2{padding:150px 0 90px;position:relative;overflow:hidden}
.hero2::before{content:"";position:absolute;width:1000px;height:1000px;left:40%;top:-380px;background:radial-gradient(circle,#7B5CFF50,#3D6BFF20 40%,transparent 66%)}
.hero2 .logo-xl{width:min(100%,640px);margin:22px 0 34px}
.hero2 h1{font-size:clamp(34px,5vw,64px);margin-bottom:24px}
.panel{background:#15151DE6;border:1px solid #F3F2F71F;border-radius:14px;padding:6px 22px;font:500 12.5px/1.4 "IBM Plex Mono";backdrop-filter:blur(6px)}
.panel .r{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px dashed #F3F2F726}
.panel .r:last-child{border:0}
.panel .k{color:var(--fog);letter-spacing:.12em;text-transform:uppercase}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--spark);margin-right:8px;box-shadow:0 0 12px var(--spark)}
.dot.c{background:var(--cyan);box-shadow:0 0 12px var(--cyan)}
/* manifesto */
.manif{padding:70px 0;background:var(--graph);border-block:1px solid #F3F2F714}
.manif .w{display:flex;flex-wrap:wrap;gap:12px 40px;font:800 clamp(28px,4.6vw,60px)/1 "Archivo Expanded";font-stretch:125%}
.manif .w span:nth-child(odd){color:var(--paper)}.manif .w span:nth-child(even){color:var(--fog)}
.manif p{margin-top:24px;color:var(--fog)}
/* questions list */
.qlist{list-style:none;margin-top:48px;border-top:1px solid #F3F2F726}
.qlist li a{display:grid;grid-template-columns:70px 1.1fr 1.4fr 30px;gap:24px;align-items:center;padding:26px 0;border-bottom:1px solid #F3F2F726;text-decoration:none;transition:background .25s,padding .25s}
.qlist li a:hover{background:#15151D;padding-left:14px}
.qlist .n{font:500 13px "IBM Plex Mono";color:var(--cyan)}
.qlist h3{margin:0;font-size:clamp(18px,2vw,24px)}
.qlist p{color:var(--fog);font-size:15.5px}
.qlist .ar{color:var(--fog);font-size:20px}
/* tags */
.tag{display:inline-block;padding:4px 9px;border-radius:6px;font:500 10.5px/1.3 "IBM Plex Mono";letter-spacing:.12em;text-transform:uppercase;border:1px solid #F3F2F733;color:var(--fog)}
.tag.ex{border-color:#FFB34788;color:var(--spark)}
.tag.prep{border-color:#2EE6F066;color:var(--cyan)}
.light .tag{border-color:#0B0B1033;color:#55546A}
/* work cards */
.work{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:18px;margin-top:48px}
.wcard{border-radius:16px;border:1px solid #F3F2F71F;background:var(--graph);overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .25s,border-color .25s}
.wcard:hover{transform:translateY(-4px);border-color:#3D6BFF88}
.wcard .vis{aspect-ratio:16/10;background:#0B0B10;border-bottom:1px solid #F3F2F714;position:relative;overflow:hidden}
.wcard .vis svg{width:100%;height:100%;display:block}
.wcard .bd{padding:24px;display:flex;flex-direction:column;gap:10px;flex:1}
.wcard h3{font-size:26px;margin:4px 0 0}
.wcard p{color:#BDBCCB;font-size:15px}
.wcard .meta{margin-top:auto;padding-top:14px;display:flex;gap:8px;flex-wrap:wrap}
.wcard.empty{border-style:dashed;background:transparent;justify-content:center;align-items:flex-start;padding:28px;min-height:260px}
.wcard.empty .big{font:800 54px/1 "Archivo Expanded";font-stretch:125%;color:#23232E}
.sl{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
/* rubric */
.rub{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#F3F2F71F;border:1px solid #F3F2F71F;border-radius:14px;overflow:hidden;margin-top:48px}
.rub div{background:var(--void);padding:24px 22px}
.rub .n{font:500 12px "IBM Plex Mono";color:var(--cyan);letter-spacing:.12em}
.rub h3{font-size:17px;margin:12px 0 6px}
.rub p{color:var(--fog);font-size:14.5px}
.rub div.lim{background:linear-gradient(160deg,#FFB34714,transparent 60%),var(--void)}
.rub div.lim .n{color:var(--spark)}
.note{margin-top:22px;color:var(--fog);font-size:15px;max-width:760px}
.note b{color:var(--paper);font-weight:600}
/* domains */
.dom{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:48px}
.dom .card{min-height:250px;display:flex;flex-direction:column}
.dom .ico{width:52px;height:52px;margin-bottom:auto}
.dom h3{margin-top:30px}
.stack{margin-top:28px;display:flex;gap:8px;flex-wrap:wrap}
/* split cta */
.split{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.split .card{padding:40px;min-height:320px;display:flex;flex-direction:column}
.split .card h2{font-size:clamp(26px,3vw,38px);margin:12px 0 14px}
.split .card .btn{margin-top:auto;align-self:flex-start}
.split .card.g{background:linear-gradient(#15151D,#15151D) padding-box,var(--grad) border-box;border:1px solid transparent}
/* index table */
.idx{width:100%;border-collapse:collapse;margin-top:40px;font-size:15px}
.idx th{font:500 11px "IBM Plex Mono";letter-spacing:.14em;text-transform:uppercase;color:var(--fog);text-align:left;padding:12px 14px;border-bottom:1px solid #F3F2F733}
.idx td{padding:22px 14px;border-bottom:1px solid #F3F2F71F;vertical-align:top}
.idx td.nm{font:800 20px "Archivo Expanded";font-stretch:125%}
.idx td.nm a{text-decoration:none}
.idx tr.ghost td{color:#55546A}
.idx tr.ghost td.nm{color:#33323F}
/* proofs */
.proofs{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:40px}
.proofs .card{padding:22px}
.proofs h3{font-size:15px;font-family:"IBM Plex Sans";font-weight:600;letter-spacing:0;margin:10px 0 4px}
.proofs .cnt{font:800 34px/1 "Archivo Expanded";font-stretch:125%;color:#33323F}
/* case study */
.case{display:grid;grid-template-columns:280px 1fr;gap:64px;align-items:start}
.case aside{position:sticky;top:96px}
.case aside .panel{padding:4px 18px}
.case aside .panel .r{flex-direction:column;gap:4px}
.case aside .panel .v{color:var(--paper)}
.case .sec{padding:44px 0;border-top:1px solid #F3F2F71F}
.case .sec:first-child{border-top:0;padding-top:0}
.case .sec .n{font:500 12px "IBM Plex Mono";letter-spacing:.14em;color:var(--cyan)}
.case .sec h2{font-size:clamp(22px,2.6vw,30px);margin:10px 0 14px}
.case .sec p,.case .sec li{color:#CFCEDC}
.case .sec ul{padding-left:20px;margin-top:10px}.case .sec li{margin:6px 0}
.case .sec.todo{border:1px dashed #FFB34766;border-radius:14px;padding:30px;margin:20px 0}
.case .sec.todo .n{color:var(--spark)}
.case .hyp{font:800 clamp(20px,2.4vw,28px)/1.25 "Archivo Expanded";font-stretch:125%;margin-top:6px}
.schema{margin:56px 0 0;border:1px solid #F3F2F71F;border-radius:16px;overflow:hidden;background:#0B0B10}
.schema svg{display:block;width:100%;height:auto}
.disc{margin-top:30px;padding:16px 20px;border-left:3px solid var(--spark);background:#FFB34710;color:#E8E1D2;font-size:14.5px}
/* resources */
.res{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}
.res .card{min-height:220px;display:flex;flex-direction:column}
.res .card .tag{align-self:flex-start;margin-top:auto}
/* form */
.form{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:36px}
.form label{display:flex;flex-direction:column;gap:8px;font:500 11.5px "IBM Plex Mono";letter-spacing:.12em;text-transform:uppercase;color:var(--fog)}
.form .full{grid-column:1/-1}
.form input,.form select,.form textarea{font:400 16px "IBM Plex Sans";color:var(--paper);background:#15151D;border:1px solid #F3F2F726;border-radius:10px;padding:14px 16px;outline:none;transition:border-color .2s}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--blue)}
.form textarea{min-height:140px;resize:vertical}
.frame{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:36px}
.frame .tile p{font-size:14.5px}
@media (max-width:980px){
 .h2grid,.split,.case{grid-template-columns:1fr}.case aside{position:static}
 .work,.dom,.rub,.res,.proofs,.frame{grid-template-columns:repeat(2,1fr)}
 .qlist li a{grid-template-columns:50px 1fr 24px}.qlist li a p{display:none}.qlist h3{min-width:0;font-size:16px;overflow-wrap:anywhere}
 .idx .hm{display:none}
}
@media (max-width:620px){
 .work,.dom,.rub,.res,.proofs,.frame,.form{grid-template-columns:1fr}
 .split .card{padding:28px}
}
.axe{display:grid;grid-template-columns:90px 1.2fr 1fr;gap:28px;padding:34px;margin-top:14px}
.hero2 .logo-xl{margin:18px 0 44px}
@media (max-width:760px){.axe{grid-template-columns:1fr;gap:12px;padding:26px}}