/* Tea Time Data — page « Why it matters » (Elementor natif). Détails non réglables dans Elementor. */

/* hero : 5 bandes de la photo de Deming (object-fit:cover, centrées à 20 %), la 3e retournée */
.ttd-sec .ttd-deming{width:100%}
.ttd-sec .ttd-deming img{width:100% !important;height:360px !important;object-fit:cover;object-position:center 20%;border-radius:8px;display:block;max-width:none}
.ttd-sec .ttd-deming.ttd-flip img{transform:rotate(180deg)}

/* listes à puces rouges (ul flex de la maquette) */
.ttd-sec .ttd-bul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.ttd-sec .ttd-bul li{display:flex;gap:12px;align-items:baseline;margin:0;padding:0}
.ttd-sec .ttd-bul .ttd-dot{flex:none;width:6px;height:6px;border-radius:50%;background:#F3462F;transform:translateY(-2px)}

/* logos clients : taille fixe */
.ttd-sec .ttd-why-logos>.elementor-widget-image{flex:none}

/* 4P : colonne gauche flex 1 1 280px, colonne droite flex 2 1 480px */
.ttd-sec .e-con.ttd-why-l{flex:1 1 280px !important;width:auto !important;--width:auto;min-width:0}
.ttd-sec .e-con.ttd-why-r{flex:2 1 480px !important;width:auto !important;--width:auto;min-width:0}
.ttd-sec .ttd-cs-hdr{max-width:640px}

/* bouton « Read the full case study → » (pilule) */
.ttd-sec .ttd-csbtn .elementor-button{border-radius:999px}
.ttd-sec .ttd-csbtn .elementor-button-text{display:flex;align-items:center;gap:8px}
.ttd-sec .ttd-csbtn .ttd-arr{display:inline-block}

/* bouton mobile « Show summary ▾ » (ajouté par ttd-mobile.js sur l'original) */
.ttd-sec .ttd-cltog-w{align-self:flex-start}
.ttd-sec button.ttd-cltog,.ttd-sec button.ttd-cltog:hover,.ttd-sec button.ttd-cltog:focus{display:block;border:none !important;background:none !important;padding:6px 0 !important;margin:0;font-family:'Archivo',system-ui,sans-serif;font-size:15px;font-weight:600;line-height:normal;color:#0A55E0 !important;cursor:pointer;border-radius:0;box-shadow:none;text-transform:none;letter-spacing:0}

/* liste « Our case studies » : la flèche ne rétrécit pas */
.ttd-sec .ttd-pill>.ttd-pill-a{flex:none}
.ttd-sec .ttd-pill>.ttd-pill-t{flex:0 1 auto;min-width:0}
.ttd-sec a.ttd-pill:hover{color:inherit}

/* Colonne de gauche (01 Price, 02 Place, 03 Promotion, 04 Product) : reste visible pendant le défilement jusqu'à la fin de sa section.
   Désactivé quand les deux colonnes passent l'une sous l'autre (< 900px). 69px = hauteur de l'en-tête collant. */
.ttd-sec .e-con.ttd-why-l{position:sticky;top:calc(var(--wp-admin--admin-bar--height,0px) + 69px + 32px);align-self:flex-start}
@media (max-width:900px){.ttd-sec .e-con.ttd-why-l{position:static}}

/* Pastilles « Our case studies » : bordure orange au survol (et au focus clavier) */
.ttd-sec .ttd-pill{transition:border-color .2s ease}
.ttd-sec .ttd-pill:hover,.ttd-sec .ttd-pill:focus-visible{border-color:#F3462F !important}