/* MyAiCompany · vitrine — gris clair de la plateforme, un accent teal, les couleurs des campus comme signaux */
:root{--ground:#F3F4F6;--panel:#FFFFFF;--panel-2:#F8F9FB;--line:#E3E5EA;--ink:#171A20;--muted:#5F6672;--faint:#8B92A0;
  --maic:#1E8C8A;--maic-2:#DDF1F0;--ocre:#C98B3A;--violet:#9A5BA8;--slate:#5B7BB5;--dark:#1B1F27;--dark-2:#242A34;
  --display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;--ui:"Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:14px;--gutter:clamp(16px,4vw,48px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--ground);color:var(--ink);font:16px/1.55 var(--ui);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}a{color:inherit}
h1,h2,h3{font-family:var(--display);letter-spacing:-.02em;text-wrap:balance;margin:0}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem);font-weight:700;line-height:1.1;margin-bottom:18px}h3{font-size:1.15rem;font-weight:700}
p{margin:0 0 12px}.lead{font-size:clamp(1.05rem,1.4vw,1.25rem);color:var(--muted);line-height:1.55}.narrow{max-width:62ch}.muted{color:var(--muted)}
.wrap{max-width:1180px;margin:0 auto;padding:clamp(56px,8vw,96px) var(--gutter)}
.band{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.band.dark{background:var(--dark);color:#F2F4F7;border-color:var(--dark)}.band.dark .lead,.band.dark .muted{color:#B9C0CC}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ink);color:#fff;text-decoration:none;font-weight:700;padding:11px 18px;border-radius:999px;border:0;cursor:pointer;font:inherit;font-weight:700;line-height:1.1;transition:transform .12s,background .12s}
.btn:hover{background:var(--maic);transform:translateY(-1px)}.btn.big{padding:15px 26px;font-size:1.05rem}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}.btn.ghost:hover{background:var(--panel-2);border-color:var(--ink);color:var(--ink)}
.btn:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--maic);outline-offset:2px}
/* nav */
.nav{display:flex;align-items:center;gap:18px;padding:18px var(--gutter);max-width:1280px;margin:0 auto}
.nav .brand img{display:block;width:150px;height:auto}.nav nav{margin-left:auto;display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.nav nav a{text-decoration:none;font-weight:600;font-size:.95rem;padding:8px 12px;border-radius:999px;color:var(--muted)}.nav nav a:hover{color:var(--ink);background:var(--panel)}
.nav nav a.btn{color:#fff}.nav nav a.btn:hover{background:var(--maic)}.nav nav a.lang{border:1px solid var(--line);color:var(--ink)}
@media (max-width:760px){.nav nav a:not(.btn):not(.lang){display:none}}
/* hero */
.hero{max-width:1280px;margin:0 auto;padding:clamp(24px,5vw,64px) var(--gutter) clamp(40px,6vw,80px);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:center}
@media (max-width:900px){.hero{grid-template-columns:minmax(0,1fr)}}
.kicker{font-family:var(--display);font-weight:600;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:var(--maic);margin-bottom:14px}
.hero h1{font-size:clamp(2.4rem,5.2vw,4.4rem);font-weight:800;line-height:1.02}.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--maic),var(--slate));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero h1 .soft{font-weight:600;color:var(--muted);font-size:.62em;display:inline-block;margin-top:10px}
.hero .lead{margin:22px 0 26px;max-width:52ch}.cta-row{display:flex;gap:12px;flex-wrap:wrap}.note{font-size:.88rem;color:var(--faint);margin-top:14px}
.hero-city{min-width:0}.stage{position:relative;aspect-ratio:5/3;border-radius:18px;overflow:hidden;background:#DCE0E6;box-shadow:0 30px 60px -30px rgba(23,26,32,.35),0 0 0 1px var(--line)}
.stage canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block}
.stage .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;transition:opacity .8s ease}.stage .poster.off{opacity:0;pointer-events:none}
.labels{position:absolute;inset:0;pointer-events:none;z-index:3}.lbl{position:absolute;transform:translate(-50%,0);background:rgba(255,255,255,.94);color:var(--ink);font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap;box-shadow:0 1px 6px rgba(20,30,50,.16);display:flex;align-items:center;gap:6px;opacity:0;transition:opacity .4s}
.stage.live .lbl{opacity:1}.lbl i{width:6px;height:6px;border-radius:50%;background:#2E9E5B;display:none}.lbl.on i{display:block}.lbl.tower{background:var(--maic-2);color:#12605E}
.tip{position:absolute;pointer-events:none;background:var(--ink);color:#fff;font-size:12px;padding:6px 9px;border-radius:8px;white-space:nowrap;transform:translate(-50%,calc(-100% - 12px));opacity:0;transition:opacity .12s;z-index:4}.tip.on{opacity:1}
.caption{font-size:.85rem;color:var(--faint);margin:10px 4px 0;text-align:center}
/* campus */
.campus{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:28px}
.campus article{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r);padding:16px 16px 14px;position:relative;overflow:hidden}
.campus article::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--c)}.campus h3{display:flex;align-items:center;gap:8px;margin-bottom:6px}.campus h3 i{width:10px;height:10px;border-radius:50%;background:var(--c)}
.campus p{margin:0;color:var(--muted);font-size:.95rem}
/* la ville grandit */
.grow{margin-top:18px;background:var(--panel-2);border:1px solid var(--line);border-left:5px solid var(--maic);border-radius:var(--r);padding:18px 20px;max-width:760px}.grow h3{margin-bottom:6px}.grow p{margin:0;color:var(--muted)}
/* steps */
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;counter-reset:s}
@media (max-width:900px){.steps{grid-template-columns:minmax(0,1fr)}}
.steps li{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
.steps li .shot{background:var(--panel-2);border-bottom:1px solid var(--line);overflow:hidden}.steps li .shot img{display:block;width:100%;height:auto;max-height:250px;object-fit:cover;object-position:top}
.steps li .t{padding:16px 18px 18px}.steps li h3::before{counter-increment:s;content:counter(s);display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font-size:.85rem;margin-right:10px}
.steps li p{margin:8px 0 0;color:var(--muted)}
/* price */
.price{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}@media (max-width:900px){.price{grid-template-columns:minmax(0,1fr)}}
.amount{display:flex;align-items:baseline;gap:10px;margin:14px 0 8px}.amount b{font-family:var(--display);font-size:clamp(3rem,7vw,5rem);font-weight:800;letter-spacing:-.03em;line-height:1}.amount span{color:#B9C0CC;font-size:1.1rem}
.credits{display:flex;align-items:center;gap:10px;font-weight:700;color:#8FD9D6;margin-bottom:14px}.credits img{width:28px;height:28px}
.price-ex{background:var(--dark-2);border-radius:var(--r);padding:22px 24px}.price-ex h3{margin-bottom:10px;color:#F2F4F7}
.price-ex table{width:100%;border-collapse:collapse}.price-ex td{padding:10px 0;border-top:1px solid #343B47;font-variant-numeric:tabular-nums;vertical-align:top}.price-ex tr:first-child td{border-top:0}.price-ex td:first-child{padding-right:12px}.price-ex td:last-child{width:1%;white-space:nowrap;text-align:right;font-weight:700;color:#8FD9D6}.price-ex .small{font-size:.85rem;margin:14px 0 0;line-height:1.5}
.price-card h2{max-width:14ch}
/* grids */
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px}.band .card{background:var(--panel-2)}.card h3{margin-bottom:6px}.card p{margin:0;color:var(--muted)}
.market{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}@media (max-width:900px){.market{grid-template-columns:minmax(0,1fr)}}
.market .grid3{grid-template-columns:minmax(0,1fr)}.market .card{border-left:5px solid var(--ocre)}
/* gallery */
.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}@media (max-width:760px){.gallery{grid-template-columns:minmax(0,1fr)}}
.gallery figure{margin:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}.gallery img{display:block;width:100%;height:auto;border-bottom:1px solid var(--line)}.gallery figcaption{padding:12px 16px;color:var(--muted);font-size:.95rem}
/* trust */
.checks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px 24px}.checks li{padding-left:28px;position:relative;color:var(--muted)}.checks li::before{content:"";position:absolute;left:0;top:6px;width:16px;height:16px;border-radius:50%;background:var(--maic-2)}.checks li::after{content:"";position:absolute;left:5px;top:9px;width:6px;height:9px;border:solid var(--maic);border-width:0 2px 2px 0;transform:rotate(45deg)}
/* join */
.join{background:linear-gradient(180deg,#fff,#EEF6F6)}.join-form{max-width:900px}.join-form .row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-top:18px}
.join-form .f{display:flex;flex-direction:column;gap:6px;flex:1 1 220px}.join-form .f.wide{flex:2 1 300px}.join-form .f span{font-size:.85rem;font-weight:600;color:var(--muted)}
.join-form input{font:inherit;padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);width:100%}.join-form input:focus{border-color:var(--maic)}
.hp{display:none!important}.join-form .note.ok{color:#1F7A4A;font-weight:600}.join-form .note.err{color:#B23B3B;font-weight:600}
/* footer */
.foot{max-width:1280px;margin:0 auto;padding:28px var(--gutter) 40px;display:flex;gap:18px;flex-wrap:wrap;align-items:center;color:var(--faint);font-size:.9rem}.foot nav{margin-left:auto;display:flex;gap:16px;flex-wrap:wrap}.foot a{color:var(--muted);text-decoration:none}.foot a:hover{color:var(--ink)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}
