/* Components — reusable classes set in Elementor > Advanced > CSS classes.
   Default button / field / link styles live in the Elementor Kit; these classes only add variants. */

/* ---------- Buttons (on a Button widget) ----------
   default (Kit)      : primary — IS Bleu background, IS Nuit text
   is-btn-secondary   : outline white, for dark backgrounds
   is-btn-dark        : IS Navy background
   is-btn-outline     : IS Navy outline, for light backgrounds
   is-btn-arrow       : adds the "→" after the label
   is-btn-block       : full width                                               */
.elementor-button{transition:background-color .18s,border-color .18s,color .18s;gap:8px}
.is-btn-secondary .elementor-button{background:transparent;border:1px solid rgba(255,255,255,.5);color:#FFFFFF;padding:14px 22px;font-weight:600}
.is-btn-secondary .elementor-button:hover,.is-btn-secondary .elementor-button:focus-visible{background:rgba(255,255,255,.08);color:#FFFFFF}
.is-btn-dark .elementor-button{background:var(--is-navy);color:#FFFFFF}
.is-btn-dark .elementor-button:hover,.is-btn-dark .elementor-button:focus-visible{background:var(--is-navy-hover);color:#FFFFFF}
.is-btn-outline .elementor-button{background:transparent;border:1px solid var(--is-navy);color:var(--is-navy);padding:14px 22px;font-weight:600}
.is-btn-outline .elementor-button:hover,.is-btn-outline .elementor-button:focus-visible{background:var(--is-tint);color:var(--is-navy)}
.is-btn-arrow .elementor-button-text::after{content:"\2192";margin-left:8px;display:inline-block;transition:transform .18s}
.is-btn-arrow .elementor-button:hover .elementor-button-text::after{transform:translateX(3px)}
.is-btn-block,.is-btn-block .elementor-button{width:100%;justify-content:center}

/* Round icon buttons (carousel arrows) */
.is-btn-round{width:44px;height:44px;border-radius:var(--is-r-pill);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}

/* ---------- Eyebrow (on a Heading widget, typography = IS Eyebrow) ---------- */
.is-eyebrow .elementor-heading-title{display:inline-flex;align-items:center;width:fit-content;padding:8px 18px;border-radius:var(--is-r-pill);background:var(--is-blue-ink);color:#FFFFFF}
.is-eyebrow--ia .elementor-heading-title{background:var(--is-grad-ia-eyebrow)}
.is-eyebrow--soft .elementor-heading-title{background:rgba(56,181,255,.14);color:#8FD3FF;font-size:13px;font-weight:600;padding:6px 14px}

/* ---------- Badge (small pill, e.g. "IA" next to a menu item) ---------- */
.is-badge{display:inline-block;vertical-align:2px;margin-left:4px;font-size:10px;font-weight:800;letter-spacing:.06em;padding:2px 7px;border-radius:var(--is-r-pill);background:var(--is-ia-tint);color:var(--is-ia-ink)}

/* ---------- Cards (on a Container) ---------- */
.is-card{background:#FFFFFF;border:1px solid var(--is-border);border-radius:var(--is-r-card);box-shadow:var(--is-shadow);transition:box-shadow .2s}
.is-card:hover{box-shadow:var(--is-shadow-hover)}
.is-card--lg{border-radius:var(--is-r-card-lg);box-shadow:var(--is-shadow-lg)}
.is-card--ia:hover{border-color:var(--is-ia)}

/* ---------- Text link with arrow ---------- */
.is-link a,.is-link .elementor-heading-title{font-size:15px;font-weight:700;color:var(--is-blue-ink)}
.is-link--ia a,.is-link--ia .elementor-heading-title{color:var(--is-ia-ink)}
.is-link a:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- Form fields (Elementor Pro Form; base style in the Kit) ---------- */
.elementor-field-group .elementor-field-textual{transition:border-color .18s,box-shadow .18s}
.elementor-field-group .elementor-field-textual:focus{outline:none;border-color:var(--is-blue);box-shadow:var(--is-focus-ring)}

/* ---------- Backgrounds (on a Container) ---------- */
.is-bg-hero{background:var(--is-hero-bg)}
.is-bg-hero-ia{background:var(--is-hero-bg-ia)}
.is-bg-grid{background-image:linear-gradient(rgba(10,71,120,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(10,71,120,.07) 1px,transparent 1px);background-size:230px 300px;background-position:center top}
.is-bg-soft{background-image:url("../assets/v3/motif-fond-doux.svg");background-size:220px auto;background-repeat:repeat}

/* ---------- Icon tiles ---------- */
.is-icon-brand .elementor-icon{background:var(--is-grad-brand-icon);color:#FFFFFF}
.is-icon-ia .elementor-icon{background:var(--is-grad-ia-icon);color:#FFFFFF}

/* ---------- Section backgrounds ---------- */
.is-bg-light{background-color:var(--is-bg-light)}

/* ---------- Loop item: "IS · Loop · Carte projet" ---------- */
a.is-card-project{color:inherit;text-decoration:none;height:100%}
.is-card-media{position:relative;height:220px;border-radius:14px;overflow:hidden;background:var(--is-grad-brand-icon)}
.is-card-exp-ia-automatisation .is-card-media{background:var(--is-grad-ia-icon)}
/* Project mockup ([is_project_mockup], css/sections.css .is-mockup) on the gradient */
.is-card-media > .is-card-mockup-w{position:absolute;inset:0;width:100%;max-width:none}
.is-card-mockup-w .elementor-widget-container,.is-card-mockup-w .elementor-shortcode{height:100%}
.is-card-media > .is-card-badge{position:absolute;left:12px;top:12px;z-index:1;width:auto}
.is-card-badge .elementor-heading-title{display:inline-block;font-size:12px;font-weight:700;line-height:1.5;padding:4px 10px;border-radius:var(--is-r-pill);background:#FFFFFF;color:var(--is-blue-ink)}
.is-card-badge .elementor-heading-title:has(.is-card-badge__pill){display:flex;flex-wrap:wrap;gap:6px;padding:0;background:none}
.is-card-badge__pill{padding:4px 10px;border-radius:var(--is-r-pill);background:#FFFFFF}
.is-card-title .elementor-heading-title{font-size:18px;font-weight:700;line-height:1.35;color:var(--is-navy)}
.is-card-meta .elementor-heading-title{font-size:14px;line-height:1.5;color:var(--is-muted)}
.is-card-cta .elementor-heading-title{display:block;padding-top:8px;font-size:14px;font-weight:700;line-height:1.5;color:var(--is-blue-ink)}

/* ---------- Loop item: "IS · Loop · Témoignage" ---------- */
figure.is-card-testi{margin:0;border-radius:18px;height:100%}
/* Quote mark drawn on the text widget (a container's ::before is Elementor's background overlay) */
.is-testi-quote::before{content:"";display:block;width:34px;height:26px;margin-bottom:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 26'%3E%3Cpath fill='%2338B5FF' d='M0 26V15.6C0 6.9 4.4 1.7 13.1 0l1.6 3.4C10 4.8 7.6 7.6 7.2 11.6H13V26H0Zm19.6 0V15.6C19.6 6.9 24 1.7 32.7 0l1.3 3.4c-4.7 1.4-7 4.2-7.4 8.2h5.8V26H19.6Z'/%3E%3C/svg%3E") no-repeat}
.is-testi-quote,.is-testi-quote p{margin:0;font-size:16px;line-height:1.65;color:var(--is-navy)}
.is-testi-caption{margin-top:auto}
.e-con .is-testi-logo{display:flex;align-items:center;flex-shrink:0;height:28px;padding-right:12px;border-right:1px solid #D6EAFB} /* no shrink: a squeezed box let the logo cover the separator */
/* Every logo is scaled to fit 86 × 28 with its proportions (Airbus in the mockup = 86 × 16): wordmarks stay slim,
   square logos grow up to 28px. The source files are larger than that box. */
.is-testi-logo img[src]{width:auto;height:auto;max-width:86px;max-height:28px;display:block}
.is-testi-logo:not(:has(img)),.is-avatar:not(:has(.elementor-heading-title)){display:none}
.is-avatar .elementor-heading-title{width:40px;height:40px;border-radius:var(--is-r-pill);background:var(--is-tint);color:var(--is-blue-ink);font-size:14px;font-weight:800;display:flex;align-items:center;justify-content:center}
/* display:block: an inline title sits in a line box of the body line-height (26px), which spread name and role apart */
.is-testi-name .elementor-heading-title{display:block;font-size:15px;font-weight:700;line-height:1.4;color:var(--is-navy)}
.is-testi-role .elementor-heading-title{display:block;font-size:13px;line-height:1.4;color:var(--is-muted)}
/* Compact variant (Références grid) */
.is-testi-compact .is-card-testi{padding:28px;gap:18px}
.is-testi-compact .is-testi-quote,.is-testi-compact .is-testi-quote p{font-size:15px}

/* ---------- Loop item: "IS · Loop · Membre" ---------- */
/* Tile colours cycle like the mockup ("of .e-loop-item": the loop container also holds a <style> element) */
.is-card-member{border-radius:18px;height:100%}
.is-member-photo{position:relative;height:150px;border-radius:12px;overflow:hidden;background:linear-gradient(160deg,#38B5FF,#1679C2)}
.e-loop-item:nth-child(7n+2 of .e-loop-item) .is-member-photo{background:linear-gradient(160deg,#1C4A8F,#38B5FF)}
.e-loop-item:nth-child(7n+3 of .e-loop-item) .is-member-photo{background:linear-gradient(160deg,#5BC0F8,#1D6FB8)}
.e-loop-item:nth-child(7n+4 of .e-loop-item) .is-member-photo{background:linear-gradient(160deg,#0D2451,#1C4A8F)}
.e-loop-item:nth-child(7n+5 of .e-loop-item) .is-member-photo{background:linear-gradient(160deg,#38B5FF,#0D2451)}
.e-loop-item:nth-child(7n+6 of .e-loop-item) .is-member-photo{background:linear-gradient(160deg,#7DD3FC,#1679C2)}
.e-loop-item:nth-child(7n+7 of .e-loop-item) .is-member-photo{background:linear-gradient(160deg,#1679C2,#0D2451)}
.is-member-photo > .is-member-img{position:absolute;inset:0;width:100%}
.is-member-img img{width:100%;height:150px;padding:14px;object-fit:contain;display:block}
.is-member-img:not(:has(img)){display:none}
.is-member-photo:has(img) .is-member-initials{display:none}
.is-member-initials .elementor-heading-title{font-size:34px;font-weight:800;letter-spacing:.02em;color:#FFFFFF}
.is-member-name .elementor-heading-title{font-size:15px;font-weight:700;line-height:1.5;color:var(--is-navy)}
.is-member-role .elementor-heading-title{font-size:13px;line-height:1.45;color:var(--is-muted)}

/* ---------- Client logo wall ([is_logo_wall], inc/v3-logo-wall.php) ----------
   Every logo is a mask filled with one colour (exact colour, unlike a filter): the file must have a transparent
   background. --h = optical height of the logo (field of the "Logos clients" post); its width follows its proportions
   (aspect-ratio) and never exceeds its slot. */
.is-logo-wall__logo{display:block;width:auto;max-width:100%;height:var(--h,36px);background-color:#0D2451;opacity:.55;
  -webkit-mask:var(--logo) center/contain no-repeat;
          mask:var(--logo) center/contain no-repeat;
  transition:opacity .2s}
.is-logo-wall__logo:hover{opacity:1}
@media (prefers-reduced-motion:reduce){.is-logo-wall__logo{transition:none}}
.is-logo-wall{list-style:none;margin:0;padding:0}
.e-con > .is-logo-wall-w{width:100%} /* shortcode widget: full row, even in a centred column */
.is-logo-wall__item{display:flex;align-items:center;justify-content:center;min-width:0}
/* Références: white tiles, 4 / 2 columns */
.is-logo-wall--tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px} /* 16 logos: 4 full rows, 8 on phones */
.is-logo-wall--tiles .is-logo-wall__item{height:104px;padding:0 18%;border-radius:16px;background:#FFFFFF;border:1px solid var(--is-border);box-shadow:0 14px 34px -20px rgba(13,36,81,.32)}
@media (max-width:760px){.is-logo-wall--tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.is-logo-wall--tiles .is-logo-wall__item{padding:0 12%}}
/* Closing « Et votre projet ? » tile: fills the free slots of the last row (--d1…--d4 desktop, --m1/--m2 phones, set by
   inc/v3-logo-wall.php from the number of logos); compact (title and button) when it gets a single slot */
.is-logo-wall--tiles .is-logo-wall__cta{padding:0;background:var(--is-navy);border-color:var(--is-navy)}
.is-logo-wall__cta--d2{grid-column:span 2}.is-logo-wall__cta--d3{grid-column:span 3}.is-logo-wall__cta--d4{grid-column:span 4}
@media (min-width:761px){
  .is-logo-wall--tiles .is-logo-wall__cta--d1 a{flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:0 20px;text-align:center}
  .is-logo-wall__cta--d1 .is-logo-wall__cta-text > span:not(.is-logo-wall__cta-title){display:none}
  .is-logo-wall__cta--d1 .is-logo-wall__cta-link{padding:7px 12px;font-size:13px}
}
.is-logo-wall__cta a{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;height:100%;padding:0 28px;color:#FFFFFF;text-decoration:none;border-radius:inherit}
.is-logo-wall__cta-text{display:flex;flex-direction:column;gap:4px;font-size:14px;line-height:1.45;color:rgba(255,255,255,.75)}
.is-logo-wall__cta-title{font-size:18px;font-weight:700;line-height:1.3;color:#FFFFFF}
.is-logo-wall__cta-link{flex-shrink:0;padding:10px 16px;border-radius:var(--is-r-btn);background:var(--is-blue);color:var(--is-night);font-size:14px;font-weight:700;transition:background-color .18s}
.is-logo-wall__cta a:hover .is-logo-wall__cta-link{background:var(--is-blue-hover)}
.is-logo-wall__cta a:focus-visible{outline:2px solid var(--is-blue);outline-offset:3px}
@media (max-width:760px){
  .is-logo-wall--tiles .is-logo-wall__cta{grid-column:span 2;height:auto;padding:0}
  .is-logo-wall__cta a{flex-direction:column;align-items:flex-start;padding:20px}
  .is-logo-wall--tiles .is-logo-wall__cta--m1{grid-column:span 1;height:104px}
  .is-logo-wall--tiles .is-logo-wall__cta--m1 a{align-items:center;justify-content:center;gap:8px;padding:0 14px;text-align:center}
  .is-logo-wall__cta--m1 .is-logo-wall__cta-text > span:not(.is-logo-wall__cta-title){display:none}
  .is-logo-wall__cta--m1 .is-logo-wall__cta-title{font-size:15px}
  .is-logo-wall__cta--m1 .is-logo-wall__cta-link{padding:6px 10px;font-size:12px}
}
/* Accueil: one row on the dark hero, white logos */
.is-logo-wall--strip{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:28px 50px}
.is-logo-wall--strip .is-logo-wall__logo{background-color:#FFFFFF}
@media (max-width:760px){.is-logo-wall--strip{gap:24px 30px}}

/* ---------- Visibility helpers ---------- */
@media (max-width:767px){.is-hide-mobile{display:none!important}} /* !important: must beat Elementor display rules */

/* Project links in the hero (inc/v3-project-links.php): « Voir le site » + official store badges, 48px high */
.is-project-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:12px}
.is-project-links__site{display:inline-flex;align-items:center;gap:8px;padding:13px 20px;border:1px solid rgba(255,255,255,.5);border-radius:10px;color:#FFFFFF;font-size:15px;font-weight:600;line-height:1.3;text-decoration:none;transition:background .2s}
.is-project-links__site:hover,.is-project-links__site:focus-visible{background:rgba(255,255,255,.08);color:#FFFFFF}
.is-v3 .is-project-links .is-project-links__site,.is-v3 .is-project-links .is-project-links__site:hover{color:#FFFFFF} /* .is-v3: beats the kit's link colour */
.is-project-links__stores{display:inline-flex;flex-wrap:wrap;align-items:center;gap:12px}
.is-project-links__store{display:block;line-height:0;border-radius:9px}
.is-project-links__store img{display:block;width:auto;max-width:none}
.is-project-links__store--apple img{height:48px}
.is-project-links__store--google img{height:62.5px;margin:-7.25px -4px -7.5px} /* the official PNG has transparent clear space: the visible badge is 48px high */
.is-project-links a:focus-visible{outline:2px solid #38B5FF;outline-offset:3px}
@media (max-width:760px){
  .is-project-links__stores{flex-basis:100%} /* button alone on its line, badges below */
}

/* « En ligne » mention on the project card ([is_project_online]) */
.is-card-online-w{position:absolute;top:12px;right:12px;z-index:2;margin:0!important;width:auto!important}
.is-card-online{display:inline-flex;align-items:center;gap:6px;height:28px;box-sizing:border-box;padding:0 12px;border-radius:var(--is-r-pill);background:#FFFFFF;font-size:12px;font-weight:700;line-height:1.2;color:#15803D;box-shadow:0 6px 16px -8px rgba(13,36,81,.45)}
.is-card-online__dot{width:7px;height:7px;border-radius:7px;background:#22C55E;box-shadow:0 0 0 3px rgba(34,197,94,.18)}