/* Tea Time Data — styles communs des pages Elementor natives.
 * Les textes, couleurs, tailles et espacements sont réglés dans Elementor (modifiables).
 * Ce fichier ne contient que : remises à zéro, effets/animations, et détails non réglables dans Elementor. */

@keyframes ttdMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ttdDraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes ttdBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes ttdUp{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes ttdIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes ttdFill{from{width:0}}
@keyframes ttdGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes ttdPulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes ttdFade{from{opacity:0}to{opacity:1}}

/* ---------- base ---------- */
html,body{overflow-x:clip}
body{margin:0;background:#fff}
.ttd-sec{font-family:'Archivo',system-ui,sans-serif;color:#061F4A;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.ttd-sec *,.ttd-sec *::before,.ttd-sec *::after{box-sizing:border-box}
.ttd-sec .elementor-widget{margin:0}
.ttd-sec .elementor-widget-container{margin:0;padding:0}
.ttd-sec .elementor-heading-title{margin:0;padding:0}
.ttd-sec .elementor-widget-text-editor p{margin:0}
.ttd-sec .elementor-widget-text-editor p+p{margin-top:0}
.ttd-sec a{color:inherit;text-decoration:none}
.ttd-sec a:hover{color:#F3462F}
.ttd-sec .ttd-nohover a:hover,.ttd-sec a.ttd-nohover:hover{color:inherit}
.ttd-sec .elementor-widget-image img{display:block}
.ttd-sec .elementor-widget-image a{display:block}
.ttd-sec .elementor-button{line-height:1.5}
.ttd-sec .ttd-balance .elementor-heading-title{text-wrap:balance}
.ttd-sec .ttd-pretty .elementor-heading-title,.ttd-sec .ttd-pretty p{text-wrap:pretty}
.ttd-sec .ttd-nowrap .elementor-heading-title{white-space:nowrap}
.ttd-sec .ttd-inline .elementor-heading-title{display:inline}

.ttd-sec .e-con.ttd-wauto{--width:auto;width:auto;max-width:100%}
.ttd-sec .ttd-readmore{margin-top:auto !important}

/* ---------- en-tête ---------- */
.ttd-sec .ttd-loader{display:none !important}
.ttd-header{position:sticky !important;top:var(--wp-admin--admin-bar--height,0px);z-index:99999}
.ttd-header .ttd-logo img{position:relative;top:-4px}
.ttd-header .ttd-nav a{transition:color .2s}
.ttd-header .ttd-nav a:hover{color:#F3462F}

/* ---------- hero ---------- */
.ttd-hero{overflow:hidden}
.ttd-dash-wrap{min-width:0}
.ttd-dash{background:#fff;border:1px solid #D3D7DD;border-radius:10px;overflow:hidden;width:1400px;max-width:none;zoom:0.66;box-shadow:0 50px 90px -30px rgba(0,0,0,.55);-webkit-mask-image:linear-gradient(#000 82%,transparent);mask-image:linear-gradient(#000 82%,transparent);font-family:'Archivo',system-ui,sans-serif;line-height:1.5;color:#061F4A}
.ttd-dash *{box-sizing:border-box}
.ttd-logos .elementor-widget-image{flex:none}

/* ---------- pastilles rouges (tasses) à cheval entre deux sections ---------- */
.ttd-has-badge{position:relative;z-index:2;overflow:visible !important}
.ttd-has-badge>.e-con-inner{position:static}
.ttd-sec .ttd-badge-w{position:absolute !important;bottom:-32px;width:64px !important;height:64px;z-index:6;pointer-events:none;margin:0 !important}
.ttd-sec .ttd-badge-l{left:max(32px,calc((100% - 1200px)/2 + 32px))}
.ttd-sec .ttd-badge-r{right:max(32px,calc((100% - 1200px)/2 + 32px))}
.ttd-badge{width:64px;height:64px;border-radius:50%;background:#F3462F;border:4px solid #fff;box-sizing:border-box;display:flex;align-items:center;justify-content:center}
.ttd-badge>span{width:34px;height:34px;background:#fff;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}

/* ---------- « The problem » : apparition ---------- */
.ttd-js .ttd-pb-sec .ttd-pb{opacity:0;transform:translateY(14px);transition:opacity .9s ease,transform .9s ease}
.ttd-js .ttd-pb-sec.ttd-in .ttd-pb{opacity:1;transform:none}
.ttd-pb-sec .ttd-pb.ttd-d1{transition-delay:.1s}
.ttd-pb-sec .ttd-pb.ttd-d2{transition-delay:.25s}
.ttd-pb-sec .ttd-pb.ttd-d3{transition-delay:.4s}
.ttd-pb-sec .ttd-pb.ttd-d4{transition-delay:.6s}
.elementor-editor-active .ttd-pb-sec .ttd-pb{opacity:1 !important;transform:none !important}

/* ---------- « Questions we answer » : onglets ---------- */
.ttd-tab{cursor:pointer;position:relative;transition:background .3s}
.ttd-tab:not(.ttd-on){background-color:#E3EAF8 !important}
.ttd-tab .ttd-qbar{position:absolute;left:0;top:0;height:3px;width:0;background:#F3462F;z-index:2}
.ttd-tab .ttd-qnum .elementor-heading-title{color:#33508E}
.ttd-tab .ttd-qsub .elementor-heading-title{color:#33508E}
.ttd-tab.ttd-on .ttd-qnum .elementor-heading-title{color:#F3462F}
.ttd-tab.ttd-on .ttd-qsub .elementor-heading-title{color:#263B6B}
.ttd-js .ttd-qpanel:not(.ttd-on){display:none !important}
.elementor-editor-active .ttd-qpanel{display:flex !important}
.ttd-case{transition:border-color .2s}
.ttd-case:hover{border-color:#061F4A !important}
.ttd-case:hover .ttd-case-t .elementor-heading-title{color:#061F4A}

/* ---------- contact ---------- */
.ttd-contact-card .elementor-field-group{margin-bottom:0 !important}
.ttd-contact-card .elementor-form-fields-wrapper{display:flex;flex-direction:column;gap:16px;margin:0 !important}
.ttd-contact-card .elementor-field-group{padding:0 !important;flex-direction:column;align-items:stretch !important;gap:6px}
.ttd-contact-card .elementor-field-label{padding:0 !important;margin:0 !important;line-height:1.5}
.ttd-contact-card .elementor-field-required .elementor-field-label::after{content:" *";color:inherit;padding:0}
.ttd-contact-card input.elementor-field{height:46px;min-height:46px;padding:0 12px}
.ttd-contact-card textarea.elementor-field{padding:12px !important;line-height:normal !important}
.ttd-contact-card input.elementor-field{line-height:normal !important}
.ttd-contact-card .elementor-field-type-submit,.ttd-contact-card .e-form__buttons{width:auto !important;flex:0 0 auto !important;max-width:none}
.ttd-contact-card .elementor-field-type-submit{align-items:flex-start !important}
.ttd-contact-card .elementor-field-type-submit .elementor-button{flex-basis:auto !important;width:auto !important;min-height:0;line-height:normal !important;align-self:flex-start}
.ttd-contact-card textarea.elementor-field{resize:vertical}
.ttd-contact-card .elementor-field-type-submit{margin-top:0}
.ttd-contact-card .elementor-button{width:auto !important;flex:none}
.ttd-contact-card .elementor-field-type-submit{justify-content:flex-start !important}
.ttd-contact-card .elementor-message-success{display:none}
.ttd-contact-card .ttd-sent{display:none !important}
.ttd-contact-card.ttd-is-sent .elementor-widget-form{display:none !important}
.ttd-contact-card.ttd-is-sent .ttd-sent{display:flex !important}
.ttd-sent .ttd-check .elementor-heading-title{width:56px;height:56px;border-radius:50%;background:#F3462F;color:#fff;display:flex;align-items:center;justify-content:center}

/* ---------- menu burger (mobile) ---------- */
.ttd-burger{flex:none;width:40px;height:40px;border:1px solid #D3D7DD;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;margin:0}
.ttd-burger:hover,.ttd-burger:focus{background:#fff;border-color:#D3D7DD}
.ttd-burger-panel{display:none;position:fixed;left:0;right:0;top:var(--ttd-hh,69px);bottom:0;background:#fff;padding:12px 20px 24px;flex-direction:column;z-index:300;overflow:auto;font-family:'Archivo',system-ui,sans-serif}
.ttd-burger-panel.ttd-open{display:flex}
.ttd-burger-panel a{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:0 4px;font-size:20px;font-weight:600;color:#02204D;border-bottom:1px solid #EEF1F6;text-decoration:none}
.ttd-burger-panel a span{color:#9AA3B2;font-size:18px}
.ttd-burger-panel a.ttd-burger-cta{margin-top:auto;justify-content:center;min-height:54px;border-radius:999px;background:#F3462F;color:#fff;font-size:17px;border:0}

/* ---------- mobile (mêmes règles que ttd-mobile.js) ---------- */
@media (max-width:767px){
  .ttd-dash{zoom:1 !important;width:calc(100% / .66) !important;transform:scale(.66);transform-origin:0 0;-webkit-mask-image:none !important;mask-image:none !important}
  .ttd-dash [data-ttd="hp-legend"]{min-height:52px}   /* hauteur identique pour toutes les vues (légende sur 1 ou 2 lignes) : la page ne saute plus */
  .ttd-dash-grid{height:auto !important;grid-template-columns:minmax(0,1fr) !important}
  .ttd-dash-aside,.ttd-dash-filters{display:none !important}
  .ttd-sec .e-con.ttd-logos{display:flex !important;flex-wrap:nowrap !important;justify-content:flex-start !important;align-items:center !important;gap:0 !important;width:100% !important;--width:100%;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .ttd-sec .e-con.ttd-logos::-webkit-scrollbar{display:none}
  .ttd-sec .ttd-logos>.elementor-widget{flex:0 0 50% !important;width:50% !important;max-width:50% !important;scroll-snap-align:start;display:flex;justify-content:center;align-items:center;min-height:96px;margin:0 !important}
  .ttd-logos-bar{display:block !important;align-self:stretch;width:100%;height:3px;margin-top:6px;background:#E4E7EB;border-radius:2px;position:relative;overflow:hidden}
  .ttd-logos-bar>span{position:absolute;top:0;left:0;height:100%;width:50%;background:#F3462F;border-radius:2px;transition:left .1s linear}
  .ttd-sec .ttd-nowrap .elementor-heading-title{white-space:normal}
  .ttd-q{background:transparent !important;box-shadow:none !important;overflow:visible !important}
  .ttd-tab .ttd-qbar{display:none !important}
  .ttd-tab{overflow:hidden}
  .ttd-contact-card input.elementor-field{height:52px;min-height:52px;font-size:16px !important}
  .ttd-contact-card textarea.elementor-field{font-size:16px !important}
}

/* lignes de grille automatiques, comme la maquette (Elementor met 1fr par défaut) */
.ttd-sec .e-con.e-grid,.ttd-sec .e-con.e-grid>.e-con-inner{grid-template-rows:none !important;align-content:normal !important}

/* ---------- apparition des blocs (pages About, News, Article, Login, Why it matters, Solutions, Case Study) ----------
   Reproduit l'effet de la maquette tel qu'il se joue sur les pages WordPress : chaque bloc marqué .ttd-rv
   apparaît au chargement (fondu + montée de 28px), décalé de 0,09 s par rang dans son conteneur parent. */
.ttd-rv{opacity:0;transform:translateY(28px)}
.ttd-rv.ttd-rv-in{opacity:1;transform:none}
.elementor-editor-active .ttd-rv{opacity:1 !important;transform:none !important}

/* champ anti-robot (honeypot Elementor) : invisible et sans espace */
.ttd-sec .elementor-field-type-text:has(> .ttd-hp),.ttd-sec .ttd-hp{display:none !important}

/* menu mobile : le défilement ne se transmet pas à la page derrière (remplace le verrouillage du body) */
.ttd-burger-panel{overscroll-behavior:contain}
/* utilisateurs connectés sur petit écran : la barre d'administration WordPress défile avec la page, l'en-tête collant ne doit donc pas garder un décalage de 46px */
@media (max-width:600px){.admin-bar .ttd-header{top:0 !important}}

/* fondu entre les vues du tableau de bord du hero */
.ttd-dash [data-ttd="hp-title"],.ttd-dash [data-ttd="hp-legend"],.ttd-dash [data-ttd="hp-panel"]{transition:opacity .25s ease}

.ttd-logos-bar{display:none}   /* barre de progression du bandeau de logos : mobile uniquement */

/* ---------- apparition au défilement (.ttd-sr) : l'élément se révèle (fondu + montée) quand il entre dans l'écran ; .ttd-sr-d1 = légèrement après ---------- */
.ttd-js .ttd-sr{opacity:0;transform:translateY(32px);transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.2,1)}
.ttd-js .ttd-sr.ttd-sr-in{opacity:1;transform:none}
.ttd-js .ttd-sr.ttd-sr-d1{transition-delay:.35s}
.elementor-editor-active .ttd-sr{opacity:1 !important;transform:none !important}
@media (prefers-reduced-motion:reduce){.ttd-js .ttd-sr{opacity:1;transform:none;transition:none}}

/* mobile : lignes du pied de page alignées à gauche (la mention légale était alignée à droite) */
@media (max-width:767px){.ttd-sec .ttd-nohover p[style*="text-align"]{text-align:left !important}}

/* cartes « Three ways to use our data » : toute la carte est cliquable (le lien « Read more » est étendu à la carte) + bordure bleue au survol / au focus clavier */
.ttd-sec .e-con.ttd-card{position:relative;cursor:pointer;transition:border-color .2s ease}
.ttd-sec .e-con.ttd-card:hover,.ttd-sec .e-con.ttd-card:focus-within{border-color:#0A55E0 !important}
.ttd-sec .ttd-card .ttd-readmore,.ttd-sec .ttd-card .ttd-readmore .elementor-widget-container{position:static}
.ttd-sec .ttd-card .ttd-readmore a::after{content:"";position:absolute;inset:0;z-index:2}

/* ancres internes (#view, #strategy, #data, #how-it-works…) : tiennent compte de l'en-tête collant */
.ttd-sec[id]{scroll-margin-top:69px}

/* Accessibilité : contour de focus visible pour la navigation au clavier */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #0A55E0 !important;outline-offset:2px !important;border-radius:4px}
.ttd-sec a:focus-visible{outline-color:#0A55E0}
