/* Au fil des champs — feuille de style */
@font-face{font-family:"Jost";font-style:normal;font-weight:300;font-display:swap;src:url(fonts/jost-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/jost-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/jost-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Kaushan Script";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/kaushan-script-latin-400-normal.woff2) format("woff2")}

:root{
  --creme:#f9f3e4;
  --creme-2:#f1e8d2;
  --carte:#fcf7ea;
  --vert:#2d5a1b;
  --vert-2:#3f7428;
  --olive:#e6edcb;
  --rouge:#c9502e;
  --encre:#2c2a22;
  --script:"Kaushan Script","Segoe Script","Brush Script MT",cursive;
  --sans:"Jost",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--creme);color:var(--encre);font:400 17px/1.6 var(--sans)}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--sans);font-weight:500;line-height:1.18;color:var(--encre)}
h1{font-size:clamp(30px,4.4vw,46px);margin:12px 0 22px}
h2{font-size:26px;margin:0 0 14px}
h3{font-size:21px;margin:0 0 8px}
strong{font-weight:500}

/* en-tête */
header{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:20px max(24px,calc((100vw - 1140px)/2));background:var(--creme)}
.brand{font-family:var(--script);font-size:28px;color:var(--vert);line-height:1}
body:has(main.home) .brand{visibility:hidden}
nav{display:flex;gap:26px;align-items:center;flex-wrap:wrap;font-size:16px}
nav a{padding:4px 0;border-bottom:2px solid transparent}
nav a:hover{border-bottom-color:var(--rouge)}
.link{background:none;border:0;border-bottom:2px solid transparent;color:inherit;font:inherit;cursor:pointer;padding:4px 0}
.link:hover{border-bottom-color:var(--rouge)}
.inline{display:inline}

