/* APPLIMAN — Du besoin au système. Shared public-site design tokens. */
@font-face { font-family: Manrope; src: url('/fonts/manrope-latin.woff2?v=3') format('woff2'); font-style: normal; font-weight: 400 800; font-display: swap; }
:root {
    --agency-orange: #f4623a;
    --agency-ink: #202326;
    --agency-muted: #5d6169;
    --agency-line: #dedfe2;
    --agency-soft: #f3f4f5;
    --presentation-bg: #fff;
    --presentation-surface: #fff;
    --presentation-surface-strong: var(--agency-soft);
    --presentation-text: var(--agency-ink);
    --presentation-muted: var(--agency-muted);
    --presentation-border: var(--agency-line);
    --presentation-border-strong: #c9ccd0;
    --presentation-blue: #bd421f; /* Compatibility alias for existing components. */
    --presentation-accent: #ffede7;
    --presentation-shadow: 0 12px 32px rgb(32 35 38 / 7%);
    --presentation-shadow-soft: none;
    --presentation-radius-lg: 12px;
    --presentation-radius-md: 10px;
    --presentation-radius-sm: 6px;
    --presentation-radius-pill: 6px;
    --bs-primary: var(--agency-orange);
    --bs-primary-rgb: 244,98,58;
    --bs-primary-text-emphasis: #a6381a;
    --bs-primary-bg-subtle: #ffede7;
    --bs-primary-border-subtle: #e5b7a9;
    --bs-link-color: #ad391b;
    --bs-link-hover-color: #832b14;
    --bs-body-color: var(--agency-ink);
    --bs-body-bg: #fff;
    --bs-body-font-family: Manrope, 'Segoe UI', sans-serif;
    --bs-secondary-color: var(--agency-muted);
    --bs-border-color: var(--agency-line);
}
html { scroll-padding-top: 7rem; background: #fff; }
body { background: #fff; color: var(--agency-ink); font-family: var(--bs-body-font-family); }
::selection { background: #ffd4c7; color: #202326; }
:focus-visible { outline: 3px solid #bd421f; outline-offset: 4px; }
input, textarea { caret-color: #bd421f; }
* { scrollbar-color: #858990 #f3f4f5; }
h1, h2, h3 { text-wrap: balance; letter-spacing: -.03em; }
p { text-wrap: pretty; }
a { text-underline-offset: .22em; }
main { min-width: 0; }
#main-content:focus { outline: none; }
.skip-link { position: fixed; z-index: 2000; left: 1rem; top: -5rem; padding: .8rem 1.2rem; background: white; color: #202326; }
.skip-link:focus { top: 1rem; }
.container.agency-container { max-width: 1440px; padding-inline: clamp(24px, 5.6vw, 86px); }
#mainNav.agency-nav, #mainNav.agency-nav.navbar-shrink { position: relative; padding: 1.1rem 0; background: var(--agency-ink); box-shadow: none; }
#mainNav.agency-nav .agency-container { max-width: 1536px; }
.agency-logo { display: block; width: clamp(205px, 19vw, 280px); height: auto; max-width: 100%; }
#mainNav .navbar-brand, #mainNav .navbar-brand img, #mainNav .brand-shrink img { filter: none; transform: none; margin: 0; }
#mainNav.agency-nav .navbar-nav .nav-link { color: #f5f5f6; background: transparent; padding: .7rem .85rem; font-size: .95rem; white-space: nowrap; font-weight: 500; }
#mainNav.agency-nav .navbar-nav .nav-link:hover, #mainNav.agency-nav .navbar-nav .nav-link.active { color: #ff9a7d; background: transparent; }
#mainNav .navbar-toggler { border-color: #777b80; padding: .6rem; }
#mainNav :focus-visible { outline-color: #ff9a7d; }
.btn { border-radius: 6px; font-weight: 700; letter-spacing: -.01em; }
.btn-xl { text-transform: none; font-size: 1rem; padding: 1rem 1.4rem; }
.btn-primary, .agency-button, .blog-container .btn-primary {
    --bs-btn-color: #202326; --bs-btn-bg: #f4623a; --bs-btn-border-color: #f4623a;
    --bs-btn-hover-color: #202326; --bs-btn-hover-bg: #ff8b67; --bs-btn-hover-border-color: #ff8b67;
    --bs-btn-active-color: #202326; --bs-btn-active-bg: #ee5931; --bs-btn-active-border-color: #ee5931;
    --bs-btn-disabled-color: #202326; --bs-btn-disabled-bg: #f4b29e; --bs-btn-disabled-border-color: #f4b29e;
    border-radius: 6px; box-shadow: none;
}
.agency-button { display: inline-flex; align-items: center; justify-content: center; gap: .9rem; padding: .95rem 1.5rem; font-size: .98rem; white-space: normal; }
.btn-dark, .btn-outline-dark, .btn-outline-primary { box-shadow: none; backdrop-filter: none; }
.btn-outline-primary { --bs-btn-color: #a6381a; --bs-btn-border-color: #bd421f; --bs-btn-hover-bg: #ffede7; --bs-btn-hover-color: #832b14; --bs-btn-hover-border-color: #a6381a; background: transparent; }
.btn-primary:hover, .btn-dark:hover, .btn-outline-dark:hover, .btn-outline-primary:hover { transform: none; }
.agency-hero { background: var(--agency-ink); color: #fff; padding: 2rem 0 1.6rem; }
.agency-hero .agency-container, .agency-expertise .agency-container { max-width: 1536px; }
.agency-hero-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 2.4rem; align-items: center; }
.agency-hero-copy { min-width: 0; padding: 1.4rem 0 .2rem; }
.agency-eyebrow { color: #ff997c; font-size: .72rem; letter-spacing: .17em; font-weight: 700; text-transform: uppercase; margin: 0 0 2.1rem; }
.agency-hero h1 { font-size: clamp(2.5rem,4.2vw,4.05rem); font-weight: 800; line-height: 1.085; margin: 0; letter-spacing: -.035em; text-wrap: initial; }
.agency-hero-lead { font-size: clamp(1.05rem,1.5vw,1.42rem); line-height: 1.5; color: #e4e5e7; margin: 1.9rem 0 1.6rem; max-width: 47ch; }
.agency-principles { list-style: none; display: flex; flex-wrap: wrap; gap: .8rem 0; padding: 0; margin: 3.4rem 0 0; color: #e4e5e7; }
.agency-principles li { font-size: .64rem; letter-spacing: .17em; text-transform: uppercase; padding: 0 1.2rem; border-right: 1px solid #787d84; }
.agency-principles li:first-child { padding-left: 0; }
.agency-principles li:last-child { border: 0; padding-right: 0; }
.agent-journey { background: #fff; color: var(--agency-ink); border-radius: 7px; padding: 1.9rem 2.8rem 1.4rem; min-width: 0; }
.journey-caption { margin: 0 0 .5rem; font-size: .68rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; }
.agent-journey h2 { font-weight: 800; font-size: clamp(1.75rem,2.8vw,2.65rem); line-height: 1.15; margin: 0 0 1.25rem; }
.journey-tabs { display: flex; border-bottom: 1px solid var(--agency-line); margin-bottom: 1.8rem; }
.journey-tab { border: 0; border-bottom: 3px solid transparent; border-radius: 0; padding: .8rem .2rem 1rem; background: transparent; flex: 1; font: inherit; font-size: .92rem; color: var(--agency-muted); display: flex; align-items: center; justify-content: center; gap: .7rem; }
.journey-tab i { font-size: 1.4rem; }
.journey-tab.is-active { border-bottom-color: var(--agency-orange); color: var(--agency-ink); font-weight: 800; }
.journey-tab:hover { background: #fff5f1; }
.journey-steps { list-style: none; padding: 0; margin: 0; }
.journey-steps li { display: grid; grid-template-columns: 4.6rem minmax(0,1fr); gap: 1.2rem; position: relative; padding-bottom: 1.65rem; }
.journey-steps li:not(:last-child)::before { content: ''; position: absolute; top: 3.4rem; bottom: 0; left: 2.05rem; border-left: 1px solid var(--agency-orange); }
.journey-icon { display: grid; place-items: center; width: 4.1rem; height: 4.1rem; border: 1px solid var(--agency-line); border-radius: 8px; }
.journey-icon i { font-size: 1.8rem; }
.journey-steps h3 { font-size: 1.23rem; font-weight: 800; margin: .45rem 0 .25rem; }
.journey-steps p { color: var(--agency-muted); font-size: .95rem; line-height: 1.45; margin: 0; }
.journey-footnote { margin: 0; border-top: 1px solid var(--agency-line); padding-top: 1rem; font-size: .78rem; letter-spacing: .06em; color: var(--agency-muted); }
.agency-expertise { padding: 2.65rem 0 3.5rem; border-bottom: 1px solid var(--agency-line); }
.agency-expertise-grid { display: grid; grid-template-columns: 1.18fr .82fr; gap: 3rem; }
.agency-expertise h2 { margin: 0 0 1rem; font-size: clamp(2.1rem,3.9vw,3.7rem); font-weight: 800; line-height: 1.04; }
.agency-expertise p { color: var(--agency-muted); max-width: 60ch; font-size: 1.13rem; line-height: 1.5; }
.agency-expertise-list { list-style: none; margin: 0; padding: 0 0 0 3.4rem; border-left: 1px solid var(--agency-line); }
.agency-expertise-list li { padding-left: 2.8rem; position: relative; margin-bottom: 1.15rem; }
.agency-expertise-list li::before { content: ''; position: absolute; width: 1.5rem; height: 4px; background: var(--agency-orange); top: .65rem; left: 0; }
.agency-expertise-list h3 { font-size: 1.2rem; font-weight: 800; margin-bottom: .3rem; }
.agency-expertise-list p { font-size: .95rem; margin: 0; }
/* Remaining public sections share the same restrained surface language. */
.home-page { padding-bottom: 0; }
.page-section { padding-block: 5rem; }
.page-section .container { max-width: 1440px; }
.hero-script { font-family: inherit; font-style: normal; font-weight: inherit; color: #a6381a; font-size: inherit; }
.section-title-xl { letter-spacing: -.03em; font-size: clamp(2rem,3.4vw,3.2rem); }
.section-shell, .section-shell-warm, .value-card, .project-card, .contact-shell, .team-card { background: #fff; box-shadow: none; }
.section-shell { padding: clamp(1.4rem,3.5vw,3rem); }
.value-card { border: 0; border-top: 1px solid var(--agency-line); border-radius: 0; padding-top: 1.5rem; }
.value-card:hover, .project-card:hover, .team-card:hover { transform: none; box-shadow: none; }
.section-eyebrow { color: #a6381a; letter-spacing: .08em; }
.service-icon { color: #bd421f; }
.section-shell-warm, .services-section, #how-we-work, #faq { background: #f3f4f5; }
.services-section .value-card { background: transparent; }
.main-footer { padding: 3.5rem 0 2rem; background: #202326; color: #fff; border: 0; }
.main-footer .agency-logo { margin-bottom: 1.4rem; width: 250px; }
.main-footer .footer-copy, .main-footer .footer-meta { color: #c8cbd0; }
.main-footer a, .main-footer .footer-links a, .main-footer .footer-social-link { color: #fff; }
.main-footer a:hover { color: #ff9a7d; }
.main-footer .footer-social-link { background: transparent; border-color: #666b71; border-radius: 6px; }
.main-footer-shell { align-items: start; }
.form-control, .form-select { border-radius: 6px; border-color: #b6bbc1; }
.form-control::placeholder { color: #686d75; }
.form-control:focus, .form-select:focus { border-color: #bd421f; box-shadow: 0 0 0 3px rgb(244 98 58 / 18%); }
/* Agence IA: preserve the complete offer, prices, callback and booking flows. */
.ai-agency-page { --ai-ink: #202326; --ai-muted: #5d6169; --ai-blue: #bd421f; --ai-blue-text: #a6381a; --ai-surface: #fff; }
.ai-agency-page .ai-hero { background: #202326; padding: 3.5rem 0 4rem; }
.ai-agency-page .ai-hero-copy { color: #fff; }
.ai-agency-page .ai-hero h1 { color: #fff; }
.ai-agency-page .ai-hero h1 span { color: #ff9a7d; }
.ai-agency-page .ai-hero-lead, .ai-agency-page .ai-price-line { color: #d3d6da; }
.ai-agency-page .ai-price-line strong, .ai-agency-page .ai-hero .ai-text-link { color: #fff; }
.ai-agency-page .ai-offer-label { background: transparent; color: #e4e5e7; border-color: #676c74; border-radius: 6px; }
.ai-agency-page .ai-offer-label span { background: #f4623a; color: #202326; border-radius: 3px; }
.ai-agency-page .ai-hero-system { border-radius: 10px; box-shadow: none; border: 0; color: #202326; }
.ai-agency-page .ai-final-cta-shell { background: #f3f4f5; border-radius: 12px; }
.ai-agency-page .ai-architecture { background: #202326; }
.ai-agency-page .ai-architecture .ai-kicker { color: #ff9a7d; }
.ai-agency-page .ai-system-core-mark { background: #f4623a; color: #202326; }
/* Secondary routes, including documents and profile cards. */
.privacy-page, .tech-monitoring { padding-top: 3.5rem !important; }
.secondary-page-shell, .tech-monitoring-hero, .profile-shell, .login-shell { background: #fff; box-shadow: none; border-color: var(--agency-line); }
.secondary-page-title, .tech-monitoring-title { letter-spacing: -.03em; }
.agency-document { max-width: 1000px; padding: 3rem 1.5rem 5rem; line-height: 1.8; }
.agency-document h1 { margin-bottom: 1.5rem; }
.agency-document h2, .agency-document h3 { margin-top: 2rem; }
.agency-document img { max-width: 100%; height: auto; }
.vcard-page { padding-block: 3rem; }
.vcard-page .card { background: white; color: #202326; border-color: #dedfe2; border-radius: 12px; box-shadow: none; }
.error-container { background: #f3f4f5 !important; }
.error-container .error-icon { animation: none; }
.error-container .error-content { box-shadow: none; border-radius: 12px; }
/* Blog and all of its routes: reading surfaces remain light. */
.blog-container.blog-shell { max-width: 1440px; padding: 3.2rem clamp(24px,4vw,60px) 4rem; background: white; color: #202326; }
.blog-shell, .blog-shell * { --bs-body-bg: #fff; --bs-body-color: #202326; --bs-secondary-bg: #f3f4f5; --bs-tertiary-bg: #f3f4f5; --bs-border-color: #dedfe2; --bs-secondary-color: #5d6169; --bs-link-color: #ad391b; --bs-link-hover-color: #832b14; }
.blog-shell .blog-hero { padding: 0 0 2rem; border-bottom: 1px solid #dedfe2; }
.blog-shell .blog-hero-pill { background: transparent; border: 0; padding: 0; margin-bottom: 1.2rem; }
.blog-shell .blog-title { max-width: 19ch; font-size: clamp(2.5rem,4.2vw,4rem); letter-spacing: -.035em; }
.blog-shell .blog-section-block { padding: 0; border: 0; background: transparent; box-shadow: none; border-radius: 0; }
.blog-shell .sidebar-section, .blog-shell .blog-panel, .blog-shell .post-sidebar-related, .blog-shell .post-sidebar-tags, .blog-shell .sidebar .card { padding: 1.4rem; background: #f3f4f5; border: 0; border-radius: 8px; box-shadow: none; color: #202326; }
.blog-shell .featured-post, .blog-shell .post-card, .blog-shell .post-list-item { border-color: #dedfe2; border-radius: 8px; box-shadow: none; background: #fff; }
.blog-shell .featured-post:hover, .blog-shell .post-card:hover, .blog-shell .post-list-item:hover { box-shadow: none; transform: none; border-color: #bd421f; }
.blog-shell .post-card:hover .post-card-image img { transform: none; }
.blog-shell .featured-post-placeholder, .blog-shell .post-card-placeholder { background: #202326; }
.blog-shell .post-detail { padding: 0; background: #fff; border: 0; box-shadow: none; border-radius: 0; overflow: visible; }
.blog-shell .post-title { font-size: clamp(2rem,3.5vw,3.3rem); letter-spacing: -.03em; overflow-wrap: anywhere; }
.blog-shell .post-content { font-size: 1.05rem; line-height: 1.8; color: #202326; overflow-wrap: anywhere; }
.blog-shell .post-content h2 { margin-top: 2.5rem; font-size: 1.8rem; }
.blog-shell .post-content h3 { margin-top: 2rem; font-size: 1.45rem; }
.blog-shell .post-content a { color: #ad391b; text-decoration: underline; }
.blog-shell .post-content pre { overflow-x: auto; white-space: pre; max-width: 100%; }
.blog-shell .post-content table { display: block; overflow-x: auto; max-width: 100%; }
.blog-shell .post-content img { max-width: 100%; height: auto; }
.blog-shell .post-podcast-player { background: #f3f4f5; box-shadow: none; border-radius: 8px; }
.blog-shell .form-control, .blog-shell .form-select { color: #202326; background: #fff; border: 1px solid #b6bbc1; border-radius: 6px; }
.blog-shell .form-control:focus, .blog-shell .form-select:focus { border-color: #bd421f; box-shadow: 0 0 0 3px rgb(244 98 58 / 18%); }
.blog-shell .form-control::placeholder, .blog-shell .text-muted { color: #5d6169 !important; }
.blog-shell .toc-nav .nav-link.active { background: #ffede7; color: #832b14; }
.blog-shell .toc-nav .nav-link { line-height: 1.5 !important; padding-block: .3rem !important; }
.blog-shell .post-updated { color: #a6381a; }
.blog-shell .badge.bg-primary, .blog-shell .text-bg-primary { color: #202326 !important; }
.blog-shell .post-image-modal .modal-content { border-radius: 8px; }
@media (min-width: 1600px) { .agency-hero { padding-bottom: 2rem; } }
@media (max-width: 1199.98px) {
    #mainNav .navbar-collapse { padding: 1.4rem 0 .5rem; }
    #mainNav .navbar-collapse .agency-button { margin-top: 1rem; }
    .agency-hero-grid { gap: 2rem; }
    .agent-journey { padding: 1.6rem; }
    .agency-principles { gap: .9rem; margin-top: 2rem; }
    .agency-principles li { border: 0; padding: 0; }
    .agency-expertise-grid { gap: 2rem; }
    .agency-expertise-list { padding-left: 2rem; }
}
@media (max-width: 991.98px) {
    .agency-hero-grid, .agency-expertise-grid { grid-template-columns: 1fr; }
    .agency-hero { padding: 1rem 0 2.4rem; }
    .agency-hero h1 { font-size: clamp(2.5rem,6vw,3.7rem); max-width: 20ch; }
    .agency-hero-copy { padding: 1rem 0; }
    .agency-eyebrow { margin-bottom: 1.4rem; }
    .agency-hero-lead { font-size: 1.2rem; }
    .agency-expertise-list { padding: 0; border: 0; }
    .agency-expertise h2 { font-size: clamp(2.1rem,5.6vw,3rem); }
    .ai-agency-page .ai-hero { padding-top: 2rem; }
    .page-section { padding-block: 3rem; }
}
@media (max-width: 575.98px) {
    .agency-logo { width: 210px; }
    #mainNav.agency-nav { padding-block: 1rem; }
    .agency-hero h1 { font-size: 2.5rem; line-height: 1.12; }
    .agency-hero .agency-button { width: 100%; }
    .agency-principles { gap: .9rem 1rem; }
    .agent-journey { padding: 1.35rem; }
    .agent-journey h2 { font-size: 1.8rem; }
    .journey-tab { font-size: .78rem; gap: .4rem; }
    .journey-tab i { font-size: 1.15rem; }
    .journey-steps li { grid-template-columns: 2.7rem minmax(0,1fr); gap: 1rem; }
    .journey-icon { width: 2.7rem; height: 2.7rem; border-radius: 5px; }
    .journey-icon i { font-size: 1.3rem; }
    .journey-steps li:not(:last-child)::before { top: 2.7rem; left: 1.3rem; }
    .journey-steps h3 { margin-top: .1rem; }
    .journey-steps p { font-size: .9rem; }
    .journey-footnote { letter-spacing: .025em; }
    .blog-shell .blog-hero-pill { display: block; }
    .blog-shell .blog-hero-pill .hero-pill-badge { margin-bottom: .5rem; }
    .blog-shell .featured-post-content { padding: 1.2rem; }
    .blog-shell .post-detail { padding: 0; }
    .main-footer-shell { gap: 2.3rem; }
    .vcard-page { padding-top: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Corrections from desktop/mobile review. */
.os-repo-stack { grid-template-columns: minmax(0, 1fr); }
.os-repo-card { min-width: 0; box-shadow: none; background: #fff; }
.os-repo-meta { flex-wrap: wrap; }
.os-repo-name { overflow-wrap: anywhere; }
.os-repo-card:hover { transform: none; box-shadow: none; }
.vcard-page img { max-width: 100%; height: auto; }
.blog-shell .app-sidebar-icon { background: #ffede7; color: #a6381a; border-radius: 6px; box-shadow: none; }
.blog-shell .app-sidebar-icon i { color: #a6381a; }
.blog-shell .app-sidebar-card { background: transparent; border: 0; border-bottom: 1px solid #dedfe2; border-radius: 0; padding: .9rem 0; }
.blog-shell .app-sidebar-card:last-child { border-bottom: 0; }
.blog-shell .app-sidebar-card:hover, .blog-shell .app-sidebar-card:hover .app-sidebar-icon { transform: none; animation: none; }
.blog-shell .beta-badge { background: #ffede7; color: #832b14; }
.ai-agency-page .ai-hero h1 { font-size: clamp(2.6rem, 4.6vw, 4.4rem); max-width: 17ch; }
.ai-agency-page .ai-hero .btn-dark { --bs-btn-bg: #f4623a; --bs-btn-color: #202326; --bs-btn-border-color: #f4623a; --bs-btn-hover-bg: #ff8b67; --bs-btn-hover-color: #202326; --bs-btn-hover-border-color: #ff8b67; }

.blog-shell .breadcrumb { flex-wrap: wrap; }
.blog-shell .breadcrumb-item { min-width: 0; white-space: normal; overflow-wrap: anywhere; }

/* Shared footer and blog icon contrast, including legacy stylesheet rules. */
.main-footer .main-footer-shell { background: transparent; border: 0; box-shadow: none; }
.blog-shell .app-sidebar-icon i, .blog-shell .app-sidebar-icon svg { color: #ad391b !important; }
.blog-shell .app-sidebar-icon img, .blog-shell .app-sidebar-icon svg { filter: none; }

