/* ===== Casa & Reformas — design Claude Design (préfixe cs-) ===== */
/* Méditerranéen : crème #FBF8F3 + vert olive #2F5D50 + terracota #c2683a, Spectral + Mulish */
*{box-sizing:border-box}
.cs-page{min-height:100vh;background:#FBF8F3;color:#26312B;font-family:'Mulish',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.cs-page a{color:#2F5D50;text-decoration:none}
.cs-page a:hover{color:#c2683a}
.cs-page ::selection{background:#c2683a;color:#FBF8F3}
.cs-amp{color:#c2683a;font-style:italic;font-weight:600}

/* ---- Topbar ---- */
.cs-topbar{position:sticky;top:0;z-index:50;background:rgba(251,248,243,.88);backdrop-filter:blur(10px);border-bottom:1px solid #ECE3D5}
.cs-topbar-inner{max-width:1200px;margin:0 auto;padding:0 32px;height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.cs-brand{display:flex;align-items:center;gap:11px;color:#2F5D50}
.cs-logo{display:inline-flex;line-height:0}
.cs-brand-name{font-family:'Spectral',serif;font-weight:700;font-size:21px;letter-spacing:-.01em;color:#26312B}
.cs-nav{display:flex;align-items:center;gap:32px}
.cs-nav-links{display:flex;align-items:center;gap:26px;font-size:15px;font-weight:600}
.cs-navcta{background:#2F5D50;color:#FBF8F3!important;padding:11px 20px;border-radius:999px;font-weight:700;font-size:14px}
.cs-navcta:hover{background:#26312B;color:#FBF8F3!important}

/* ---- Hero ---- */
.cs-hero{max-width:1200px;margin:0 auto;padding:60px 32px 48px}
.cs-hero-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.cs-eyebrow{display:inline-block;text-transform:uppercase;letter-spacing:.16em;font-size:12.5px;font-weight:800;color:#c2683a;margin-bottom:20px}
.cs-h1{font-family:'Spectral',serif;font-weight:700;font-size:56px;line-height:1.04;letter-spacing:-.02em;margin:0 0 22px;color:#26312B}
.cs-h1 em{font-style:italic;color:#2F5D50}
.cs-sub{font-size:19px;line-height:1.6;color:#55605A;max-width:520px;margin:0 0 32px}
.cs-cta-row{display:flex;gap:14px;flex-wrap:wrap}
.cs-btn-primary{background:#c2683a;color:#FBF8F3!important;padding:15px 28px;border-radius:999px;font-weight:700;font-size:15.5px}
.cs-btn-primary:hover{background:#a8552c;color:#FBF8F3!important}
.cs-btn-ghost{background:transparent;color:#2F5D50!important;padding:15px 28px;border-radius:999px;font-weight:700;font-size:15.5px;border:1.5px solid #cbdbd3}
.cs-btn-ghost:hover{border-color:#2F5D50;background:#F2ECE1}
.cs-hero-right{position:relative;display:block}
.cs-hero-imgwrap{border-radius:22px;overflow:hidden;background:#2F5D50;box-shadow:0 24px 60px rgba(38,49,43,.16);aspect-ratio:4/5}
.cs-hero-imgwrap img{width:100%;height:100%;object-fit:cover;display:block}
.cs-hero-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#FBF8F3;font-family:'Spectral',serif;font-style:italic;font-size:22px;text-align:center;padding:16px}
.cs-hero-stat{position:absolute;bottom:-22px;left:-22px;background:#FBF8F3;border-radius:16px;padding:16px 20px;box-shadow:0 12px 34px rgba(38,49,43,.14)}
.cs-hero-stat-val{font-family:'Spectral',serif;font-weight:700;font-size:26px;color:#2F5D50;line-height:1}
.cs-hero-stat-lbl{font-size:12.5px;color:#7A8078;font-weight:600;margin-top:3px}

/* ---- Featured ---- */
.cs-featured-sec{max-width:1200px;margin:0 auto;padding:24px 32px 8px}
.cs-featured{display:grid;grid-template-columns:1fr 1fr;gap:0;border-radius:22px;overflow:hidden;background:#fff;box-shadow:0 14px 44px rgba(38,49,43,.09);border:1px solid #F0E8DB;color:inherit;transition:box-shadow .2s}
.cs-featured:hover{box-shadow:0 20px 56px rgba(38,49,43,.14)}
.cs-featured-img{min-height:340px;background:#c2683a}
.cs-featured-img img{width:100%;height:100%;object-fit:cover;display:block;min-height:340px}
.cs-featured-ph{display:flex;align-items:center;justify-content:center;color:#FBF8F3;font-family:'Spectral',serif;font-style:italic;font-size:22px;text-align:center;padding:16px}
.cs-featured-body{padding:44px 46px;display:flex;flex-direction:column;justify-content:center}
.cs-featured-tagrow{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.cs-tag{background:#F6E7DC;color:#c2683a;padding:5px 13px;border-radius:999px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.cs-featured-kicker{font-family:'Spectral',serif;font-style:italic;color:#9AA098;font-size:15px}
.cs-featured-title{font-family:'Spectral',serif;font-weight:700;font-size:32px;line-height:1.12;letter-spacing:-.015em;margin:0 0 16px;color:#26312B}
.cs-featured-excerpt{font-size:16.5px;line-height:1.62;color:#55605A;margin:0 0 26px}
.cs-byline{display:flex;align-items:center;gap:12px}
.cs-avatar{width:40px;height:40px;border-radius:50%;background:#2F5D50;color:#FBF8F3;display:flex;align-items:center;justify-content:center;font-family:'Spectral',serif;font-weight:600;font-size:16px;flex-shrink:0}
.cs-byline-name{font-weight:700;font-size:14.5px;color:#26312B}
.cs-byline-meta{font-size:13px;color:#8A9089}

/* ---- Category pills ---- */
.cs-cats-sec{max-width:1200px;margin:0 auto;padding:44px 32px 8px}
.cs-cats{display:flex;flex-wrap:wrap;gap:12px}
.cs-cat{display:inline-flex;align-items:center;gap:9px;padding:10px 18px;border-radius:999px;background:#fff;border:1px solid #EAE0D1;font-weight:700;font-size:14.5px;color:#26312B!important}
.cs-cat:hover{border-color:#c2683a}
.cs-cat-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}

/* ---- Grid ---- */
.cs-grid-sec{max-width:1200px;margin:0 auto;padding:40px 32px 24px}
.cs-grid-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:32px;gap:20px;flex-wrap:wrap}
.cs-grid-title{font-family:'Spectral',serif;font-weight:700;font-size:36px;letter-spacing:-.015em;margin:0;color:#26312B}
.cs-grid-sub{font-size:16px;color:#7A8078;margin:8px 0 0}
.cs-grid-link{font-weight:700;font-size:15px;color:#2F5D50}
.cs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px}
.cs-card{display:flex;flex-direction:column;background:#fff;border-radius:18px;overflow:hidden;border:1px solid #F0E8DB;box-shadow:0 6px 22px rgba(38,49,43,.06);color:inherit;transition:box-shadow .2s,transform .2s}
.cs-card:hover{box-shadow:0 16px 40px rgba(38,49,43,.13);transform:translateY(-3px)}
.cs-card-imgwrap{position:relative;aspect-ratio:3/2;background:#e7ddd0}
.cs-card-imgwrap img{width:100%;height:100%;object-fit:cover;display:block}
.cs-card-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#FBF8F3;font-family:'Spectral',serif;font-style:italic;font-size:18px;text-align:center;padding:12px}
.cs-card-tag{position:absolute;top:14px;left:14px;background:rgba(251,248,243,.95);padding:5px 12px;border-radius:999px;font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.07em}
.cs-card-body{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1}
.cs-card-time{font-size:12.5px;color:#9AA098;font-weight:700;margin-bottom:9px}
.cs-card-title{font-family:'Spectral',serif;font-weight:600;font-size:20.5px;line-height:1.22;letter-spacing:-.01em;margin:0 0 11px;color:#26312B}
.cs-card-excerpt{font-size:14.5px;line-height:1.55;color:#666F68;margin:0}

/* ---- Newsletter ---- */
.cs-news{max-width:1200px;margin:64px auto 0;padding:0 32px}
.cs-news-box{background:#F3EADD;border:1px solid #EADFCD;border-radius:24px;padding:56px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.cs-news-kicker{display:inline-block;text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:800;color:#c2683a;margin-bottom:14px}
.cs-news-title{font-family:'Spectral',serif;font-weight:700;font-size:34px;line-height:1.12;letter-spacing:-.015em;margin:0 0 14px;color:#26312B}
.cs-news-text{font-size:17px;line-height:1.6;color:#5A6560;margin:0}
.cs-news-form{display:flex;flex-direction:column;gap:12px}
.cs-news-form input{width:100%;padding:15px 18px;border-radius:12px;border:1.5px solid #DDD1BE;background:#FBF8F3;font-family:'Mulish',sans-serif;font-size:15.5px;color:#26312B}
.cs-news-form button{background:#2F5D50;color:#FBF8F3;border:none;padding:15px 18px;border-radius:12px;font-family:'Mulish',sans-serif;font-weight:800;font-size:15.5px;cursor:pointer}
.cs-news-form button:hover{background:#26312B}
.cs-news-fine{font-size:12.5px;color:#8A9089;text-align:center}

/* ---- Footer ---- */
.cs-footer{max-width:1200px;margin:0 auto;padding:64px 32px 48px}
.cs-footer-cols{border-top:1px solid #EADFCD;padding-top:40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px}
.cs-footer-brand{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.cs-footer-brandname{font-family:'Spectral',serif;font-weight:700;font-size:19px;color:#26312B}
.cs-footer-tag{font-family:'Spectral',serif;font-style:italic;font-size:17px;color:#7A8078;margin:0;max-width:320px;line-height:1.5}
.cs-footer-h4{font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:#9AA098;margin:0 0 14px}
.cs-footer-links{display:flex;flex-direction:column;gap:10px;font-size:15px;font-weight:600}
.cs-footer-bottom{margin-top:40px;font-size:13px;color:#9AA098}

/* ---- Article ---- */
.cs-art-head{max-width:760px;margin:0 auto;padding:56px 32px 0;text-align:center}
.cs-breadcrumb{font-size:13.5px;color:#9AA098;font-weight:600;margin-bottom:22px}
.cs-breadcrumb span{color:#CFC6B6;margin:0 6px}
.cs-art-badge{display:inline-block;background:#F6E7DC;color:#c2683a;padding:6px 15px;border-radius:999px;font-size:12.5px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:24px}
.cs-art-h1{font-family:'Spectral',serif;font-weight:700;font-size:48px;line-height:1.08;letter-spacing:-.02em;margin:0 0 20px;color:#26312B}
.cs-art-sub{font-size:20px;line-height:1.55;color:#55605A;margin:0 auto 32px;max-width:620px}
.cs-art-byline{display:inline-flex;align-items:center;gap:13px}
.cs-avatar-lg{width:46px;height:46px;font-size:18px}
.cs-art-byline-txt{text-align:left}
.cs-art-byline-name{font-weight:700;font-size:15px;color:#26312B}
.cs-art-byline-meta{font-size:13.5px;color:#8A9089}
.cs-art-hero{max-width:1080px;margin:44px auto 0;padding:0 32px}
.cs-art-hero-img{border-radius:22px;overflow:hidden;background:#c2683a;aspect-ratio:16/9;box-shadow:0 20px 54px rgba(38,49,43,.14)}
.cs-art-hero-img img{width:100%;height:100%;object-fit:cover;display:block}
.cs-art-ph{display:flex;align-items:center;justify-content:center;color:#FBF8F3;font-family:'Spectral',serif;font-style:italic;font-size:22px;text-align:center;padding:16px}

.cs-art-body{max-width:720px;margin:0 auto;padding:52px 32px 8px;font-size:18.5px;line-height:1.72;color:#333B36}
.cs-art-body>p:first-of-type::first-letter{float:left;font-family:'Spectral',serif;font-weight:700;font-size:74px;line-height:.78;color:#2F5D50;margin:8px 12px 0 0}
.cs-art-body p{margin:0 0 24px}
.cs-art-body h2{font-family:'Spectral',serif;font-weight:700;font-size:30px;letter-spacing:-.015em;line-height:1.2;margin:44px 0 16px;color:#26312B}
.cs-art-body h3{font-family:'Spectral',serif;font-weight:600;font-size:22px;margin:32px 0 12px;color:#26312B}
.cs-art-body ul,.cs-art-body ol{margin:0 0 24px;padding-left:22px}
.cs-art-body li{margin-bottom:12px}
.cs-art-body strong{color:#26312B}
.cs-art-body a{color:#2F5D50;text-decoration:underline;text-underline-offset:2px}
.cs-art-body a:hover{color:#c2683a}
.cs-art-body blockquote{margin:36px 0;padding:28px 32px;background:#F3EADD;border-left:4px solid #c2683a;border-radius:0 16px 16px 0}
.cs-art-body blockquote p{font-family:'Spectral',serif;font-style:italic;font-size:24px;line-height:1.4;color:#26312B;margin:0}
.cs-art-body blockquote footer,.cs-art-body blockquote cite{margin-top:14px;font-size:14.5px;font-weight:700;font-style:normal;color:#2F5D50;display:block}
.cs-table-scroll{overflow-x:auto;margin:0 0 14px}
.cs-art-body table{width:100%;border-collapse:collapse;font-size:16px;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 6px 22px rgba(38,49,43,.06);border:1px solid #F0E8DB}
.cs-art-body thead tr{background:#2F5D50;color:#FBF8F3;text-align:left}
.cs-art-body th{padding:14px 18px;font-weight:800;font-size:13.5px;text-transform:uppercase;letter-spacing:.05em}
.cs-art-body td{padding:14px 18px;color:#55605A;border-bottom:1px solid #F0E8DB}
.cs-art-body tbody tr:nth-child(even){background:#FCFAF6}
.cs-art-body tbody td:first-child{font-weight:700;color:#26312B}

/* FAQ */
.cs-art-faq-sec{max-width:760px;margin:16px auto 0;padding:36px 32px 0}
.cs-art-faq-title{font-family:'Spectral',serif;font-weight:700;font-size:30px;letter-spacing:-.015em;margin:0 0 24px;color:#26312B}
.cs-art-faq{display:flex;flex-direction:column;gap:14px}
.cs-art-faq-item{background:#fff;border:1px solid #F0E8DB;border-radius:16px;padding:24px 26px;box-shadow:0 4px 18px rgba(38,49,43,.05)}
.cs-art-faq-item h3{font-family:'Spectral',serif;font-weight:600;font-size:19px;margin:0 0 9px;color:#26312B}
.cs-art-faq-item p{font-size:16px;line-height:1.6;color:#55605A;margin:0}

/* Author box */
.cs-authorbox-sec{max-width:760px;margin:44px auto 0;padding:0 32px}
.cs-authorbox{background:#2F5D50;border-radius:22px;padding:38px 40px;display:flex;gap:26px;align-items:center;box-shadow:0 16px 44px rgba(47,93,80,.22)}
.cs-authorbox-av{flex-shrink:0;width:76px;height:76px;border-radius:50%;background:#FBF8F3;color:#2F5D50;display:flex;align-items:center;justify-content:center;font-family:'Spectral',serif;font-weight:700;font-size:30px}
.cs-authorbox-label{font-family:'Spectral',serif;font-style:italic;font-size:14px;color:#B8D0C6;margin-bottom:4px}
.cs-authorbox-name{font-family:'Spectral',serif;font-weight:700;font-size:22px;color:#FBF8F3;margin-bottom:10px}
.cs-authorbox-bio{font-size:15px;line-height:1.62;color:#D6E3DC}
.cs-authorbox-bio p{margin:0 0 10px}
.cs-authorbox-bio p:last-child{margin:0}
.cs-authorbox-bio a{color:#FBF8F3;text-decoration:underline}

/* Related */
.cs-related{max-width:1200px;margin:72px auto 0;padding:0 32px}
.cs-related-title{font-family:'Spectral',serif;font-weight:700;font-size:32px;letter-spacing:-.015em;margin:0 0 28px;color:#26312B}

/* ---- Responsive ---- */
@media(max-width:880px){
 .cs-hero-inner{grid-template-columns:1fr;gap:44px}
 .cs-hero-right{max-width:420px;margin:0 auto}
 .cs-h1{font-size:44px}
 .cs-featured{grid-template-columns:1fr}
 .cs-featured-img,.cs-featured-img img{min-height:240px}
 .cs-featured-body{padding:34px 30px}
 .cs-news-box{grid-template-columns:1fr;padding:40px 28px;gap:28px}
 .cs-art-h1{font-size:36px}
 .cs-art-body blockquote p{font-size:20px}
 .cs-authorbox{flex-direction:column;text-align:center}
}
@media(max-width:760px){
 .cs-nav-links{display:none}
 .cs-hero{padding:40px 22px 40px}
 .cs-topbar-inner{padding:0 20px}
 .cs-grid-sec,.cs-cats-sec,.cs-featured-sec,.cs-news,.cs-footer,.cs-related{padding-left:22px;padding-right:22px}
 .cs-h1{font-size:38px}
}