/* Positive Studio · DA : ivoire / encre / corail / jaune solaire */
:root{
  --ivoire:#F7F4EF; --encre:#161514; --corail:#FF5747; --jaune:#FFC845;
  --gris:#6B6660; --ligne:#E4DED4; --carte:#FFFFFF; --vert:#2E7D5B;
}
*{box-sizing:border-box;}
body{margin:0; background:var(--ivoire); color:var(--encre);
  font:17px/1.65 "Inter","Segoe UI",system-ui,sans-serif;}
h1,h2,h3,.logo{font-family:"Space Grotesk","Archivo","Segoe UI",sans-serif; letter-spacing:-.01em;}
a{color:var(--corail); text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%; display:block;}
.wrap{max-width:1140px; margin:0 auto; padding:0 24px;}

/* Header */
header.site{background:var(--encre); color:var(--ivoire);}
header.site .wrap{display:flex; align-items:center; gap:28px; padding:18px 24px; flex-wrap:wrap;}
.logo{font-size:20px; font-weight:800; color:var(--ivoire); margin-right:auto;}
.logo span{color:var(--corail);}
nav.main a{color:var(--ivoire); font-weight:600; font-size:15px; margin-left:22px;}
nav.main a:hover{color:var(--jaune); text-decoration:none;}
nav.main a.cta{background:var(--corail); color:#fff; padding:8px 20px; border-radius:999px;}
nav.main a.cta:hover{background:#e64435; color:#fff;}
nav.main a.active{color:var(--jaune);}

/* Hero */
.hero{background:var(--encre); color:var(--ivoire); padding:72px 0 84px;}
.hero h1{font-size:clamp(28px,3.6vw,42px); line-height:1.08; margin:0 0 18px; white-space:nowrap;}
.hero h1 mark{background:var(--jaune); color:var(--encre); padding:0 8px; border-radius:4px;}
.hero p{color:#CFC9BF; font-size:19px; max-width:640px; margin:0 0 30px;}
.btn{display:inline-block; background:var(--corail); color:#fff; font-weight:700;
  padding:13px 30px; border-radius:999px; font-size:16px;}
.btn:hover{background:#e64435; text-decoration:none;}
.btn.ghost{background:transparent; border:2px solid var(--ivoire); color:var(--ivoire); margin-left:12px;}
.btn.ghost:hover{border-color:var(--jaune); color:var(--jaune);}

/* Sections */
section{padding:64px 0;}
section.alt{background:var(--carte); border-top:1px solid var(--ligne); border-bottom:1px solid var(--ligne);}
.kicker{display:inline-block; background:var(--jaune); color:var(--encre); font-size:12.5px;
  font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:4px 12px;
  border-radius:999px; margin-bottom:12px;}
section h2{font-size:clamp(26px,3.5vw,38px); margin:0 0 10px;}
.lead{color:var(--gris); font-size:18px; max-width:700px; margin:0 0 34px;}

/* Cards */
.grid{display:grid; gap:20px;}
.g2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));}
.g3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}
.card{background:var(--carte); border:1px solid var(--ligne); border-radius:14px; padding:26px;}
section.alt .card{background:var(--ivoire);}
.card h3{margin:0 0 8px; font-size:20px;}
.card p{margin:0; color:var(--gris); font-size:15.5px;}
.card .more{display:inline-block; margin-top:14px; font-weight:700; font-size:15px;}

/* Blog cards */
.post{background:var(--carte); border:1px solid var(--ligne); border-radius:14px;
  padding:22px 24px; display:flex; flex-direction:column; gap:8px;}
.post .cat{font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--corail);}
.post h3{margin:0; font-size:18px; line-height:1.35;}
.post h3 a{color:var(--encre);}
.post time{color:var(--gris); font-size:13.5px;}
.post.todo{opacity:.55;}
.post.todo h3{color:var(--gris);}

