/* Terra'Piet — blog V3.
   Structure reprise du blog Nemelec : bandeau photo, figures d'article et
   carte « Nos chantiers ». Toutes les classes propres au lot sont préfixées ttb-. */

.ttb-hero{isolation:isolate}
.ttb-hero .ttb-hero-media{z-index:-2;transform:scale(1.01)}
.ttb-hero .ttb-hero-overlay{z-index:-1}
.ttb-hero .ttb-kicker{color:#ffb47a!important}
.ttb-hero .ttb-hero-content{box-sizing:border-box}

.ttb-grid{align-items:stretch}
.ttb-grid .ttb-card{min-width:0;box-shadow:0 10px 34px rgba(0,0,0,.6)}
.ttb-grid .ttb-card img{transition:transform .45s ease}
.ttb-grid .ttb-card:hover img{transform:scale(1.035)}
.ttb-grid .ttb-card:focus-visible{outline:3px solid var(--accent-fonce);outline-offset:4px}
.ttb-grid .ttb-card h3,.ttb-grid .ttb-card p{overflow-wrap:anywhere}

.ttb-prose .ttb-figure{margin:0 0 28px}
.ttb-prose .ttb-figure img{display:block;width:100%;height:auto;border-radius:20px;cursor:zoom-in}

/* Carte copiée bloc par bloc du modèle Nemelec, avec préfixe Terra'Piet. */
.ttb-prose .ttb-realisations{margin:40px 0;padding:36px 28px;text-align:center;background:color-mix(in srgb,var(--accent) 10%,var(--fond));border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);border-radius:24px}
.ttb-prose .ttb-realisations .ttb-eyebrow{display:block;margin:0 0 8px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--accent-texte)}
.ttb-prose .ttb-realisations h3{margin:0 0 8px;font-size:clamp(22px,2.6vw,28px);font-weight:700;line-height:1.15;color:var(--titre)}
.ttb-prose .ttb-realisations .ttb-sub{margin:0 auto 20px;max-width:480px;font-size:15px;line-height:1.6;color:var(--texte-doux)}
.ttb-prose .ttb-realisations .ttb-buttons{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:0}
.ttb-prose .ttb-realisations a.ttb-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;background:var(--accent);color:#1d0d02;font-size:14px;font-weight:700;line-height:1.2;text-decoration:none;border:0;border-radius:40px;box-shadow:0 4px 14px color-mix(in srgb,var(--accent) 30%,transparent);transition:background .2s,transform .2s,box-shadow .2s}
.ttb-prose .ttb-realisations a.ttb-btn span{transition:transform .18s ease}
.ttb-prose .ttb-realisations a.ttb-btn:hover{background:#a8460d;color:#fff;transform:translateY(-2px);box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 40%,transparent)}
.ttb-prose .ttb-realisations a.ttb-btn:hover span{transform:translateX(4px)}
.ttb-prose .ttb-realisations a.ttb-btn:focus-visible{outline:3px solid var(--accent-fonce);outline-offset:3px}

.ttb-prose .ttb-contact-card{box-shadow:0 12px 36px rgba(0,0,0,.6)}
.ttb-prose .ttb-contact-btn{color:#1d0d02!important}
.ttb-prose .ttb-contact-btn:hover{background:#a8460d!important;color:#fff!important}
.ttb-prose .ttb-contact-btn:focus-visible,.ttb-prose .ttb-back-link:focus-visible{outline:3px solid var(--accent-fonce);outline-offset:3px}

@media (max-width:640px){
  .ttb-grid{grid-template-columns:minmax(0,1fr)!important}
  .ttb-hero .ttb-hero-content{padding-left:20px!important;padding-right:20px!important}
}

@media (max-width:520px){
  .ttb-prose .ttb-realisations{margin:32px 0;padding:28px 18px;border-radius:20px}
  .ttb-prose .ttb-realisations a.ttb-btn{justify-content:center;width:100%;max-width:280px;padding:12px 18px}
}

@media (prefers-reduced-motion:reduce){
  .ttb-grid .ttb-card img,.ttb-prose .ttb-realisations a.ttb-btn,.ttb-prose .ttb-realisations a.ttb-btn span{transition:none}
  .ttb-grid .ttb-card:hover img,.ttb-prose .ttb-realisations a.ttb-btn:hover,.ttb-prose .ttb-realisations a.ttb-btn:hover span{transform:none}
}