main{max-width:1100px;margin:auto;padding:30px 24px 50px;min-height:60vh}
footer{text-align:center;padding:40px 24px;color:#7b765f;font-size:14px;border-top:1px solid #e6dcc3}

/* boutons */
.btn{display:block;text-align:center;background:var(--vert);color:#fff;border:2px solid var(--vert);border-radius:12px;padding:13px 26px;font:500 18px var(--sans);cursor:pointer;transition:background .2s}
.btn:hover{background:var(--vert-2);border-color:var(--vert-2)}
.btn-outline{display:block;text-align:center;border:2px solid var(--vert);border-radius:12px;padding:12px 26px;font:500 18px var(--sans);color:var(--vert);background:transparent;transition:background .2s}
.btn-outline:hover{background:#2d5a1b14}
a:focus-visible,button:focus-visible{outline:3px solid var(--rouge);outline-offset:3px}
.small,.muted{font-size:15px;color:#7b765f}
.secondary{padding:11px 18px;background:var(--creme-2);color:var(--vert);border:1px solid #e0d3b4;border-radius:10px;cursor:pointer;font:inherit}
.secondary:hover{border-color:var(--vert)}

/* pages intérieures */
.panel,.person,.match{background:var(--carte);border:1px solid #e6dcc3;border-radius:16px;padding:30px;margin:20px 0;box-shadow:0 8px 26px #5a4a1f0f}
.narrow{max-width:580px;margin:30px auto}
.narrow .btn{display:inline-block}
label{display:block;margin:18px 0;font-weight:500;color:var(--encre)}
input,select,textarea{display:block;width:100%;border:1px solid #d8ccae;border-radius:10px;padding:12px 14px;font:400 17px var(--sans);margin-top:6px;background:#fff;color:var(--encre)}
input:focus,textarea:focus,select:focus{outline:2px solid var(--vert);border-color:var(--vert)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px}
.person{margin:0}
.person .btn{display:inline-block}
.match .btn{display:inline-block}
.avatar{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;background:var(--olive);color:var(--vert);font:400 44px var(--script)}
.person h2{font-size:23px}
.match{display:flex;justify-content:space-between;align-items:center}
.notice,.error{padding:14px 20px;border-radius:12px;background:var(--olive);margin-bottom:18px}
.error{background:#f8e0d6;color:#7d2f25}
.thread{background:var(--creme-2);border-radius:14px;padding:20px;min-height:200px;display:flex;flex-direction:column;gap:10px;max-height:470px;overflow:auto}
.bubble{max-width:80%;padding:12px 16px;border-radius:16px;background:#fff;align-self:flex-start;overflow-wrap:anywhere}
.bubble.mine{align-self:flex-end;background:var(--olive)}
.bubble small{display:block;font-size:12px;color:#7b765f;margin-top:7px}
.actions{display:flex;gap:15px;flex-wrap:wrap;margin-top:22px}
.actions form{display:flex;gap:8px;align-items:end}
.chat .btn{display:inline-block}

/* accueil */
main.home{max-width:none;padding:0 0 70px;min-height:0}
main.home>.notice{max-width:1052px;margin:0 auto 18px}
.intro{text-align:center;padding:6px 24px 34px}
.logo{margin:0;display:flex;flex-direction:column;align-items:center}
.logo-mark{width:min(300px,62vw);height:auto;display:block;margin-bottom:-6px}
.logo-text{font:400 clamp(52px,8vw,92px)/1 var(--script);color:var(--vert);letter-spacing:.005em}
.tagline{font-size:clamp(20px,2.6vw,28px);margin:10px 0 4px;color:var(--encre)}
.swoosh{width:min(240px,50vw);height:auto;display:block;margin:0 auto}
.duo{max-width:1060px;margin:auto;padding:0 24px;display:grid;grid-template-columns:1.12fr .88fr;gap:44px;align-items:center}
.photo{display:block;width:100%;height:auto;border-radius:22px;box-shadow:0 18px 46px #4a3a1530}
.appcard{background:var(--carte);border:1px solid #e6dcc3;border-radius:26px;padding:34px 32px;box-shadow:0 18px 46px #4a3a1522}
.appcard h2{text-align:center;font-size:25px;line-height:1.25;margin:0 0 22px}
.points{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:16px}
.points li{display:flex;align-items:center;gap:14px}
.bi{width:30px;height:30px;flex:none}
.appcard .btn{margin-bottom:12px}
.free{display:flex;gap:14px;align-items:center;background:var(--olive);border-radius:14px;padding:16px 18px;margin-top:22px}
.free div{display:flex;flex-direction:column;line-height:1.35}
.free strong{font-size:18px}
.free span{font-size:15px;color:#4a5236}

@media(max-width:860px){
  .duo{grid-template-columns:1fr;gap:30px}
  .photo{max-width:560px;margin:auto}
  .appcard{max-width:560px;margin:auto;width:100%}
}
@media(max-width:720px){
  header{padding:16px 24px}
  nav{gap:16px;font-size:15px}
  .panel{padding:22px}
  .match{gap:10px}
  .appcard{padding:28px 22px}
}

/* ---- version publique ---- */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.check{display:flex;gap:12px;align-items:flex-start;font-weight:400;font-size:15px;line-height:1.5}
.check input{width:auto;margin:4px 0 0;flex:none;accent-color:var(--vert)}
.under{text-decoration:underline;text-underline-offset:3px;color:var(--vert)}
.dot{display:inline-block;min-width:21px;padding:0 6px;border-radius:11px;background:var(--rouge);color:#fff;font-size:13px;line-height:21px;text-align:center}
.avatar-img{width:96px;height:96px;border-radius:50%;object-fit:cover;display:block;background:var(--olive)}
.avatar.sm,.avatar-img.sm{width:56px;height:56px;font-size:28px;flex:none}
.me{display:flex;gap:18px;align-items:center;margin-bottom:10px}
.mrow{display:flex;gap:16px;align-items:center}
.mrow p{margin:0}
.filters{display:flex;gap:14px;flex-wrap:wrap;align-items:end;margin:6px 0 22px}
.filters label{margin:0;min-width:110px}
.filters input[type=number]{width:90px}
.filters .secondary{height:48px}
a.secondary{display:inline-block}
.danger{color:#8a2d1f;border-color:#e3b9ae}
.repform{margin-top:10px}
.small{font-size:14px;color:#7b765f}
hr{border:0;border-top:1px solid #e6dcc3;margin:26px 0}
.legal{max-width:820px;margin:20px auto}
.legal h2{font-size:21px;margin:26px 0 8px}
.legal li{margin:6px 0}
.tbl{width:100%;border-collapse:collapse;font-size:15px}
.tbl td{padding:10px 8px;border-top:1px solid #e6dcc3;vertical-align:top}
footer .foot{display:flex;justify-content:center;gap:22px;flex-wrap:wrap;margin-bottom:12px}
footer .foot a:hover{color:var(--vert);text-decoration:underline}
footer p{margin:0}
.photoform{margin-bottom:6px}
.photoform input[type=file]{padding:9px}

/* pied de page compact */
footer{padding:28px 20px calc(24px + env(safe-area-inset-bottom));font-size:13px}
footer .foot{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin:0 0 10px;font-size:13px;line-height:1.4}
footer .foot a{padding:2px 0;border:0;white-space:nowrap}
footer p{font-size:13px;line-height:1.4}
@media(max-width:720px){footer .foot{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;max-width:340px;margin:0 auto 12px;text-align:center}}
@media(max-width:720px){footer .foot a:last-child:nth-child(odd){grid-column:1/-1}.tbl,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}.tbl tr{border-top:1px solid #e6dcc3;padding:10px 0}.tbl td{border:0;padding:3px 8px;overflow-wrap:anywhere}}
.ptr{position:fixed;top:calc(8px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:9999;background:#23482c;color:#fff;font:600 13px/1 system-ui,sans-serif;padding:9px 14px;border-radius:20px;opacity:0;pointer-events:none;transition:opacity .15s}.ptr.show{opacity:.85}.ptr.on{opacity:1}