/* Article */
article.entry{max-width:760px; margin:0 auto; padding:56px 24px 40px;}
article.entry .cat{color:var(--corail); font-weight:700; text-transform:uppercase; font-size:13px; letter-spacing:.06em;}
article.entry h1{font-size:clamp(30px,4.5vw,42px); line-height:1.12; margin:10px 0 8px;}
article.entry .meta{color:var(--gris); font-size:14.5px; margin-bottom:34px;}
article.entry h2{font-size:26px; margin:42px 0 12px;}
article.entry h3{font-size:20px; margin:30px 0 10px;}
article.entry table{width:100%; border-collapse:collapse; background:var(--carte);
  border:1px solid var(--ligne); border-radius:10px; overflow:hidden; font-size:15px; margin:20px 0;}
article.entry th{background:var(--encre); color:var(--ivoire); text-align:left; padding:9px 13px; font-size:13px;}
article.entry td{padding:9px 13px; border-top:1px solid var(--ligne);}
.conseil{background:#FFF6E3; border-left:5px solid var(--jaune); border-radius:10px; padding:16px 20px; margin:24px 0;}
.conseil b{display:block; margin-bottom:4px;}

/* Forms */
form.devis{display:grid; gap:14px; max-width:560px;}
form.devis input, form.devis select, form.devis textarea{
  font:16px "Inter","Segoe UI",sans-serif; padding:12px 14px; border:1px solid var(--ligne);
  border-radius:10px; background:var(--carte); width:100%;}
form.devis textarea{min-height:130px; resize:vertical;}
form.devis button{justify-self:start; border:0; cursor:pointer;}
.hp{position:absolute; left:-9999px;}

/* Images */
.figure{margin:0 0 30px;}
.figure img{width:100%; height:auto; border-radius:14px; display:block;}
.page-visual{max-width:1140px; margin:-34px auto 10px; padding:0 24px;}
.page-visual img{width:100%; height:340px; object-fit:cover; border-radius:16px; display:block; box-shadow:0 14px 40px rgba(22,21,20,.18);}

/* Mobile */
@media (max-width:760px){
  .wrap{padding:0 18px;}
  header.site .wrap{padding:14px 16px; gap:8px; justify-content:center;}
  .logo{width:100%; text-align:center; margin-right:0;}
  nav.main{display:flex; flex-wrap:wrap; justify-content:center; gap:4px 16px; width:100%;}
  nav.main a{margin-left:0; font-size:14px;}
  nav.main a.cta{padding:6px 16px;}
  .hero{padding:40px 0 48px;}
  .hero h1{white-space:normal; font-size:29px; line-height:1.15;}
  .hero p{font-size:16.5px; margin-bottom:24px;}
  .btn{display:inline-block; padding:12px 24px; font-size:15px;}
  .btn.ghost{margin-left:0; margin-top:10px;}
  section{padding:40px 0;}
  section h2{font-size:25px;}
  .lead{font-size:16.5px; margin-bottom:24px;}
  .card{padding:20px 18px;}
  article.entry{padding:38px 18px 22px;}
  article.entry h1{font-size:26px;}
  article.entry h2{font-size:22px;}
  article.entry table{display:block; overflow-x:auto;}
  .page-visual{margin-top:-22px; padding:0 18px;}
  .page-visual img{height:190px; border-radius:12px;}
  footer.site{padding:34px 0 24px;}
}

/* Footer */
footer.site{background:var(--encre); color:#CFC9BF; padding:44px 0 30px; margin-top:60px; font-size:14.5px;}
footer.site .wrap{display:grid; gap:28px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
footer.site h4{color:var(--ivoire); font-size:14px; text-transform:uppercase; letter-spacing:.06em; margin:0 0 10px;}
footer.site a{color:#CFC9BF; display:block; padding:2px 0;}
footer.site a:hover{color:var(--jaune);}
footer.site .legal{grid-column:1/-1; border-top:1px solid #33302C; padding-top:18px; color:#8A857D; font-size:13px;}