/* LIOR — Le chemin vers soi · Styles (conserve le design de la version 1) */
:root{
  --accent:#24585b; --accent-dark:#173e42; --soft:#e6efea;
  --sky1:#d3dfe2; --sky2:#f9e3bc; --sky3:#edbd8c;
  font-family:Georgia,'Times New Roman',serif; color:#173e42; background:#f6f3ec;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #e8a94c;outline-offset:2px}
button:disabled{opacity:.55;cursor:wait}
a{color:inherit;text-decoration:none}
.sky{position:absolute;z-index:-1;top:0;left:0;width:100%;height:690px;overflow:hidden;background:linear-gradient(var(--sky1) 0%,var(--sky2) 53%,var(--sky3) 100%)}
.sun{position:absolute;width:240px;height:240px;border-radius:50%;background:#fff0bd;box-shadow:0 0 110px 75px #fff1be77;left:calc(50% - 120px);top:150px}
.mountain{position:absolute;bottom:0;width:120%;left:-10%;height:280px;clip-path:polygon(0 88%,15% 42%,29% 77%,47% 15%,63% 78%,78% 35%,100% 91%,100% 100%,0 100%)}
.back{background:#7e9b9a88;bottom:20px}
.front{background:#436b70bb;transform:scaleX(-1);height:220px}
header{max-width:1140px;margin:auto;padding:25px 28px;display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap}
.brand{font-size:27px;letter-spacing:4px;font-weight:bold}
.brand small{display:block;font:12px Arial,sans-serif;letter-spacing:2px;margin-top:4px}
nav{display:flex;gap:24px;font:14px Arial,sans-serif;flex-wrap:wrap}
nav a:hover{text-decoration:underline}
.lang{display:flex;gap:6px}
.lang-btn{border:1px solid #7c9b92;background:#fff;color:var(--accent);border-radius:20px;padding:8px 14px;font:13px Arial,sans-serif}
.lang-btn.active{background:var(--accent);color:#fff}
.hero{text-align:center;max-width:730px;margin:60px auto 105px;padding:0 20px}
.eyebrow{font:12px Arial,sans-serif;letter-spacing:3px}
.hero h1{font-weight:normal;font-size:clamp(50px,7vw,86px);line-height:1.08;margin:22px 0}
.hero h1 em{color:#fffaf0;text-shadow:0 2px 12px #335a5a77}
.hero p{font-size:19px;line-height:1.6;max-width:570px;margin:0 auto 26px}
.primary{background:var(--accent);color:white;border:0;border-radius:28px;padding:15px 29px;box-shadow:0 5px 14px #173e4225}
.primary:hover{background:var(--accent-dark)}
.note{font:12px Arial,sans-serif!important;margin-top:17px!important}
.panel{max-width:760px;margin:0 auto 40px;background:#fffdf8;border:1px solid #d9e3de;border-radius:22px;box-shadow:0 15px 55px #163c4033;overflow:hidden}
#conversation{margin-top:-50px;margin-bottom:65px}
.hidden{display:none!important}
.panel-head{background:var(--soft);padding:18px 22px;display:flex;justify-content:space-between}
.panel-head small{display:block;font:12px Arial,sans-serif;margin:5px 0 0 19px}
.panel-body{padding:22px}
.panel-body p{line-height:1.6}
.dot{display:inline-block;width:10px;height:10px;background:#5b9977;border-radius:50%;margin-right:9px}
.icon{border:0;background:none;font-size:27px}
.messages{padding:20px;min-height:170px;max-height:350px;overflow:auto;display:flex;flex-direction:column;gap:12px}
.bubble{padding:13px 17px;border-radius:17px;max-width:85%;line-height:1.5;background:#e7eee9;align-self:flex-start}
.bubble.mine{background:#dce5e9;align-self:flex-end}
.bubble.crisis{background:#fdecea;border:1px solid #d98c8c}
.controls{padding:0 20px 14px;display:flex;align-items:center;gap:10px;font:13px Arial,sans-serif;flex-wrap:wrap}
select{border:1px solid #c8d6d1;border-radius:8px;padding:9px;background:white}
.secondary{background:#fff;border:1px solid #7c9b92;color:var(--accent);border-radius:22px;padding:10px 15px}
.secondary.danger{border-color:#c07a7a;color:#8a3d3d}
#chatForm{padding:0 20px;display:flex;gap:10px}
#message{flex:1;min-width:0;padding:13px;border:1px solid #cad7d2;border-radius:22px}
.disclaimer{padding:0 20px;font:11px/1.5 Arial,sans-serif;color:#64716e}
.demo-note{margin:0 20px 14px;padding:12px 14px;background:#fdf6e3;border:1px solid #e8d9a8;border-radius:12px;font:13px/1.5 Arial,sans-serif;color:#6b5a1e}
.crisis{padding:14px;background:#fdecea;border:1px solid #e0a8a8;border-radius:12px}
.cards{max-width:1140px;margin:0 auto 70px;padding:0 20px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start}
.card{background:#fffdf9ed;border:1px solid #e4e8df;border-radius:22px;padding:30px;box-shadow:0 8px 25px #203f3c0c}
.card>span{font-size:30px}
.card h2{font-size:26px;font-weight:normal}
.card p{line-height:1.6}
.card textarea,.card input[type="text"],.panel-body input,.panel-body textarea{width:100%;border:1px solid #d0dad4;border-radius:12px;padding:12px;margin-bottom:10px}
.card textarea{min-height:85px;resize:vertical}
.result{font-size:14px;color:#3b7662}
.field-label{display:block;font:13px Arial,sans-serif;font-weight:bold;margin:14px 0 6px}
.form-row{display:flex;gap:10px;flex-wrap:wrap}
.form-row input{flex:1;min-width:200px}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.garden-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.flower-card{background:var(--soft);border-radius:14px;padding:12px;text-align:center;font-size:13px;line-height:1.4}
.flower-card .emoji{font-size:28px;display:block}
.flower-card button{border:0;background:none;font-size:12px;color:#8a3d3d;margin-top:6px}
.entry-list{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.entry{border:1px solid #e0e5dd;border-radius:12px;padding:12px 14px;background:#fff}
.entry time{font:12px Arial,sans-serif;color:#687872}
.entry p{white-space:pre-wrap;margin:8px 0 4px}
.entry button{border:0;background:none;font-size:12px;color:#8a3d3d}
.breath-wrap{text-align:center;margin:10px 0}
.breath-circle{width:120px;height:120px;margin:0 auto;border-radius:50%;background:var(--soft);border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;font-size:40px;transition:transform 4s ease-in-out}
.breath-circle.inhale{transform:scale(1.35)}
.breath-circle.exhale{transform:scale(1)}
footer{text-align:center;padding:30px 15px;background:#e5ebe5;font-size:14px;line-height:2}
footer small{font:12px Arial,sans-serif;color:#687872}
@media(max-width:700px){
  header{flex-direction:column;padding:20px}
  nav{gap:15px;font-size:12px}
  .hero{margin:55px auto 110px}
  .hero p{font-size:17px}
  .cards{grid-template-columns:1fr}
  #conversation{margin:-50px 12px 40px}
  #chatForm{padding:0 12px}
  #chatForm .primary{padding:12px 15px}
  .garden-grid{grid-template-columns:repeat(2,1fr)}
}