:root{--ink:#18221d;--green:#174f3b;--lime:#d9ff6b;--paper:#f5f3ec;--line:#d9ddd7;--muted:#69736e;--white:#fff;--shadow:0 28px 80px rgba(24,34,29,.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select{font:inherit}button{cursor:pointer}header{height:72px;padding:0 clamp(18px,5vw,72px);display:flex;align-items:center;justify-content:space-between;background:rgba(245,243,236,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}.brand{text-decoration:none;color:var(--ink);font-size:1.15rem;font-weight:900;letter-spacing:-.04em}.brand span{color:var(--green)}header nav{display:flex;gap:28px}header nav a{color:var(--muted);text-decoration:none;font-size:.82rem;font-weight:700}header button,.generate{border:0;border-radius:10px;background:var(--green);color:#fff;padding:11px 15px;font-weight:800}.studio{padding:70px clamp(18px,5vw,72px) 90px;background:radial-gradient(circle at 75% 5%,rgba(217,255,107,.35),transparent 30%)}.intro{max-width:780px;margin-bottom:38px}.tag{text-transform:uppercase;letter-spacing:.14em;font-weight:850;font-size:.68rem;color:var(--green)}h1{font:700 clamp(3rem,6vw,5.8rem)/.92 Georgia,serif;letter-spacing:-.055em;margin:17px 0 24px;max-width:1050px}h1 em{font-style:normal;color:var(--green)}.intro>p{font-size:1.08rem;line-height:1.65;color:var(--muted);max-width:700px}.benefits{display:flex;gap:18px;flex-wrap:wrap;margin-top:24px}.benefits span{font-size:.76rem;font-weight:750}.workspace{display:grid;grid-template-columns:300px 1fr;gap:18px;max-width:1360px;margin:auto}.editor,.preview-wrap{border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:var(--shadow)}.editor{padding:22px;display:flex;flex-direction:column;gap:13px}.editor-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.editor-title span{font-size:.65rem;background:#eef2ef;padding:5px 8px;border-radius:99px}.editor label{display:grid;gap:6px;font-size:.7rem;font-weight:800}.editor input,.editor select{border:1px solid var(--line);border-radius:9px;padding:10px;width:100%;color:var(--ink)}.editor input:focus,.editor select:focus{outline:3px solid rgba(217,255,107,.5);border-color:var(--green)}.generate{margin-top:4px}.editor small{font-size:.6rem;line-height:1.45;color:var(--muted)}.preview-wrap{padding:15px;background:#e7eae6}.browser{background:#fff;border-radius:14px;overflow:hidden;border:1px solid #ced4cf}.browser-bar{height:38px;background:#f1f3f1;display:flex;align-items:center;gap:6px;padding:0 12px}.browser-bar i{width:8px;height:8px;border-radius:50%;background:#c6cbc7}.browser-bar i:first-child{background:#ff9d85}.browser-bar i:nth-child(2){background:#ffd36a}.browser-bar i:nth-child(3){background:#81d89b}.browser-bar span{margin-left:10px;background:#fff;border-radius:6px;padding:5px 12px;font-size:.6rem;color:var(--muted);flex:1}.site-preview{min-height:470px}.preview-nav{height:58px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf0ed}.preview-nav b{font-family:Georgia,serif}.preview-nav a{background:var(--green);color:#fff;text-decoration:none;padding:8px 12px;border-radius:8px;font-size:.67rem;font-weight:800}.preview-hero{display:grid;grid-template-columns:1fr 210px;gap:35px;padding:38px 36px 25px;align-items:center}.verified{font-size:.64rem;color:var(--green);font-weight:800}.preview-hero h2{font:700 clamp(1.8rem,4vw,3.7rem)/1 Georgia,serif;letter-spacing:-.04em;margin:12px 0}.preview-hero p{color:var(--muted)}.actions{display:flex;gap:8px;margin-top:22px}.actions button{border:0;border-radius:9px;background:var(--green);color:#fff;padding:10px 12px;font-size:.68rem;font-weight:800}.actions .outline{background:#fff;color:var(--green);border:1px solid var(--green)}.visual{height:190px;border-radius:22px;background:var(--green);display:grid;place-items:center;color:var(--lime);position:relative}.visual>span{font:700 4rem Georgia,serif}.visual small{position:absolute;bottom:14px;background:#fff;color:var(--green);border-radius:99px;padding:6px 9px;font-size:.57rem;font-weight:800}.trust-row{display:grid;grid-template-columns:repeat(3,1fr);margin:0 36px;padding:17px;background:#f4f6f4;border-radius:13px}.trust-row div{text-align:center;border-right:1px solid var(--line)}.trust-row div:last-child{border:0}.trust-row b,.trust-row span{display:block}.trust-row b{font-size:.9rem}.trust-row span{font-size:.58rem;color:var(--muted)}.services{padding:24px 36px}.services h3{font:700 1.2rem Georgia,serif}.services>div{display:flex;gap:8px;flex-wrap:wrap}.services span{border:1px solid var(--line);border-radius:99px;padding:7px 10px;font-size:.62rem}.delivery{display:flex;justify-content:space-between;align-items:center;padding:13px 7px 0;font-size:.68rem}.delivery span{color:var(--green);font-weight:850}.offer{padding:100px clamp(18px,7vw,110px);background:var(--green);color:#fff}.tag.dark{color:var(--lime)}.offer h2{font:700 clamp(2.2rem,4vw,4rem)/1 Georgia,serif;letter-spacing:-.04em;max-width:850px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:45px}.steps article{border:1px solid rgba(255,255,255,.18);padding:25px;border-radius:17px}.steps article>b{color:var(--lime);font-size:.7rem}.steps h3{font-size:1rem}.steps p{font-size:.79rem;line-height:1.55;color:#c4d3cc}footer{display:flex;justify-content:space-between;padding:25px clamp(18px,5vw,72px);font-size:.7rem;color:var(--muted)}@media(max-width:900px){header nav{display:none}.workspace{grid-template-columns:1fr}.preview-hero{grid-template-columns:1fr}.visual{display:none}.steps{grid-template-columns:1fr}}@media(max-width:560px){header{height:64px;padding:0 14px}.studio{padding:45px 14px 65px}h1{font-size:3.2rem}.benefits{display:grid}.preview-wrap{padding:6px}.preview-hero{padding:28px 18px}.trust-row{margin:0 18px}.services{padding:20px 18px}.actions{display:grid}.delivery{display:grid;gap:5px}.offer{padding:70px 18px}footer{display:grid;gap:8px}}

/* Choix du métier : chaque carte ouvre le générateur (/creer/) sur ce métier */
header .cta{border-radius:10px;background:var(--green);color:#fff;padding:11px 15px;font-weight:800;text-decoration:none;font-size:.9rem}
.metiers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1360px;margin:auto}
.metier{display:block;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:22px;background:#e7eae6;padding:12px;box-shadow:var(--shadow);transition:transform .2s,border-color .2s}
.metier:hover{transform:translateY(-4px);border-color:var(--green)}
.metier .thumb{aspect-ratio:16/11;overflow:hidden;position:relative}
.metier .thumb iframe{position:absolute;top:0;left:0;width:400%;height:400%;border:0;transform:scale(.25);transform-origin:0 0;pointer-events:none;background:#fff}
.metier-info{display:flex;align-items:center;gap:12px;padding:14px 8px 4px}
.metier-info .emoji{font-size:1.6rem}
.metier-info b,.metier-info small{display:block}
.metier-info small{color:var(--muted);font-size:.72rem;margin-top:2px}
.metier-info .arrow{margin-left:auto;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:800}
.studio>.delivery{max-width:1360px;margin:18px auto 0;padding:0 4px}
@media(max-width:900px){.metiers{grid-template-columns:1fr;max-width:560px}}
@media(max-width:560px){header .cta{padding:9px 12px;font-size:.8rem}}