/* Scoped to the functions catalog; detail landing pages keep their own styles. */
.functions-overview-container { width:min(1200px,90%); margin-inline:auto; }
.functions-overview-hero { overflow:hidden; background:radial-gradient(ellipse at 76% 40%,#dff0ff,transparent 58%),linear-gradient(110deg,#f2faff,#fff); }
.functions-overview-grid { display:grid; grid-template-columns:55% 45%; align-items:center; gap:18px; padding:32px 0 34px; }
.functions-overview-copy h1 { color:#09134c; font-size:38px; line-height:1.13; letter-spacing:-.04em; margin:17px 0 12px; }
.functions-overview-copy h1 span { color:#0071ff; }
.functions-overview-copy>p { color:#5c72a6; font-size:16px; line-height:1.4; max-width:600px; margin:0; }
.functions-overview-badge { display:inline-block; background:#e1f1ff; border-radius:20px; padding:6px 11px; font-size:11px; color:#006aff; }
.functions-overview-trust { list-style:none; padding:0; display:flex; gap:42px; font-size:13px; color:#536b9f; margin:28px 0 0; }
.functions-overview-trust li:before { content:'✓'; display:inline-grid; place-items:center; width:22px; height:22px; margin-right:10px; background:#0071ff; color:#fff; border-radius:50%; }
.functions-overview-visual { position:relative; height:265px; min-width:0; }
.functions-overview-laptop { position:absolute; width:81%; left:0; top:5px; transform:perspective(1000px) rotateY(-5deg) rotateZ(2deg); }
.functions-overview-screen { border:8px solid #17222b; border-bottom-width:12px; border-radius:12px 12px 4px 4px; background:#fff; box-shadow:0 8px 14px #25436228; }
.functions-overview-appbar { background:#0071ff; color:white; padding:5px 7px; font-size:13px; }
.functions-overview-appbar>span { float:right; font-size:7px; }
.functions-overview-app { display:flex; min-height:182px; }
.functions-overview-app aside { width:80px; flex-shrink:0; padding:8px 6px; background:#f6faff; color:#3b547f; font-size:6px; line-height:3; }
.functions-overview-dashboard { flex:1; min-width:0; padding:12px 8px 7px; color:#0a1b4a; font-size:11px; }
.functions-overview-metrics { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:5px; margin:13px 0 10px; }
.functions-overview-metrics>div { display:flex; gap:5px; align-items:center; padding:6px 3px; background:#f9fcff; border:1px solid #eaf0f7; border-radius:5px; }
.functions-overview-metrics i { font-size:13px; color:#0071ff; }
.functions-overview-metrics>div:first-child i { color:#00b67c; }
.functions-overview-metrics span { font-size:5px; color:#8398b6; }
.functions-overview-metrics b { display:block; font-size:8px; color:#213769; white-space:nowrap; }
.functions-overview-chart { border:1px solid #eaf0f8; border-radius:5px; padding:6px; }
.functions-overview-chart>span { display:block; font-size:5px; color:#6680a9; }
.functions-overview-chart>strong { font-size:9px; }
.functions-overview-bars { height:67px; display:flex; gap:9px; align-items:end; padding:4px 8px 0; background:repeating-linear-gradient(to top,#eaf1f8 0 1px,transparent 1px 17px); }
.functions-overview-bars i { width:10px; height:var(--bar); background:linear-gradient(#2c8aff,#0071ff); }
.functions-overview-bars i:nth-child(2n) { background:#c6dcf7; }
.functions-overview-laptop-base { height:13px; width:123%; margin-left:-12%; border-radius:0 0 45% 45%; background:linear-gradient(#a8b3be,#e3e8ec 40%,#6a7682); box-shadow:0 4px 5px #263b4820; }
.functions-overview-callout { position:absolute; right:0; bottom:0; padding:18px 20px; border:1px solid #dbeaff; background:#ffffffed; color:#0a1b51; border-radius:13px; box-shadow:0 8px 17px #1d6ecc15; font-size:14px; line-height:1.25; }
.functions-overview-callout i { display:block; width:43px; height:43px; background:#eaf5ff; color:#0071ff; border-radius:10px; padding:7px; font-size:27px; margin-bottom:9px; }
.functions-page .modules-section { padding:25px 0 18px; }
.functions-page .modules-container { width:min(1200px,90%); }
.functions-catalog-heading { text-align:center; margin:0 auto 22px; }
.functions-catalog-heading h2 { font-size:25px; color:#09144c; letter-spacing:-.035em; margin-bottom:7px; }
.functions-catalog-heading p { font-size:16px; color:#677dad; margin:0; }
.functions-page .modules-grid { gap:18px 22px; }
.functions-page .module-card { border-radius:10px; padding:17px 24px; box-shadow:0 4px 10px #21539204; }
.functions-page .module-icon { width:52px; height:52px; margin-bottom:10px; border-radius:13px; color:#0071ff; }
.functions-page .module-icon img { width:39px; height:39px; object-fit:contain; }
.functions-page .module-card h3 { font-size:18px; margin:0 0 7px; color:#0a154c; letter-spacing:-.03em; }
.functions-page .module-card p { font-size:15px; line-height:1.35; margin:0 0 9px; color:#687eae; }
.functions-page .module-card>span { font-size:14px; color:#006aff; }
.functions-integrations-banner { display:grid; grid-template-columns:110px minmax(240px,1.4fr) minmax(230px,1fr) 130px; gap:28px; align-items:center; padding:17px 25px; border:1px solid #cce3ff; border-radius:11px; background:radial-gradient(ellipse at 76% 40%,#e3f2ff,transparent 60%),#f7fbff; text-decoration:none; color:#0a164e; transition:border-color .15s,box-shadow .15s; }
.functions-integrations-banner:hover { border-color:#0071ff; box-shadow:0 5px 15px #0071ff12; }
.functions-integrations-icon { display:grid; place-items:center; width:105px; height:105px; background:#ddf1ff; border-radius:17px; color:#0071ff; font-size:73px; }
.functions-integrations-copy h2 { color:#08144b; font-size:24px; letter-spacing:-.035em; margin:0 0 9px; }
.functions-integrations-copy p { color:#647aa7; font-size:15px; line-height:1.35; margin:0 0 10px; }
.functions-integrations-copy>span { font-size:15px; color:#0071ff; font-weight:600; }
.functions-integrations-network { position:relative; height:130px; }
.functions-integrations-network>svg { position:absolute; width:100%; height:100%; }
.functions-integrations-network path { fill:none; stroke:#0071ff; stroke-width:1; stroke-dasharray:4 3; }
.functions-integrations-network>span { position:absolute; display:grid; place-items:center; background:#fff; border:1px solid #e2edfa; border-radius:12px; width:63px; height:57px; box-shadow:0 4px 9px #2462a610; }
.functions-integration-woo { left:5%; top:0; color:#943e9b; font-size:25px; font-weight:800; font-style:italic; letter-spacing:-1.5px; }
.functions-integration-shopify { right:5%; top:0; color:#83b936; font-size:34px; }
.functions-integration-shopify b { position:absolute; font-size:21px; color:white; top:18px; left:25px; }
.functions-integration-payment { left:0; bottom:0; color:#0071ff; font-size:34px; }
.functions-integration-api { right:0; bottom:0; color:#9152ff; font-size:37px; }
.functions-integrations-network>.functions-integration-cloud { left:50%; top:37px; transform:translateX(-50%); width:95px; height:72px; color:#0071ff; line-height:1; padding:6px; }
.functions-integration-cloud i { font-size:33px; }
.functions-integration-cloud b { font-size:22px; letter-spacing:-1px; }
.functions-integrations-note { color:#0071ff; font-size:17px; font-style:italic; text-align:center; transform:rotate(-12deg); border-bottom:2px solid #0071ff; padding-bottom:8px; line-height:1.25; }
.functions-overview-cta { display:flex; align-items:center; gap:23px; margin-top:13px; border-radius:10px; padding:18px 30px; background:linear-gradient(100deg,#006aff,#0084ff 65%,#438fff); color:white; }
.functions-overview-cta>i { font-size:52px; }
.functions-overview-cta h2 { color:white; font-size:19px; margin:0 0 3px; }
.functions-overview-cta p { color:#e9f5ff; font-size:14px; margin:0; }
.functions-overview-cta a { margin-left:auto; background:#fff; color:#006aff; padding:11px 30px; border-radius:5px; font-size:14px; font-weight:600; text-decoration:none; }
.functions-overview-assurances { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; padding:24px 20px; }
.functions-overview-assurances>div { display:flex; gap:14px; align-items:center; }
.functions-overview-assurances i { color:#0071ff; font-size:37px; }
.functions-overview-assurances p { color:#667da8; font-size:12px; margin:0; }
.functions-overview-assurances strong { display:block; color:#0a1d53; font-size:13px; }
@media(max-width:1100px) {
.functions-overview-copy h1 { font-size:32px; }.functions-overview-copy>p { font-size:15px; }.functions-overview-trust { gap:25px; font-size:12px; }.functions-overview-app aside { width:63px; font-size:5px; }.functions-overview-callout { padding:14px; font-size:12px; }.functions-integrations-banner { grid-template-columns:90px 1.2fr 1fr; gap:24px; padding:17px 20px; }.functions-integrations-icon { width:85px; height:95px; font-size:63px; }.functions-integrations-note { display:none; }.functions-overview-assurances { padding-inline:10px; gap:14px; }
}
@media(max-width:760px) {
.functions-overview-grid { grid-template-columns:1fr; gap:24px; }.functions-overview-copy { text-align:center; }.functions-overview-copy>p { margin:auto; }.functions-overview-trust { justify-content:center; }.functions-overview-visual { width:min(460px,100%); margin:auto; }.functions-integrations-banner { grid-template-columns:80px 1fr; gap:17px; }.functions-integrations-network { grid-column:1/-1; width:300px; margin:auto; }.functions-overview-cta { flex-wrap:wrap; padding:20px; gap:15px; }.functions-overview-cta a { margin:auto; text-align:center; }.functions-overview-assurances { grid-template-columns:repeat(2,1fr); gap:20px; }
}
@media(max-width:480px) {
.functions-overview-copy h1 { font-size:28px; }.functions-overview-copy h1 br { display:none; }.functions-overview-copy h1 span:before { content:' '; }.functions-overview-trust { gap:11px; font-size:10px; }.functions-overview-trust li:before { width:17px; height:17px; margin-right:5px; }.functions-overview-visual { height:240px; }.functions-overview-laptop { width:87%; }.functions-overview-app aside { width:52px; font-size:4px; }.functions-overview-dashboard { padding:9px 5px; font-size:9px; }.functions-overview-metrics { gap:3px; }.functions-overview-metrics b { font-size:6px; }.functions-overview-metrics i { font-size:10px; }.functions-overview-bars { gap:5px; }.functions-overview-callout { font-size:10px; bottom:0; padding:12px; }.functions-overview-callout i { width:35px; height:35px; font-size:22px; padding:6px; }.functions-catalog-heading h2 { font-size:23px; }.functions-catalog-heading p { font-size:14px; }.functions-page .module-card { padding:18px; }.functions-integrations-copy h2 { font-size:23px; }.functions-integrations-copy p { font-size:14px; }.functions-integrations-banner { grid-template-columns:60px 1fr; padding:18px 15px; gap:15px; }.functions-integrations-icon { width:60px; height:70px; font-size:49px; }.functions-integrations-network { width:min(280px,100%); }.functions-overview-cta>i { font-size:39px; }.functions-overview-cta>div { flex:1; }.functions-overview-cta h2 { font-size:17px; }.functions-overview-cta p { font-size:13px; }.functions-overview-cta a { width:100%; font-size:13px; padding:11px; }.functions-overview-assurances { padding-inline:0; gap:18px 10px; }.functions-overview-assurances i { font-size:29px; }.functions-overview-assurances>div { gap:8px; }.functions-overview-assurances p { font-size:10px; }.functions-overview-assurances strong { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) { .functions-integrations-banner { transition:none; } }