/* Product integrations and illustrative UI. Brand assets retain their colors. */
.integration-section{background:#fafaf7;border-top:1px solid #e8e8e0;border-bottom:1px solid #e8e8e0}
.integration-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center}
.integration-layout h2,.integration-heading h2{font-size:clamp(32px,3.4vw,46px);line-height:1.12;letter-spacing:-.04em}
.integration-layout p,.integration-heading>p{font-size:17px;line-height:1.75;color:var(--muted)}
.integration-heading{max-width:850px;margin-bottom:36px}
.integration-heading>p{max-width:790px;margin-bottom:0}
.integration-logo{display:block;width:150px;height:48px;object-fit:contain;max-width:100%;flex:none}
.integration-logo.logo-signhost{background:#242333;padding:11px;border-radius:4px}
.integration-logo.logo-entrust{width:160px;height:45px}
.integration-logo.logo-openai{height:76px;width:175px}
.integration-logo.logo-anthropic{height:32px;width:170px}
.integration-logo.logo-azure-ai-foundry,.integration-logo.logo-sharepoint{width:54px;height:54px}
.integration-focus{border:1px solid #deded5;border-radius:10px;padding:30px;background:#fff}
.focus-logo{min-height:56px;margin-bottom:24px;display:flex;align-items:center;gap:14px}
.focus-logo .logo-mollie{width:130px;height:38px}
.focus-logo>span{font-size:22px;letter-spacing:-.03em;font-weight:600}
.integration-steps{list-style:none;counter-reset:integration;margin:0;padding:0}
.integration-steps li{position:relative;padding:16px 0 16px 43px;border-top:1px solid #ecece5;counter-increment:integration}
.integration-steps li:before{content:counter(integration,decimal-leading-zero);position:absolute;left:0;top:18px;font-size:11px;font-weight:700;color:#8d6400;background:#fff4d2;width:28px;height:28px;display:grid;place-items:center;border-radius:50%}
.integration-steps b{display:block;font-size:15px;line-height:1.5;margin-bottom:4px}
.integration-steps li>span{display:block;font-size:13px;line-height:1.6;color:#666}
.sharepoint-focus .integration-steps li:before{color:#006f69;background:#e0f4f0}
.provider-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.provider-grid-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.provider-card{border:1px solid #deded5;border-radius:8px;background:#fff;padding:28px;min-width:0}
.provider-logo{min-height:78px;display:flex;align-items:center;margin-bottom:20px}
.provider-logo .integration-logo{max-width:100%}
.provider-card h3{font-size:23px;line-height:1.2;margin-bottom:13px}
.provider-card p{font-size:15px;line-height:1.7;color:var(--muted);margin-bottom:0}
.signing-provider-logos{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.signing-provider-logos .provider-logo{flex:1;min-width:125px}
.provider-stiply>.provider-logo{min-height:78px}
.provider-stiply .logo-stiply{width:172px;height:54px}
.integration-caption{margin-top:24px;margin-bottom:0}
.frontoffice-product-card{padding-bottom:48px}
.frontoffice-product-card>a{display:flex;gap:28px;align-items:flex-start;text-decoration:none;background:#fff9e9;border:1px solid #eddca8;border-radius:8px;padding:32px}
.frontoffice-product-card .service-icon{flex:none}
.frontoffice-product-card h2{font-size:34px;margin-bottom:13px}
.frontoffice-product-card p{font-size:17px;max-width:760px;color:var(--muted)}
.frontoffice-product-card .eyebrow{font-size:10px;margin-bottom:12px}
.frontoffice-product-card a:hover{border-color:#b68a16}
.frontoffice-product-hero{gap:60px}
.frontoffice-product-hero .product-scene{padding-left:12px}
.frontoffice-product-hero .hero-actions{margin-top:24px}
.frontoffice-product-hero .hero-actions .text-link{font-size:14px}
.visual-symbol{display:block;width:24px;height:24px;flex:none}
.document-location{display:flex;align-items:center;gap:9px;font-size:12px}
.document-location .visual-symbol{width:20px;height:20px;color:#8d6909}
.document-file-row{gap:15px;padding:15px 0;min-width:0}
.document-file-row>.file-thumbnail{margin-left:0}
.document-file-row>div{min-width:0}
.document-file-row b{display:block;font-size:12px;font-weight:500;overflow-wrap:anywhere}
.document-file-row small{display:block;color:#777;font-size:10px;margin-top:5px}
.file-thumbnail{position:relative;display:block;width:40px;height:46px;flex:none;color:#cc3438}
.file-thumbnail>svg{display:block;width:36px;height:44px}
.file-thumbnail>span{position:absolute;top:15px;left:6px;width:24px;text-align:center;font-size:9px;font-weight:700;line-height:14px;color:#fff;letter-spacing:.02em}
.app-file-thumbnail{height:46px}
.app-file-thumbnail>.integration-logo{width:36px;height:36px;object-fit:contain}
.app-file-thumbnail>span{left:0;top:auto;bottom:-2px;width:36px;font-size:8px;color:#1b5a98;line-height:10px}
.app-file-thumbnail.file-excel>span{color:#176b43}
.preview-integration{display:flex;align-items:center;gap:11px;margin-top:23px;padding:13px;background:#eaf5f2;border:1px solid #d5e8e2;border-radius:6px}
.preview-integration .logo-sharepoint{width:33px;height:33px}
.preview-integration b,.preview-integration small{display:block;font-size:11px;line-height:1.5}
.preview-integration small{font-size:10px;color:#556d66;margin-top:3px}
.mollie-checkout{border:1px solid #ddd;border-radius:8px;background:#fff;padding:22px}
.checkout-brand{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid #eee;padding-bottom:16px;margin-bottom:20px}
.checkout-brand .logo-mollie{width:82px;height:25px}
.checkout-brand>span{font-size:10px;color:#777}
.checkout-reference{display:block;font-size:11px;color:#666;line-height:1.5}
.checkout-amount{display:block;font-size:36px;line-height:1.2;letter-spacing:-.04em;margin:12px 0 5px}
.checkout-caption{display:block;font-size:9px;color:#888}
.checkout-action{display:block;text-align:center;background:#202020;color:#fff;border-radius:5px;font-size:12px;font-weight:600;padding:13px;margin-top:20px}
.payment-methods-section.section{padding-top:64px;padding-bottom:64px}
.payment-methods-heading{max-width:800px;margin-bottom:30px}
.payment-methods-heading h2{font-size:clamp(32px,3.4vw,46px);line-height:1.12;letter-spacing:-.04em}
.payment-methods-heading>p{font-size:17px;line-height:1.7;color:var(--muted);max-width:680px}
.payment-methods-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.payment-method-card{padding:24px;border:1px solid #e2e2da;background:#fff;border-radius:8px;min-width:0}
.payment-method-mark{display:flex;align-items:center;height:54px;margin-bottom:16px}
.payment-method-logo{display:block;object-fit:contain;max-width:100%;width:78px;height:48px;flex:none}
.payment-method-card h3{font-size:20px;line-height:1.25;letter-spacing:-.025em;margin-bottom:11px}
.payment-method-card p{font-size:13px;line-height:1.7;color:var(--muted);margin-bottom:0}
.payment-methods-note{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;margin-top:25px}
.payment-methods-note p{font-size:12px;line-height:1.7;color:#707068;max-width:700px;margin:0}
.payment-methods-note .text-link{font-size:12px;flex:none;margin-top:2px}
.checkout-payment-methods{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:15px;padding-top:12px;border-top:1px solid #eee}
.checkout-payment-methods .payment-method-logo{width:48px;height:30px}
.preview-provider-list{margin-top:25px;padding-top:17px;border-top:1px solid #deded5}
.preview-provider-list>span{display:block;font-size:9px;color:#707067;text-transform:uppercase;letter-spacing:.06em;margin-bottom:13px}
.integration-logo-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:10px}
.integration-brand{display:flex;align-items:center;justify-content:center;min-width:0;background:#fff;border:1px solid #e7e7e0;border-radius:5px;padding:8px;height:51px}
.integration-brand .integration-logo{width:100%;height:30px;max-width:108px}
.integration-brand .logo-signhost{height:34px;padding:5px}
.integration-brand .logo-azure-ai-foundry,.integration-brand .logo-openai-mark{width:30px;height:30px}
.integration-brand .logo-anthropic{width:94px;height:28px}
.channel-badge{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-size:11px;font-weight:600;padding:8px 10px;border-radius:6px;border:1px solid #dfe4df;background:white;color:#343d36}
.channel-badge .integration-logo,.channel-badge .visual-symbol{width:24px;height:24px}
.channel-whatsapp{color:#166d3f;background:#f3fcf5;border-color:#d2e9d7}
.channel-sms{color:#195eab;background:#f1f6fd;border-color:#d6e4f5}
.channel-email{color:#8a3918;background:#fff6ee;border-color:#f0dfcf}
.notification-preview-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:23px}
.notification-preview-heading h3{font-size:30px;line-height:1.15;letter-spacing:-.035em;margin:0}
.notification-preview-heading>.channel-badge{padding:9px;background:#e2f6e8;border:0;border-radius:50%}
.notification-preview-heading>.channel-badge .integration-logo{width:37px;height:37px}
.notification-channel-row{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:21px}
.notification-channel-row>.channel-badge{font-size:9px;padding:7px;gap:5px}
.notification-channel-row .integration-logo,.notification-channel-row .visual-symbol{width:18px;height:18px}
.whatsapp-conversation{background:#e8f1e7;padding:16px;border-radius:8px}
.conversation-title{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:12px}
.conversation-title .channel-badge{padding:0;background:none;border:0}
.conversation-title>span:last-child{font-size:9px;color:#52715b}
.whatsapp-conversation .message-bubble{background:#dcf8c6;border:1px solid #c8e6b6;font-size:13px;padding:16px}
.whatsapp-conversation .message-bubble small{display:block;text-align:right;font-size:9px;color:#4f6a46;margin-top:8px}
.notification-status{display:flex;align-items:center;gap:7px;font-size:10px;color:#406549;margin-top:17px;line-height:1.5}
.notification-status .visual-symbol{width:16px;height:16px}
.channel-details article>.channel-badge{margin-bottom:22px}
.channel-details article>.channel-badge .integration-logo,.channel-details article>.channel-badge .visual-symbol{width:31px;height:31px}
.channel-details article>.channel-badge{font-size:13px;padding:12px}
.notification-note>.channel-badge,.notification-note>div{margin-bottom:17px}
.notification-note>div{display:flex;gap:10px;flex-wrap:wrap}
.preview-agentic{background:#faf9ff;box-shadow:16px 16px 0 #ded8f8;border-color:#e0dcf0}
.agent-avatar{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:9px;background:#eee8ff;color:#6a44bb}
.agent-avatar .visual-symbol{width:23px;height:23px}
.agent-status{display:flex;gap:7px;align-items:center;color:#6a528e;font-size:10px;margin-bottom:16px}
.agent-status .small-dot{background:#7f61c8}
.agent-source-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:21px}
.source-tile{display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;border-radius:7px;padding:13px 5px;min-width:0}
.source-tile>span{font-size:9px;text-align:center;line-height:1.3}
.source-tile>.visual-symbol{width:25px;height:25px}
.source-email{background:#edf2ff;color:#315cb3}
.source-folder{background:#fff0c8;color:#8e6200}
.source-document{background:#e3f4ee;color:#21755f}
.preview-agentic .mail-meta{padding:14px;background:#fff;border:1px solid #e8e4f1;border-radius:6px;line-height:1.7}
.preview-agentic .agentic-context{border-color:#b895e1;background:#f0eafa;margin-top:16px;padding:13px 15px}
.agentic-context>span{display:flex;align-items:center;gap:7px;color:#674a8e}
.agentic-context>span>.visual-symbol{width:18px;height:18px}
.agentic-answer{background:#fff;border-color:#dbd0ed}
.agentic-draft-label{display:flex;gap:7px;align-items:center;color:#6b41a7;font-size:10px}
.agentic-draft-label .visual-symbol{width:18px;height:18px}
.preview-agentic .preview-content>p{font-size:10px;margin-top:16px}
.preview-agentic .preview-provider-list{margin-top:19px}
.ai-integrations{background:#f6f4fb}
.provider-azure-ai-foundry{border-top:4px solid #479ada}
.provider-openai{border-top:4px solid #4a9b80}
.provider-anthropic{border-top:4px solid #c17c61}
.agentic-feature-icon{display:grid;place-items:center;width:45px;height:45px;border-radius:10px;background:#eee8ff;color:#6c47ac;margin-bottom:18px}
.agentic-feature-icon.folder{background:#fff0cb;color:#906200}
.agentic-feature-icon.document{background:#e3f4ee;color:#24735d}
@media(max-width:1100px){
 .integration-layout{gap:40px}.provider-card{padding:22px}.frontoffice-product-hero{gap:40px}
}
@media(max-width:800px){
 .payment-methods-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .payment-methods-note{flex-direction:column;gap:13px}
 .integration-layout{grid-template-columns:1fr;gap:30px}.integration-focus{max-width:600px;width:100%}
 .provider-grid{grid-template-columns:1fr}.provider-grid-two{grid-template-columns:1fr}
 .provider-logo{min-height:60px;margin-bottom:18px}.provider-card{padding:25px}
 .frontoffice-product-card{padding-bottom:35px}.frontoffice-product-card>a{padding:26px}
 .preview-agentic{box-shadow:10px 10px 0 #ded8f8}
}
@media(max-width:560px){
 .payment-methods-section.section{padding-top:48px;padding-bottom:48px}
 .payment-methods-grid{gap:12px}.payment-method-card{padding:18px 15px}
 .payment-method-card h3{font-size:17px}.payment-method-card p{font-size:12px}
 .payment-method-mark{height:48px;margin-bottom:14px}.payment-method-logo{width:68px;height:42px}
 .payment-methods-heading>p{font-size:16px}.checkout-payment-methods{gap:6px}
 .checkout-payment-methods .payment-method-logo{width:43px;height:27px}
 .integration-section.section{padding-top:48px;padding-bottom:48px}
 .integration-layout h2,.integration-heading h2{font-size:32px}
 .integration-layout p,.integration-heading>p{font-size:16px}
 .integration-focus{padding:22px}.provider-grid{gap:16px}.provider-card h3{font-size:22px}
 .frontoffice-product-card>a{gap:16px;padding:21px}.frontoffice-product-card h2{font-size:27px}
 .frontoffice-product-card p{font-size:15px}.frontoffice-product-card .service-icon{width:38px;height:38px}
 .frontoffice-product-card .service-icon>.product-icon{width:23px;height:23px}
 .frontoffice-product-card .eyebrow{font-size:8px}.frontoffice-product-card .text-link{font-size:12px}
 .frontoffice-product-hero .product-scene{padding-left:0;padding-right:8px}
 .document-file-row{gap:12px}.document-file-row b{font-size:11px}.document-file-row small{font-size:9px}
 .notification-preview-heading h3{font-size:26px}.notification-preview-heading>.channel-badge .integration-logo{width:29px;height:29px}
 .notification-channel-row{gap:5px}.notification-channel-row>.channel-badge{font-size:9px;padding:6px;gap:4px}
 .preview-agentic{box-shadow:8px 8px 0 #ded8f8}.source-tile>span{font-size:8px}
 .preview-integration{padding:10px;gap:8px}.preview-integration b{font-size:10px}
 .preview-integration small{font-size:9px}.checkout-brand{gap:8px}
 .integration-brand{padding:5px}.integration-logo-row{gap:7px}
 .signing-provider-logos{gap:12px}.provider-card{padding:22px}
}
