/* Saint service site: editorial landscape, useful product illustrations, and calm motion. */
.saint-services { --s-ink:#17241f; --s-muted:#596760; --s-line:#dce5dd; --s-cream:#f7f8f2; --s-green:#2e513e; margin:0; background:#fff; color:var(--s-ink); font:400 16px/1.55 'Inter',sans-serif; overflow-x:hidden; }
.saint-services * { box-sizing:border-box; }
.saint-services [hidden] { display:none !important; }
.saint-services button,.saint-services a { -webkit-tap-highlight-color:transparent; }
.saint-services button { font:inherit; cursor:pointer; }
.saint-services a { color:inherit; text-decoration:none; }
.saint-services h1,.saint-services h2,.saint-services h3,.saint-services p { margin:0; }
.saint-services h1,.saint-services h2,.saint-services h3 { font-weight:500; letter-spacing:-.055em; line-height:1.03; }
.saint-services em { font:400 1em 'Inter',Georgia,serif; letter-spacing:-.03em; }
.saint-services :focus-visible { outline:3px solid #1e684e; outline-offset:4px; }
.saint-services section[id] { scroll-margin-top:100px; }
.service-skip { position:fixed; z-index:1000; left:12px; top:12px; background:#fff; padding:10px 18px; transform:translateY(-160%); border-radius:9px; }
.service-skip:focus { transform:none; }
.service-header { position:absolute; z-index:30; width:100%; top:0; left:0; padding:30px 34px; }
.service-nav { max-width:1480px; margin:auto; display:flex; align-items:center; gap:30px; }
.service-brand { display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:23px; letter-spacing:-.075em; line-height:1; white-space:nowrap; }
.service-brand img { object-fit:contain; }
.brand-period { color:#81a47d; }
.service-nav-links { display:flex; align-items:center; gap:35px; margin:auto; }
.service-nav-links a { font-size:13px; font-weight:600; transition:opacity .2s; }
.service-nav-links a:hover { opacity:.6; }
.service-nav-cta { background:#fff; border:1px solid #d9e4df; border-radius:11px; padding:13px 18px; display:flex; align-items:center; gap:23px; font-size:13px !important; font-weight:700 !important; box-shadow:0 8px 26px #223c2b15; transition:transform .2s,box-shadow .2s; }
.service-nav-cta:hover { transform:translateY(-2px); box-shadow:0 12px 30px #223c2b26; }
.service-menu-toggle { display:none; }
.service-hero { position:relative; isolation:isolate; overflow:hidden; min-height:880px; border:13px solid #fff; border-radius:38px; background:#cce9f4; text-align:center; padding-bottom:70px; }
.service-hero-landscape { position:absolute; inset:0; z-index:-2; background:url('/assets/home/service-landscape.jpg') center bottom/cover no-repeat; }
.service-hero::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,#e6f7f899 0%,#dff2f85c 42%,#ffffff00 67%); }
.service-hero-content { max-width:930px; margin:0 auto; padding:175px 24px 0; position:relative; z-index:2; }
.service-pill { display:inline-flex; align-items:center; gap:9px; border-radius:50px; padding:8px 13px; background:#ffffffa8; border:1px solid #ffffffbf; box-shadow:0 3px 18px #304e3b11; color:#2c4938; font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.pulse-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:#75ab72; box-shadow:0 0 0 4px #82b8872e; flex:none; }
.service-hero h1 { margin:21px 0 18px; font-size:clamp(64px,7.2vw,118px); color:#101e1d; }
.service-hero h1 em { color:#315d48; }
.service-hero-lede { max-width:540px; margin:auto !important; font-size:15px; line-height:1.75; color:#3f5752; }
.service-hero-actions { display:flex; justify-content:center; align-items:center; gap:26px; margin-top:25px; }
.service-button { display:inline-flex; align-items:center; justify-content:center; gap:25px; min-height:50px; border-radius:10px; border:1px solid transparent; padding:13px 21px; font-size:13px !important; font-weight:700 !important; transition:transform .2s,background .2s; }
.service-button:hover { transform:translateY(-3px); }
.service-button-dark { background:#17251f; color:#fff; }
.service-button-dark:hover { background:#33533e; }
.service-button-light { background:#f3f7ef; color:#193027; }
.service-text-link { font-size:13px; font-weight:700; display:inline-flex; align-items:center; gap:14px; border-bottom:1px solid currentColor; padding-bottom:4px; }
.service-text-link:hover { opacity:.62; }
.service-hero-preview { position:relative; width:min(620px,calc(100% - 60px)); height:315px; margin:54px auto 0; text-align:left; background:#f8faf7e8; border:1px solid #ffffffeb; border-radius:20px; box-shadow:0 22px 60px #173a2638,0 0 0 8px #ffffff2e; backdrop-filter:blur(16px); overflow:hidden; transform:perspective(900px) rotateX(5deg); }
.preview-top { height:48px; display:flex; align-items:center; gap:8px; padding:0 18px; border-bottom:1px solid #e6ebe5; font-size:10px; font-weight:700; color:#465c50; }
.preview-avatar { width:25px; height:25px; display:grid; place-items:center; border-radius:8px; background:#fbe392; }
.preview-avatar img { width:18px; height:18px; object-fit:contain; }
.preview-live { margin-left:auto; color:#4d7957; font-weight:600; }
.preview-live i { width:6px; height:6px; background:#66a96d; display:inline-block; border-radius:50%; margin-right:4px; }
.preview-body { display:grid; grid-template-columns:150px 1fr; min-height:267px; }
.preview-side { padding:22px 14px; border-right:1px solid #e7ece7; display:flex; flex-direction:column; gap:15px; color:#61736a; font-size:9px; font-weight:600; }
.preview-side p { font-size:9px; color:#99a9a0; letter-spacing:.1em; text-transform:uppercase; }
.preview-side-active { background:#e8f0e6; border-radius:6px; padding:7px; margin:-7px; color:#315c43; }
.preview-main { padding:21px 24px; }
.preview-eyebrow { color:#7c9c84; font-size:9px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.preview-main > strong { display:block; font-size:22px; line-height:1.05; letter-spacing:-.05em; margin:8px 0 15px; }
.preview-metrics { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.preview-metrics div { padding:11px; border:1px solid #e7ede6; background:#fff; border-radius:10px; }
.preview-metrics small { display:block; font-size:7px; color:#8aa090; letter-spacing:.07em; font-weight:700; }
.preview-metrics b { display:block; font-size:12px; margin-top:5px; }
.preview-metrics span { font-size:8px; color:#839188; }
.preview-progress { margin-top:12px; display:flex; justify-content:space-between; align-items:center; gap:8px; color:#74867a; font-size:8px; }
.preview-progress div { display:flex; gap:4px; margin:auto; }
.preview-progress i { height:5px; width:24px; border-radius:8px; background:#82b48a; }
.preview-progress i:last-child { background:#dbe8d9; }
.preview-status { color:#438453; }
.service-hero-bottom { position:absolute; bottom:26px; left:34px; right:34px; display:flex; justify-content:space-between; color:#f4f9f1; text-shadow:0 1px 7px #183120bb; font-size:11px; font-weight:700; }
.service-hero-bottom a { display:flex; gap:10px; }
.section-shell { max-width:1370px; margin:0 auto; padding:125px 40px; }
.section-topline { display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--s-line); padding-top:17px; color:#697c70; font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.section-topline span:last-child { letter-spacing:0; text-transform:none; font-weight:500; }
.service-intro-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; margin:62px 0 56px; }
.service-intro-heading h2,.pricing-heading h2,.agent-world h2,.approach-grid h2,.faq-layout h2 { font-size:clamp(54px,6.3vw,94px); }
.service-intro-heading > p,.pricing-heading > p { max-width:370px; color:var(--s-muted); line-height:1.8; }
.service-tabs { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; border-bottom:1px solid var(--s-line); }
.service-tabs button { border:0; background:none; text-align:left; padding:17px 17px 21px; font-size:13px; font-weight:700; color:#728177; border-bottom:2px solid transparent; transition:color .2s,background .2s; }
.service-tabs button span { display:block; font-size:10px; font-weight:600; margin-bottom:8px; }
.service-tabs button[aria-selected="true"] { color:#163927; background:#f0f5ee; border-color:#3a7651; border-radius:9px 9px 0 0; }
.service-panel { display:grid; grid-template-columns:1fr 1fr; gap:30px; margin-top:25px; min-height:485px; animation:panel-in .45s ease both; }
@keyframes panel-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
.service-panel-copy { background:#f5f7f2; border-radius:22px; padding:50px; display:flex; flex-direction:column; align-items:flex-start; }
.service-panel-label { font-size:10px; color:#698370; font-weight:700; letter-spacing:.12em; }
.service-panel-copy h3 { font-size:clamp(42px,4.1vw,64px); margin:22px 0; }
.service-panel-copy > p { max-width:475px; font-size:14px; color:#596a5f; line-height:1.8; }
.service-panel-copy ul { margin:25px 0 25px; padding:0; list-style:none; display:grid; gap:8px; color:#425c48; font-size:12px; }
.service-panel-copy li::before { content:'↗'; margin-right:10px; color:#4f8d63; }
.service-inline-cta { margin-top:auto; border:0; border-bottom:1px solid currentColor; background:none; color:#244b35; padding:0 0 5px; display:inline-flex; justify-content:space-between; gap:24px; font-weight:700 !important; font-size:13px !important; }
.service-inline-cta:hover { color:#6a936f; }
.service-visual { min-height:485px; border-radius:22px; overflow:hidden; position:relative; display:flex; align-items:center; justify-content:center; padding:30px; }
.visual-automation { background:radial-gradient(circle at 30% 30%,#dbeef7 0,#d9e5d9 34%,#b8d2ae 70%,#87aa83 100%); gap:10px; }
.flow-card { background:#fffef9e8; border:1px solid #fff; box-shadow:0 15px 35px #183f2924; border-radius:14px; width:145px; padding:16px 13px; min-height:145px; display:flex; flex-direction:column; align-items:flex-start; }
.flow-middle { transform:translateY(-35px); }
.flow-last { transform:translateY(20px); }
.flow-card strong { font-size:12px; margin:8px 0 3px; }
.flow-card small { font-size:9px; color:#728477; }
.flow-icon { background:#e8f2e9; display:grid; place-items:center; width:30px; height:30px; border-radius:8px; color:#4e885b; }
.flow-line { height:1px; flex:1; min-width:10px; background:#fff; transform:translateY(-10px); }
.visual-leads { background:linear-gradient(140deg,#d5e8f4,#b9d2bc 85%); }
.lead-window { background:#fafbf9; width:min(400px,100%); border-radius:16px; padding:18px 20px 21px; box-shadow:0 25px 55px #2b553236; transform:rotate(-2deg); }
.window-dots { display:flex; gap:4px; margin-bottom:23px; }.window-dots i { width:5px;height:5px;background:#b9c9ba;border-radius:50%; }
.lead-label { font-size:8px; letter-spacing:.14em; color:#7b9a82; font-weight:700; }
.lead-window > strong { display:block; font-size:25px; line-height:1.08; letter-spacing:-.05em; margin:5px 0 19px; }
.lead-row { display:flex; align-items:center; gap:11px; border-top:1px solid #e7ece5; padding:10px 0; }
.lead-initial { display:grid; place-items:center; flex:none; width:32px; height:32px; border-radius:50%; background:#f4d8c8; font-size:9px; font-weight:700; }.lead-initial-blue{background:#d2e8ee}.lead-initial-gold{background:#efe2b8}
.lead-row span:nth-child(2) { display:grid; line-height:1.3; }.lead-row b {font-size:10px}.lead-row small{font-size:8px;color:#7f9084}.lead-row em{margin-left:auto;font:600 8px 'Inter';color:#4a8863;background:#ecf6ee;padding:4px 6px;border-radius:20px}
.visual-voice { background:radial-gradient(circle at 50% 30%,#f8e7ce,#e2d8c0 52%,#97b6a8); }
.phone-shell { width:230px; height:392px; background:#142525; border:7px solid #1c2725; border-radius:36px; box-shadow:0 22px 45px #273b2d57; padding:7px; transform:rotate(7deg); }
.phone-speaker { position:absolute; left:50%; transform:translateX(-50%); top:12px; width:60px; height:12px; border-radius:20px; background:#142525; z-index:2; }
.phone-content { width:100%;height:100%;border-radius:25px;background:linear-gradient(160deg,#d9f0e5,#fdf8ea);display:flex;flex-direction:column;align-items:center;text-align:center;padding:39px 15px 20px; }
.phone-kicker {font-size:9px;color:#527b69;letter-spacing:.17em;font-weight:700}.phone-orb{display:grid;place-items:center;width:90px;height:90px;margin:30px 0 20px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff,#b8d7ca 70%);box-shadow:0 14px 25px #386d5929;color:#59866d;font-size:35px}.phone-content strong{font-size:15px;line-height:1.3}.voice-wave{display:flex;align-items:center;gap:4px;height:34px;margin-top:15px}.voice-wave i{height:11px;width:3px;border-radius:4px;background:#5d9a7b;animation:wave 1.3s ease-in-out infinite alternate}.voice-wave i:nth-child(2n){height:22px;animation-delay:.2s}.voice-wave i:nth-child(3n){height:29px;animation-delay:.45s}.phone-call{margin-top:auto;background:#19372c;color:#fff;padding:8px 16px;border-radius:18px;font-size:9px}@keyframes wave{to{height:5px}}
.visual-agents { background:radial-gradient(circle at 50% 30%,#f9d6c8,#d4d1ec 55%,#b4d4cc); gap:12px; }
.agent-mini { width:110px;height:110px;border-radius:32px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-size:36px;font-weight:700;box-shadow:0 18px 35px #533c622a;transform:rotate(-8deg); }.agent-mini small{font-size:10px;letter-spacing:0;font-weight:700}.agent-mini-one{background:#e78079}.agent-mini-two{background:#ba9cdb;transform:translateY(-45px) rotate(8deg)}.agent-mini-three{background:#77aca6;transform:translateY(20px) rotate(8deg)}.agent-mini-note{position:absolute;bottom:30px;background:#ffffffc9;border:1px solid white;border-radius:30px;padding:9px 18px;font-size:10px;color:#52655a}
.service-tab-controls { display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-top:20px;font-size:11px;font-weight:700;color:#63786b; }.service-tab-controls button{width:36px;height:36px;border-radius:50%;border:1px solid #d5e2d7;background:#fff;color:#244b35;font-size:16px}.service-tab-controls button:hover{background:#e9f2e8}
.approach-grid {display:grid;grid-template-columns:1fr 1fr;gap:100px;padding-top:70px}.approach-grid > div > p{max-width:480px;margin:26px 0 28px;color:var(--s-muted);line-height:1.8}.approach-steps{list-style:none;padding:0;margin:0}.approach-steps li{display:grid;grid-template-columns:64px 1fr;border-top:1px solid var(--s-line);padding:23px 0 31px}.approach-steps li:last-child{border-bottom:1px solid var(--s-line)}.approach-steps li>span{font-size:12px;color:#6a9872}.approach-steps h3{font-size:27px}.approach-steps p{max-width:380px;margin-top:10px;color:var(--s-muted);font-size:13px;line-height:1.7}
.agent-world {background:#f8f7f1;border-radius:28px;max-width:1338px;margin:0 auto 30px;padding:64px 50px 35px}.agent-world .section-topline{border-color:#d8ddd4}.agent-world-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-top:60px}.agent-world h2{margin-top:18px}.agent-world-heading>p{max-width:315px;color:var(--s-muted);font-size:13px;line-height:1.8}.service-pill-light{background:#f0f5eb}.agent-world-art{margin-top:40px;position:relative;background:#fff;border-radius:20px;overflow:hidden;min-height:300px}.agent-world-art img{display:block;width:100%;height:auto}.agent-world-sticker{position:absolute;top:25px;left:25px;padding:13px 18px;background:#ffffffd9;border-radius:12px;backdrop-filter:blur(10px);box-shadow:0 8px 25px #27382612;font-size:11px;line-height:1.3}.agent-world-sticker strong{font-size:14px}.sticker-two{left:auto;right:25px;top:auto;bottom:25px}.agent-world-footer{display:flex;justify-content:space-between;align-items:center;padding-top:25px;font-size:13px;font-weight:600}
.pricing-heading{display:flex;justify-content:space-between;gap:50px;align-items:end;margin:60px 0 50px}.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.pricing-grid article{border:1px solid #dce5de;border-radius:18px;padding:27px 24px;background:#fcfdfa;display:flex;flex-direction:column;min-height:305px;transition:transform .2s,box-shadow .2s}.pricing-grid article:hover{transform:translateY(-5px);box-shadow:0 18px 32px #33574312}.pricing-number{font-size:11px;color:#6e9c76;margin-bottom:37px}.pricing-grid h3{font-size:27px}.pricing-grid p{color:#687a6d;font-size:12px;line-height:1.7;margin:13px 0 22px}.pricing-grid strong{margin-top:auto;font-size:12px}.pricing-grid button{border:0;background:none;color:#345a42;text-align:left;padding:15px 0 0;font-size:11px;font-weight:700}.pricing-grid button:hover{text-decoration:underline}.pricing-more{margin-top:26px;float:right}
.faq-layout{display:grid;grid-template-columns:1fr 1fr;gap:100px;padding-top:60px}.faq-layout details{border-bottom:1px solid var(--s-line);padding:18px 0}.faq-layout details:first-child{border-top:1px solid var(--s-line)}.faq-layout summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;font-weight:700;font-size:13px}.faq-layout summary::-webkit-details-marker{display:none}.faq-layout summary span{font-size:19px;font-weight:400}.faq-layout details[open] summary span{transform:rotate(45deg)}.faq-layout details p{font-size:12px;color:var(--s-muted);line-height:1.8;max-width:440px;margin-top:16px}
.service-closing{max-width:1300px;margin:30px auto 0;border-radius:24px;background:#17382e;color:#f5f8ee;padding:85px 80px;min-height:430px;display:flex;align-items:center;justify-content:space-between;overflow:hidden;position:relative}.service-closing h2{font-size:clamp(50px,5.5vw,83px);margin:20px 0}.service-closing p:not(.service-pill){color:#c5d8cb;font-size:14px;margin-bottom:20px}.closing-orb{width:250px;height:250px;flex:none;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3bc,#efce63 50%,#7e954c 100%);display:grid;place-items:center;box-shadow:0 0 80px #e5d7965c,0 20px 50px #071e1869;transform:rotate(12deg)}.closing-orb img{width:130px;height:130px;object-fit:contain}
.service-footer{max-width:1350px;margin:auto;padding:80px 40px 30px}.footer-top{display:grid;grid-template-columns:1.2fr 1.8fr 1fr 1fr;gap:30px;align-items:start}.footer-top>p{color:#718077;font-size:14px}.footer-top>div{display:grid;gap:10px}.footer-top>div a,.footer-top>div button{font-size:12px;color:#506659;text-align:left;background:none;border:0;padding:0}.footer-top>div a:hover,.footer-top>div button:hover{text-decoration:underline}.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid var(--s-line);margin-top:75px;padding-top:20px;color:#7a8a7e;font-size:11px}.footer-bottom a:hover{text-decoration:underline}
.reveal-on-scroll{opacity:0;transform:translateY(28px);transition:opacity .7s,transform .7s}.reveal-on-scroll.is-visible{opacity:1;transform:none}
/* Shared booking dialog retains the existing calendar behavior. */
.saint-services .modal{font-family:'Inter',sans-serif}.saint-services .modal-card{background:#fff;border-radius:20px}.saint-services .modal-card h2{font-family:'Inter',Georgia,serif;font-weight:400}
@media(max-width:1100px){.service-nav-links{gap:18px}.service-panel-copy{padding:35px}.service-visual{padding:18px}.flow-card{width:120px}.approach-grid,.faq-layout{gap:50px}.pricing-grid{grid-template-columns:repeat(2,1fr)}.pricing-grid article{min-height:250px}.closing-orb{width:180px;height:180px}.service-closing{padding:70px 50px}}
@media(max-width:760px){.service-header{padding:24px}.service-nav{position:relative;gap:14px}.service-menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:38px;height:38px;padding:8px;margin-left:auto;border:1px solid #c9d9d3;background:#ffffffce;border-radius:8px}.service-menu-toggle span{display:block;height:2px;background:#183329;width:100%}.service-nav-links{display:none;position:absolute;top:49px;left:0;right:0;background:#fff;border:1px solid #dfe8e0;border-radius:14px;padding:20px;box-shadow:0 20px 40px #18332925;flex-direction:column;align-items:flex-start;gap:17px}.service-nav-links.is-open{display:flex}.service-nav-cta{padding:10px 12px;gap:5px;font-size:11px!important}.service-hero{min-height:780px;border-width:8px;border-radius:25px}.service-hero-content{padding-top:145px}.service-hero h1{font-size:clamp(57px,11vw,85px)}.service-hero-lede{font-size:13px}.service-hero-preview{margin-top:45px;width:min(540px,calc(100% - 35px));height:275px}.preview-body{grid-template-columns:110px 1fr}.preview-side{padding:16px 8px;font-size:8px}.preview-main{padding:14px}.preview-main>strong{font-size:19px}.service-hero-bottom{left:20px;right:20px}.section-shell{padding:85px 24px}.service-intro-heading,.pricing-heading,.agent-world-heading{display:block;margin:45px 0 35px}.service-intro-heading>p,.pricing-heading>p,.agent-world-heading>p{margin-top:20px;max-width:520px}.service-tabs{overflow-x:auto;grid-template-columns:repeat(4,minmax(155px,1fr))}.service-tabs button{white-space:nowrap}.service-panel{grid-template-columns:1fr}.service-visual{min-height:360px}.service-panel-copy{min-height:390px}.approach-grid,.faq-layout{grid-template-columns:1fr;gap:45px;padding-top:45px}.agent-world{margin:0 14px 20px;padding:60px 24px 25px}.agent-world-art{min-height:0}.agent-world-art img{min-height:270px;object-fit:cover}.service-closing{margin:15px 14px 0;padding:55px 30px;min-height:450px}.closing-orb{position:absolute;width:135px;height:135px;right:-25px;bottom:-25px;opacity:.75}.closing-orb img{width:75px;height:75px}.footer-top{grid-template-columns:1fr 1fr}.footer-bottom{gap:15px;flex-wrap:wrap}}
@media(max-width:510px){.service-header{padding:19px}.service-brand{font-size:20px}.service-brand img{width:25px;height:25px}.service-hero{min-height:790px}.service-hero-landscape{background-position:55% bottom}.service-hero-content{padding:128px 17px 0}.service-pill{font-size:8px}.service-hero h1{font-size:clamp(49px,11vw,64px);line-height:1}.service-hero-actions{gap:17px;flex-direction:column}.service-hero-preview{height:250px;margin-top:32px}.preview-top{height:38px;padding:0 9px}.preview-live{font-size:7px}.preview-body{grid-template-columns:80px 1fr}.preview-side{padding:12px 5px;font-size:7px;gap:13px}.preview-main{padding:12px}.preview-main>strong{font-size:17px;margin:5px 0 9px}.preview-metrics{gap:5px}.preview-metrics div{padding:7px}.preview-metrics small{font-size:6px}.preview-metrics b{font-size:9px}.preview-metrics span{font-size:7px}.preview-progress{font-size:7px}.preview-progress>span:first-child{display:none}.preview-progress i{width:16px}.service-hero-bottom span:first-child{display:none}.service-hero-bottom{justify-content:center}.service-intro-heading h2,.pricing-heading h2,.agent-world h2,.approach-grid h2,.faq-layout h2{font-size:clamp(48px,11vw,66px)}.service-panel-copy{padding:27px;min-height:430px}.service-panel-copy h3{font-size:44px}.service-visual{min-height:320px}.flow-card{width:90px;min-height:115px;padding:10px 7px}.flow-card strong{font-size:9px}.flow-card small{font-size:7px}.flow-line{min-width:2px}.agent-mini{width:75px;height:75px;border-radius:20px;font-size:26px}.agent-mini small{font-size:8px}.agent-world-sticker{font-size:8px;padding:8px;top:10px;left:10px}.agent-world-sticker strong{font-size:10px}.sticker-two{left:auto;right:10px;bottom:10px;top:auto}.agent-world-footer{display:block}.agent-world-footer button{margin-top:10px}.pricing-grid{grid-template-columns:1fr}.pricing-grid article{min-height:220px}.pricing-number{margin-bottom:20px}.service-closing h2{font-size:clamp(47px,11vw,65px)}.footer-top{grid-template-columns:1fr 1fr;gap:30px}.footer-top>p{grid-column:1/-1}.footer-bottom span:nth-child(2){display:none}}
@media(prefers-reduced-motion:reduce){.reveal-on-scroll{opacity:1;transform:none;transition:none}.voice-wave i{animation:none}.service-panel{animation:none}*{scroll-behavior:auto!important}}
.service-plans-page .service-header{position:relative;background:#e9f3ed}.plans-service-hero{min-height:580px;padding:130px 25px 90px;text-align:center;background:linear-gradient(#e9f3ede0,#e9f3ed73),url('/assets/home/service-landscape.jpg') center 70%/cover}.plans-service-hero h1{font-size:clamp(58px,7vw,105px);margin:25px 0}.plans-service-hero h1 em{color:#315d48}.plans-service-hero>p:not(.service-pill){max-width:600px;margin:0 auto 28px;color:#3e5c4d;line-height:1.8}.service-plans-page .pricing-grid article{min-height:290px}.service-plans-page .service-pricing{padding-bottom:50px}.plans-service-process{padding-top:30px}.plans-service-process .approach-grid>div>p{max-width:460px}
@media(max-width:760px){.plans-service-hero{padding-top:100px;min-height:520px}.plans-service-hero h1{font-size:clamp(52px,10vw,75px)}}

/* October refinement: rounded editorial type, real character artwork, and image-led navigation. */
.saint-services h1,.saint-services h2,.saint-services h3,.saint-services .service-brand { font-family:'Inter',sans-serif; font-weight:500; letter-spacing:-.055em; }
.saint-services em { font-family:'Inter',sans-serif; font-style:normal; font-weight:400; letter-spacing:-.06em; color:#427556; }
.saint-services .service-closing em { color:#c7dda9; }
.saint-services .modal-card h2 { font-family:'Inter',sans-serif; font-weight:500; }
.service-brand { font-size:25px; letter-spacing:-.08em; }
.service-brand img { width:30px; height:30px; filter:drop-shadow(0 2px 3px #17382e22); }
.service-nav { position:relative; }
.service-nav-links { gap:31px; }
.service-nav-links > a,.nav-dropdown-toggle { color:#203b30; font-size:13px; font-weight:700; }
.nav-dropdown-toggle { background:transparent; border:0; padding:10px 0; display:flex; align-items:center; gap:7px; }
.nav-dropdown-toggle span { font-size:16px; line-height:1; transition:transform .2s; }
.nav-dropdown-toggle[aria-expanded="true"] span { transform:rotate(180deg); }
.nav-dropdown-toggle:hover,.service-nav-links > a:hover { color:#568268; }
.nav-mega { position:absolute; left:110px; right:110px; top:58px; z-index:50; background:#fffffff7; border:1px solid #e1eae2; border-radius:22px; box-shadow:0 25px 70px #17382e2b; padding:24px; backdrop-filter:blur(18px); animation:mega-in .24s ease both; }
@keyframes mega-in { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:none; } }
.nav-mega-heading { display:flex; justify-content:space-between; align-items:center; gap:15px; border-bottom:1px solid #e6eee6; padding-bottom:14px; margin-bottom:14px; font-size:10px; font-weight:700; letter-spacing:.12em; color:#728676; }
.nav-mega-heading a { font-size:11px; color:#2f6146; letter-spacing:0; }
.nav-mega-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.nav-mega-grid a { display:grid; grid-template-columns:74px 1fr 15px; align-items:center; gap:12px; min-height:102px; background:#f6f9f3; border:1px solid #edf2ea; border-radius:14px; padding:8px 15px 8px 6px; transition:background .2s,transform .2s,box-shadow .2s; }
.nav-mega-grid a:hover { background:#ebf5e8; transform:translateY(-2px); box-shadow:0 8px 18px #244d2a12; }
.nav-mega-grid img { width:74px; height:83px; object-fit:contain; filter:drop-shadow(0 5px 7px #1d3a2e20); }
.nav-mega-grid strong,.nav-approach-grid strong { display:block; font-size:13px; color:#233f2f; }
.nav-mega-grid small,.nav-approach-grid small { display:block; margin-top:3px; color:#789080; font-size:10px; line-height:1.4; }
.nav-mega-grid b { font-weight:400; color:#4e815e; font-size:14px; }
.nav-mega-approach { left:190px; right:190px; }
.nav-approach-grid { display:grid; grid-template-columns:repeat(3,1fr) 100px; gap:8px; align-items:center; }
.nav-approach-grid div { height:120px; background:#f6f9f3; border:1px solid #edf2ea; border-radius:14px; padding:16px; display:flex; flex-direction:column; }
.nav-approach-grid div span { color:#83a387; font-size:11px; margin-bottom:auto; }
.nav-approach-grid img { height:120px; width:100px; object-fit:contain; object-position:bottom; }
.service-hero { min-height:760px; padding-bottom:0; text-align:left; }
.service-hero::before { background:linear-gradient(90deg,#e7f5f5ad 0%,#e9f5f18e 45%,transparent 78%),linear-gradient(180deg,#f7fbf557,transparent 55%); }
.service-hero-content { width:min(690px,55%); max-width:none; margin:0 0 0 clamp(45px,7vw,125px); padding:225px 0 125px; text-align:left; }
.service-hero h1 { font-size:clamp(70px,6.8vw,106px); line-height:1.01; max-width:750px; margin:24px 0 23px; }
.service-hero-lede { max-width:455px; margin:0 !important; font-size:15px; }
.service-hero-actions { justify-content:flex-start; }
.hero-cast { position:absolute; right:1%; bottom:35px; width:48%; height:435px; pointer-events:none; }
.hero-cast img { position:absolute; bottom:0; height:auto; max-height:100%; object-fit:contain; filter:drop-shadow(0 16px 18px #193e3338); animation:cast-float 6s ease-in-out infinite; }
.hero-cast-pink { width:36%; left:3%; z-index:1; transform:rotate(-8deg); animation-delay:-2s !important; }
.hero-cast-duck { width:42%; left:28%; z-index:3; }
.hero-cast-dragon { width:43%; right:-1%; z-index:2; transform:rotate(5deg); animation-delay:-4s !important; }
@keyframes cast-float { 50% { translate:0 -9px; } }
.service-hero-bottom { z-index:4; }
.agent-world { background:#f6f7f1; }
.agent-gallery { margin-top:42px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.agent-card { min-width:0; height:360px; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; position:relative; overflow:hidden; border-radius:20px; background:#e6ede7; transition:transform .25s,box-shadow .25s; }
.agent-card:hover { transform:translateY(-6px); box-shadow:0 18px 30px #1f40221c; }
.agent-card img { position:absolute; left:50%; top:12px; transform:translateX(-50%); height:255px; width:90%; object-fit:contain; object-position:center bottom; filter:drop-shadow(0 8px 13px #29412d20); }
.agent-card > div { position:relative; z-index:1; width:100%; min-height:104px; padding:15px 20px; background:linear-gradient(180deg,#fffffff2,#ffffff); }
.agent-card span { display:block; color:#77947d; font-size:9px; font-weight:700; letter-spacing:.1em; }
.agent-card h3 { font-size:22px; margin-top:7px; line-height:1.1; }
.agent-card-builder { background:radial-gradient(circle at 45% 35%,#ffe39c,#7e6949 80%); }
.agent-card-builder img { width:100%; height:260px; top:0; object-fit:cover; object-position:top; filter:none; }
.agent-card-dragon { background:#f9e1da; }
.agent-card-duck { background:#f4eed3; }
.agent-card-pink { background:#f6e1ee; }
.agent-card-ninja { background:#e7e3e6; }
.agent-card-sunshine { background:#fbf1cc; }
.pricing-grid article { min-height:395px; border-radius:20px; }
.pricing-includes { list-style:none; padding:15px 0; margin:0 0 18px; border-top:1px solid #e5ebe4; display:grid; gap:6px; }
.pricing-includes li { color:#55705b; font-size:11px; line-height:1.4; }
.pricing-includes li::before { content:'✓'; color:#5e9d69; margin-right:8px; }
.pricing-grid strong { font:600 17px/1.2 'Inter',sans-serif; color:#213c2d; }
.pricing-range { display:block; color:#78917d; font-size:10px; margin-top:4px; }
.pricing-grid button { margin-top:16px; padding:11px 13px; border:1px solid #274b36; border-radius:9px; background:#254c36; color:#fff; text-align:center; font-size:11px; transition:transform .2s,background .2s; }
.pricing-grid button:hover { background:#3d7350; transform:translateY(-2px); text-decoration:none; }
.closing-cast { position:absolute; right:2%; bottom:-5px; width:42%; height:85%; pointer-events:none; }
.closing-cast img { position:absolute; bottom:0; height:85%; width:45%; object-fit:contain; object-position:bottom; filter:drop-shadow(0 13px 18px #0a211a59); }
.closing-cast img:nth-child(1) { left:0; height:72%; transform:rotate(-7deg); }
.closing-cast img:nth-child(2) { left:28%; height:92%; z-index:2; }
.closing-cast img:nth-child(3) { right:0; height:76%; transform:rotate(8deg); }
.service-closing > div:first-child { position:relative; z-index:2; max-width:740px; }
.service-closing h2 { max-width:700px; }
.service-plans-page .pricing-grid article { min-height:395px; }
@media(max-width:1100px) {
  .nav-mega { left:20px; right:20px; }
  .service-hero-content { width:58%; margin-left:55px; }
  .service-hero h1 { font-size:clamp(65px,7vw,85px); }
  .hero-cast { width:47%; height:365px; }
  .agent-card { height:325px; }.agent-card img { height:220px; }.agent-card-builder img { height:230px; }
}
@media(max-width:760px) {
  .service-nav-links { align-items:stretch; }
  .nav-dropdown-toggle { width:100%; justify-content:space-between; padding:3px 0; }
  .nav-mega,.nav-mega-approach { position:static; left:auto; right:auto; top:auto; width:100%; margin-top:12px; padding:12px; box-shadow:none; background:#f8faf6; border-radius:14px; animation:none; }
  .nav-mega-grid { grid-template-columns:1fr; }
  .nav-mega-grid a { min-height:78px; grid-template-columns:58px 1fr 15px; }
  .nav-mega-grid img { width:58px; height:60px; }
  .nav-approach-grid { grid-template-columns:repeat(3,1fr); }.nav-approach-grid div { height:105px; padding:8px; }.nav-approach-grid img { display:none; }
  .service-hero { min-height:760px; text-align:center; }
  .service-hero::before { background:linear-gradient(180deg,#e8f5f6c9 0%,#e7f4f6ad 55%,transparent 83%); }
  .service-hero-content { width:auto; margin:0 auto; padding:145px 22px 0; text-align:center; }
  .service-hero h1 { font-size:clamp(55px,9vw,78px); margin:20px auto; }
  .service-hero-lede { margin:0 auto !important; }
  .service-hero-actions { justify-content:center; }
  .hero-cast { width:min(600px,100%); height:320px; right:0; bottom:45px; }
  .agent-gallery { grid-template-columns:repeat(2,1fr); }.agent-card { height:310px; }
  .closing-cast { width:50%; opacity:.72; }.service-closing > div:first-child { max-width:500px; }
}
@media(max-width:510px) {
  .service-hero { min-height:760px; }
  .service-hero-content { padding:137px 15px 0; }
  .service-hero h1 { font-size:clamp(48px,11vw,61px); }
  .service-hero-actions { flex-direction:row; flex-wrap:wrap; gap:15px; }
  .hero-cast { height:255px; bottom:44px; }
  .nav-mega-heading { font-size:8px; }.nav-mega-heading a { font-size:9px; }
  .nav-approach-grid { grid-template-columns:1fr; }.nav-approach-grid div { height:auto; padding:10px; }.nav-approach-grid div span { margin-bottom:5px; }
  .agent-gallery { gap:8px; }.agent-card { height:245px; border-radius:14px; }.agent-card img { height:165px; }.agent-card-builder img { height:170px; }.agent-card > div { min-height:75px; padding:10px; }.agent-card span { font-size:7px; }.agent-card h3 { font-size:16px; }
  .closing-cast { width:75%; opacity:.33; }.service-closing > div:first-child { z-index:3; }
}
@media(prefers-reduced-motion:reduce) { .hero-cast img { animation:none; } .nav-mega { animation:none; } }

@media(max-width:760px){.service-hero{min-height:850px}.hero-cast{height:280px}}
@media(max-width:510px){.service-hero{min-height:790px}.hero-cast{height:230px;bottom:40px}}

/* AI agent concept: a clean cutout and a reserved space for a future walkthrough. */
.agent-spotlight { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); align-items:stretch; min-height:420px; margin-top:42px; overflow:hidden; border-radius:22px; background:#e9f2eb; }
.agent-spotlight-copy { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:clamp(28px,4vw,58px); }
.agent-spotlight-copy h3 { margin:18px 0; font-size:clamp(42px,4.2vw,64px); }
.agent-spotlight-copy p { max-width:380px; margin-bottom:28px; color:#52685a; font-size:13px; line-height:1.8; }
.agent-spotlight-visual { display:grid; place-items:center; position:relative; min-width:0; margin:0; overflow:hidden; background:radial-gradient(circle at 54% 48%,#f9fcf9 0%,#f0f7f1 65%,#e4f0e7 100%); }
.agent-spotlight-visual img { display:block; width:112%; max-width:none; height:auto; object-fit:contain; filter:drop-shadow(0 22px 24px #25493529); }
.agent-spotlight-visual figcaption { position:absolute; right:19px; bottom:14px; color:#64816d; font-size:9px; letter-spacing:.05em; }
.agent-video-slot { display:flex; align-items:center; gap:22px; margin-top:12px; padding:23px 28px; border:1px dashed #bfd1c2; border-radius:18px; background:#fcfdf9; }
.agent-video-mark { flex:none; display:grid; place-items:center; width:52px; height:52px; border-radius:50%; background:#e5f0e8; color:#4e765a; font-size:24px; }
.agent-video-slot > div:nth-child(2) { max-width:570px; }
.agent-video-slot span { color:#64816d; font-size:9px; font-weight:700; letter-spacing:.14em; }
.agent-video-slot h3 { margin:4px 0 5px; font-size:23px; }
.agent-video-slot p { color:#637668; font-size:11px; line-height:1.55; }
.agent-video-slot .service-button { flex:none; margin-left:auto; white-space:nowrap; }
@media(max-width:760px) {
  .agent-spotlight { grid-template-columns:1fr; }
  .agent-spotlight-copy { padding:38px 32px 28px; }
  .agent-spotlight-visual { min-height:320px; }
  .agent-spotlight-visual img { width:min(112%,740px); }
  .agent-video-slot { align-items:flex-start; flex-wrap:wrap; gap:15px; }
  .agent-video-slot .service-button { margin-left:74px; }
}
@media(max-width:510px) {
  .agent-spotlight { margin-top:30px; }
  .agent-spotlight-copy { padding:30px 24px 22px; }
  .agent-spotlight-copy h3 { font-size:42px; }
  .agent-spotlight-visual { min-height:245px; }
  .agent-video-slot { padding:20px; }
  .agent-video-mark { width:42px; height:42px; font-size:20px; }
  .agent-video-slot > div:nth-child(2) { width:calc(100% - 57px); }
  .agent-video-slot h3 { font-size:20px; }
  .agent-video-slot .service-button { margin-left:0; }
}

/* Dedicated service stories retain the same clear, image-led format as the agent tablet. */
.service-feature { padding-top:95px; padding-bottom:95px; }
.service-feature-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); align-items:center; gap:clamp(38px,6vw,95px); padding-top:58px; }
.service-feature-copy { padding:10px 0; }
.service-feature-copy h2 { margin:23px 0; font-size:clamp(51px,5.5vw,80px); }
.service-feature-copy > p:not(.service-pill) { max-width:475px; color:#5c6d61; font-size:14px; line-height:1.8; }
.service-feature-copy ul { display:grid; gap:10px; max-width:465px; margin:27px 0 31px; padding:0; list-style:none; color:#38523f; font-size:12px; }
.service-feature-copy li { padding-left:19px; position:relative; }
.service-feature-copy li::before { content:'↗'; position:absolute; left:0; color:#6b9c73; }
.feature-workflow { min-width:0; min-height:490px; margin:0; overflow:hidden; border:1px solid #dce9df; border-radius:22px; background:#f7faf7; box-shadow:0 26px 55px #2c583018; }
.feature-workflow-top { display:flex; align-items:center; gap:12px; height:49px; padding:0 18px; border-bottom:1px solid #e7eee8; background:#fff; color:#718678; font-size:10px; }
.feature-workflow-top > span { display:flex; gap:5px; }
.feature-workflow-top i { width:6px; height:6px; border-radius:50%; background:#cad7cd; }
.feature-workflow-top strong { color:#31523a; font-weight:600; }
.feature-workflow-top small { margin-left:auto; color:#819688; }
.feature-workflow-body { padding:38px 31px; }
.feature-workflow-title span { color:#71987a; font-size:9px; font-weight:700; letter-spacing:.14em; }
.feature-workflow-title strong { display:block; margin-top:10px; font:500 32px/1.06 'Inter',sans-serif; letter-spacing:-.05em; }
.feature-workflow-title p { margin-top:8px; color:#779080; font-size:11px; }
.feature-workflow-steps { display:grid; grid-template-columns:minmax(0,1fr) 17px minmax(0,1fr) 17px minmax(0,1fr); align-items:center; gap:6px; margin-top:47px; }
.feature-step { min-width:0; min-height:171px; padding:16px 12px; border:1px solid #e1eae1; border-radius:14px; background:#fff; box-shadow:0 10px 18px #27452b0b; }
.feature-step-highlight { background:#e6f2e6; border-color:#cbe3cf; }
.feature-step-icon { display:grid; place-items:center; width:30px; height:30px; margin-bottom:14px; border-radius:9px; background:#eef4ec; color:#4e865d; font-size:16px; }
.feature-step-highlight .feature-step-icon { background:#fff; }
.feature-step small { display:block; color:#799a80; font-size:7px; font-weight:700; letter-spacing:.08em; }
.feature-step strong { display:block; margin:5px 0; color:#274c32; font-size:11px; }
.feature-step p { color:#7d9181; font-size:9px; line-height:1.35; }
.feature-step-arrow { color:#75a67d; text-align:center; }
.feature-workflow-note { display:flex; align-items:center; gap:8px; margin-top:35px; padding:12px 15px; border-radius:9px; background:#edf6ed; color:#52745a; font-size:10px; }
.service-feature-voice { padding-top:75px; padding-bottom:95px; }
.service-feature-voice .service-feature-grid { grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); }
.feature-phone { display:grid; place-items:end center; position:relative; min-width:0; height:560px; margin:0; overflow:hidden; border-radius:22px; background:radial-gradient(circle at 50% 37%,#fbfcf9 0%,#eaf2eb 60%,#d9e8dc 100%); }
.feature-phone img { display:block; width:auto; max-width:100%; height:610px; object-fit:contain; object-position:center bottom; filter:drop-shadow(0 24px 30px #20442a2b); }
.feature-phone figcaption { position:absolute; right:19px; bottom:14px; color:#698570; font-size:9px; letter-spacing:.05em; }
@media(max-width:1050px) {
  .service-feature-grid { gap:35px; }
  .service-feature-copy h2 { font-size:clamp(48px,5vw,67px); }
  .feature-workflow-body { padding:28px 20px; }
  .feature-workflow-steps { gap:4px; }
  .feature-step { padding:13px 8px; }
  .feature-phone { height:510px; }
  .feature-phone img { height:555px; }
}
@media(max-width:760px) {
  .service-feature { padding-top:75px; padding-bottom:75px; }
  .service-feature-grid,.service-feature-voice .service-feature-grid { grid-template-columns:1fr; gap:38px; padding-top:40px; }
  .service-feature-copy { padding:0; }
  .service-feature-copy h2 { font-size:clamp(47px,9vw,68px); }
  .service-feature-voice .service-feature-copy { order:-1; }
  .feature-workflow { min-height:0; }
  .feature-phone { height:470px; }
  .feature-phone img { height:515px; }
}
@media(max-width:510px) {
  .service-feature { padding-top:66px; padding-bottom:66px; }
  .service-feature-copy h2 { font-size:clamp(43px,10vw,58px); }
  .feature-workflow-body { padding:24px 14px; }
  .feature-workflow-title strong { font-size:27px; }
  .feature-workflow-steps { grid-template-columns:1fr; gap:8px; margin-top:25px; }
  .feature-step { min-height:0; padding:12px 14px; }
  .feature-step-icon { margin-bottom:5px; }
  .feature-step-arrow { transform:rotate(90deg); line-height:12px; }
  .feature-workflow-note { margin-top:21px; }
  .feature-phone { height:390px; }
  .feature-phone img { height:435px; }
}

/* Landing page without character artwork. */
.nav-service-glyph { display:grid; place-items:center; width:74px; height:78px; border-radius:12px; background:#e9f3eb; color:#477654; font:400 31px/1 'Inter',sans-serif; }
.nav-glyph-leads { background:#eaf2f8; color:#4d7890; }
.nav-glyph-voice { background:#f7eee6; color:#ad785d; }
.nav-glyph-agents { background:#f0eefa; color:#796caa; }
.nav-approach-grid-no-art { grid-template-columns:repeat(3,minmax(0,1fr)); }
.service-hero { min-height:760px; text-align:center; }
.service-hero::before { background:linear-gradient(180deg,#edf9f8c9 0%,#e9f4f3a8 52%,transparent 85%); }
.service-hero-content { width:min(840px,calc(100% - 48px)); max-width:none; margin:0 auto; padding:195px 0 120px; text-align:center; }
.service-hero h1 { max-width:none; margin:24px auto 20px; font-size:clamp(72px,8.2vw,120px); line-height:.98; }
.service-hero-lede { max-width:560px; margin:0 auto !important; }
.service-hero-actions { justify-content:center; }
.agent-capabilities { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:28px; }
.agent-capabilities article { display:flex; flex-direction:column; min-height:240px; padding:28px; border:1px solid #dce6db; border-radius:18px; background:#fff; }
.agent-capabilities article > span { color:#71927b; font-size:9px; font-weight:700; letter-spacing:.12em; }
.agent-capabilities h3 { margin:25px 0 10px; font-size:27px; }
.agent-capabilities p { max-width:330px; color:#68786c; font-size:12px; line-height:1.65; }
.agent-capabilities article > div { display:flex; align-items:center; gap:10px; margin-top:auto; padding-top:26px; color:#426b4d; font-size:11px; font-weight:600; }
.agent-capabilities b { color:#91b398; font-weight:400; }
.saint-services:not(.service-plans-page) .service-closing { justify-content:center; text-align:center; background:radial-gradient(circle at 50% 110%,#315b47 0%,#17382e 65%); }
.saint-services:not(.service-plans-page) .service-closing > div:first-child { max-width:850px; }
.saint-services:not(.service-plans-page) .service-closing h2 { max-width:none; }
@media(max-width:760px) {
  .nav-service-glyph { width:58px; height:60px; font-size:25px; }
  .nav-approach-grid-no-art { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .service-hero { min-height:750px; }
  .service-hero-content { width:calc(100% - 42px); padding:180px 0 100px; }
  .service-hero h1 { font-size:clamp(66px,10vw,88px); }
  .agent-capabilities { grid-template-columns:1fr; }
  .agent-capabilities article { min-height:190px; }
}
@media(max-width:510px) {
  .nav-approach-grid-no-art { grid-template-columns:1fr; }
  .service-hero { min-height:700px; }
  .service-hero-content { width:calc(100% - 30px); padding:156px 0 90px; }
  .service-hero h1 { font-size:clamp(57px,11vw,72px); }
  .service-hero-actions { justify-content:center; }
  .agent-capabilities article { padding:22px; }
}

.service-intro { padding-bottom:75px; }
#automation { padding-top:60px; }
@media(max-width:760px) {
  .service-intro { padding-bottom:58px; }
  #automation { padding-top:52px; }
}

/* Rounded icon navigation, inspired by the supplied reference. */
.service-nav { gap:15px; }
.service-nav-pill { position:relative; isolation:isolate; display:flex; align-items:center; gap:1px; margin:auto; padding:4px; overflow:hidden; border:1px solid #f8fffac4; border-radius:100px; background:linear-gradient(135deg,#ffffffe0,#edf8f0a3 54%,#ffffffc4); box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #bcd4c34d,0 12px 30px #2045321e; -webkit-backdrop-filter:blur(24px) saturate(1.35); backdrop-filter:blur(24px) saturate(1.35); }
.service-nav-pill::before { content:''; position:absolute; inset:0; z-index:0; border-radius:inherit; background:linear-gradient(165deg,#ffffff70 0%,transparent 44%,#c8e1d035 100%); pointer-events:none; }
.service-nav-pill .service-nav-item { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-width:85px; min-height:49px; padding:3px 5px; border-radius:55px; color:#4d6856; font:500 10.5px/1.1 'Inter',sans-serif; white-space:nowrap; transition:color .2s,background .2s,transform .2s; }
.service-nav-pill .service-nav-item:hover { opacity:1; color:#2d5640; background:#ffffffa3; transform:translateY(-1px); }
.service-nav-icon { display:grid; place-items:center; width:25px; height:25px; border-radius:50%; color:#62856c; font:400 18px/1 'Inter',sans-serif; transition:background .2s,color .2s,transform .2s; }
.service-nav-item:hover .service-nav-icon { transform:scale(1.08); }
.service-nav-item.is-active,.service-nav-item[aria-current="page"] { color:#2f5940; }
.service-nav-item.is-active .service-nav-icon,.service-nav-item[aria-current="page"] .service-nav-icon { background:#416d52; color:#fff; }
.service-nav-cta { min-height:39px; padding:9px 14px; gap:11px; border:1px solid #f8fffac9; border-radius:100px; background:#f7fff9bd; box-shadow:inset 0 1px 0 #fff,0 9px 24px #20453218; -webkit-backdrop-filter:blur(18px) saturate(1.25); backdrop-filter:blur(18px) saturate(1.25); color:#315b43; font:500 12px/1 'Inter',sans-serif !important; white-space:nowrap; }

/* A dedicated Lead Generation story on the page's plain white canvas. */
.service-feature-leads { background:#fff; }
.feature-lead-canvas { min-width:0; min-height:500px; margin:0; padding:27px; border:1px solid #e2e9e3; border-radius:23px; background:#fff; box-shadow:0 25px 58px #2d513013; }
.feature-lead-top { display:flex; justify-content:space-between; align-items:center; gap:15px; padding-bottom:17px; border-bottom:1px solid #e8eee7; color:#72917b; font-size:9px; font-weight:700; letter-spacing:.12em; }
.feature-lead-top small { color:#91a397; font-size:9px; font-weight:400; letter-spacing:0; }
.feature-lead-heading { padding:30px 5px 23px; }
.feature-lead-heading > span { color:#688d71; font-size:9px; font-weight:700; letter-spacing:.13em; }
.feature-lead-heading strong { display:block; margin:10px 0 8px; color:#203b2b; font:500 clamp(30px,3vw,42px)/1.05 'Inter',sans-serif; letter-spacing:-.05em; }
.feature-lead-heading p { color:#718477; font-size:11px; }
.feature-lead-list { display:grid; gap:8px; }
.feature-lead-list > div { display:grid; grid-template-columns:32px minmax(0,1fr) auto; align-items:center; gap:12px; padding:14px; border:1px solid #e7eee7; border-radius:13px; background:#f9fbf8; }
.feature-lead-index { display:grid; place-items:center; width:31px; height:31px; border-radius:9px; background:#e6f0e6; color:#537d5c; font-size:10px; font-weight:700; }
.feature-lead-list strong { display:block; color:#294c35; font-size:12px; }
.feature-lead-list small { display:block; margin-top:3px; color:#809184; font-size:9px; }
.feature-lead-list b { color:#658d6b; font-size:8px; font-weight:700; letter-spacing:.08em; }
.feature-lead-footer { display:flex; align-items:center; gap:10px; margin-top:22px; color:#678371; font-size:10px; }
@media(max-width:1040px) {
  .service-nav { position:relative; }
  .service-menu-toggle { display:flex; flex-direction:column; justify-content:center; gap:5px; width:40px; height:40px; margin-left:auto; padding:9px; border:1px solid #d5e4d8; border-radius:50%; background:#ffffffeb; }
  .service-menu-toggle span { display:block; width:100%; height:2px; background:#213d2b; }
  .service-nav-pill { display:none; position:absolute; top:51px; left:0; right:0; z-index:60; margin:0; padding:10px; border-radius:20px; box-shadow:0 20px 45px #183b2822; }
  .service-nav-pill.is-open { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
  .service-nav-pill .service-nav-item { min-width:0; min-height:63px; }
}
@media(max-width:760px) {
  .service-nav-pill { top:51px; background:linear-gradient(135deg,#fffffff0,#eff9f1dc); }
  .service-nav-pill .service-nav-item { padding:7px 3px; }
}
@media(max-width:510px) {
  .service-nav-pill.is-open { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .feature-lead-canvas { min-height:0; padding:18px; }
  .feature-lead-heading { padding:24px 2px 20px; }
  .feature-lead-heading strong { font-size:31px; }
  .feature-lead-list > div { grid-template-columns:28px minmax(0,1fr); gap:9px; padding:11px; }
  .feature-lead-list b { grid-column:2; }
}

/* Slim glass navigation: one floating capsule that stays with you while scrolling. */
.service-header { position:fixed; padding:22px 24px; pointer-events:none; }
.service-nav { pointer-events:auto; max-width:1120px; height:54px; gap:10px; padding:0 7px 0 18px; border:1px solid #ffffffb3; border-radius:100px; background:linear-gradient(135deg,#ffffff8c,#f2faf466); box-shadow:inset 0 1px 0 #ffffffe6,inset 0 -1px 0 #ffffff40,0 10px 34px #1a3a2a1f,0 1px 2px #1a3a2a14; -webkit-backdrop-filter:blur(28px) saturate(1.8); backdrop-filter:blur(28px) saturate(1.8); }
.service-brand { font-size:21px; gap:7px; }
.service-brand img { width:24px; height:24px; }
.service-nav-pill { gap:2px; padding:0; border:0; background:none; box-shadow:none; overflow:visible; -webkit-backdrop-filter:none; backdrop-filter:none; }
.service-nav-pill::before { display:none; }
.service-nav-pill .service-nav-item { flex-direction:row; gap:6px; min-width:0; min-height:34px; padding:0 12px; border-radius:100px; color:#3f5a4a; font:500 13px/1 'Inter',sans-serif; letter-spacing:-.01em; }
.service-nav-pill .service-nav-item:hover { background:#ffffff8c; color:#1d3a2b; transform:none; }
.service-nav-icon { width:auto; height:auto; border-radius:0; background:none !important; color:#7da489; font-size:12px; }
.service-nav-item.is-active,.service-nav-item[aria-current="page"] { background:#ffffffd9; color:#17321f; box-shadow:0 1px 2px #1a3a2a14,inset 0 0 0 1px #ffffff; }
.service-nav-item.is-active .service-nav-icon,.service-nav-item[aria-current="page"] .service-nav-icon { color:#3f7a54; }
.service-nav-cta { min-height:40px; padding:0 16px; gap:8px; border:0; background:#17251f; color:#fff; box-shadow:0 6px 16px #17251f33; font:600 13px/1 'Inter',sans-serif !important; -webkit-backdrop-filter:none; backdrop-filter:none; }
.service-nav-cta:hover { background:#2c4d3a; box-shadow:0 8px 20px #17251f40; }
.service-hero-content { padding-top:170px; }
@media(max-width:1040px) {
  .service-nav { padding:0 6px 0 16px; }
  .service-menu-toggle { width:36px; height:36px; padding:10px 9px; border:0; background:#ffffffa6; }
  .service-nav-pill { top:62px; padding:8px; border:1px solid #ffffffb3; border-radius:22px; background:#ffffffbf; box-shadow:0 20px 45px #183b2826; -webkit-backdrop-filter:blur(28px) saturate(1.8); backdrop-filter:blur(28px) saturate(1.8); }
  .service-nav-pill.is-open { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .service-nav-pill .service-nav-item { min-height:44px; justify-content:flex-start; padding:0 14px; }
}
@media(max-width:760px) { .service-nav-pill { top:62px; background:#ffffffd1; } .service-nav-cta { min-height:36px; padding:0 13px; font-size:12px !important; } }
@media(max-width:510px) { .service-header { padding:10px 12px; } .service-nav { height:50px; } .service-nav-pill { top:58px; } .service-nav-pill.is-open { grid-template-columns:1fr; } }

/* Glass product mockups for each service. */
.glass-stage { position:relative; isolation:isolate; overflow:hidden; background:radial-gradient(circle at 18% 22%,#bfe3d1 0,transparent 42%),radial-gradient(circle at 85% 18%,#cfe0f7 0,transparent 40%),radial-gradient(circle at 70% 88%,#f6dcc6 0,transparent 45%),linear-gradient(140deg,#eef6f1,#e6eff4); }
.glass-stage::before,.glass-stage::after { content:''; position:absolute; z-index:-1; border-radius:50%; filter:blur(8px); }
.glass-stage::before { width:46%; aspect-ratio:1; left:-6%; bottom:-12%; background:radial-gradient(circle at 35% 35%,#8fcaa8,#4f9a72); opacity:.75; }
.glass-stage::after { width:34%; aspect-ratio:1; right:4%; top:6%; background:radial-gradient(circle at 35% 35%,#b9d3ff,#7aa3e0); opacity:.6; }
.visual-leads::before { background:radial-gradient(circle at 35% 35%,#a9d0f0,#5f95c4); } .visual-leads::after { background:radial-gradient(circle at 35% 35%,#c7ecc9,#6fb37f); }
.visual-voice::before { background:radial-gradient(circle at 35% 35%,#ffd6b0,#e59c6a); } .visual-voice::after { background:radial-gradient(circle at 35% 35%,#a8dcc4,#5ea585); }
.visual-agents::before { background:radial-gradient(circle at 35% 35%,#d6c8fb,#9a84e0); } .visual-agents::after { background:radial-gradient(circle at 35% 35%,#ffcdbf,#e88a74); }
.glass { background:linear-gradient(145deg,#ffffff8f,#ffffff4d); border:1px solid #ffffffb8; box-shadow:inset 0 1px 0 #ffffffeb,0 24px 60px #1b3d2b26,0 2px 6px #1b3d2b0f; -webkit-backdrop-filter:blur(26px) saturate(1.7); backdrop-filter:blur(26px) saturate(1.7); }
.glass-soft { background:#ffffff99; border:1px solid #ffffffd9; box-shadow:0 4px 14px #1b3d2b0d; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
.service-visual.glass-stage { gap:0; padding:40px; }
.ui-window { position:relative; z-index:1; width:min(430px,100%); border-radius:18px; overflow:hidden; color:#1d3327; text-align:left; }
.ui-bar { display:flex; align-items:center; gap:10px; height:44px; padding:0 14px; border-bottom:1px solid #ffffff99; font-size:12px; }
.ui-bar b { font-weight:600; }
.ui-dots { display:flex; gap:5px; } .ui-dots i { width:8px; height:8px; border-radius:50%; background:#ffffffd9; box-shadow:inset 0 0 0 1px #1d332714; }
.ui-chip { margin-left:auto; display:inline-flex; align-items:center; gap:5px; padding:4px 9px; border-radius:100px; background:#e3f2e7cc; color:#2f6b46; font:600 10px/1.2 'Inter',sans-serif; white-space:nowrap; }
.ui-row .ui-chip,.ui-call-card .ui-chip { margin-left:0; }
.ui-chip-live i { width:6px; height:6px; border-radius:50%; background:#3fa36a; box-shadow:0 0 0 3px #3fa36a33; animation:ui-pulse 1.6s ease-in-out infinite; }
.ui-chip-blue { background:#e2ecf8cc; color:#36628d; } .ui-chip-gold { background:#f8edd2cc; color:#8a6420; }
@keyframes ui-pulse { 50% { box-shadow:0 0 0 6px #3fa36a00; } }
.ui-search { margin-left:auto; padding:5px 11px; border-radius:100px; background:#ffffffb3; color:#6b8273; font-size:10px; }
.ui-ico { display:grid; place-items:center; flex:none; width:32px; height:32px; border-radius:10px; background:#ffffffcc; color:#3f7a54; font-size:14px; box-shadow:inset 0 0 0 1px #1d33270f; }
.ui-ico-solid { background:linear-gradient(145deg,#3f7a54,#285539); color:#fff; box-shadow:0 4px 10px #285a3a40; }
.ui-flow { padding:18px; display:grid; }
.ui-node { display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:13px; }
.ui-node > span:nth-child(2),.ui-call-card > span,.ui-float > span:last-child { display:grid; gap:2px; min-width:0; }
.ui-node b,.ui-call-card b,.ui-float b { font-size:12px; font-weight:600; }
.ui-node small,.ui-call-card small,.ui-float small { font-size:10px; color:#6b8273; }
.ui-node-active { background:#ffffffd9; box-shadow:0 0 0 2px #3f7a5426,0 10px 24px #1b3d2b1a; }
.ui-node-muted { opacity:.72; }
.ui-tag { margin-left:auto; font:500 10px 'Inter',sans-serif; color:#7c9184; }
.ui-connector { justify-self:start; width:2px; height:14px; margin-left:27px; background:linear-gradient(#3f7a5466,#3f7a5422); }
.ui-progress { margin-left:auto; width:54px; height:5px; border-radius:5px; background:#3f7a541f; overflow:hidden; } .ui-progress i { display:block; width:62%; height:100%; border-radius:inherit; background:#3f7a54; animation:ui-load 2.4s ease-in-out infinite alternate; }
@keyframes ui-load { from { width:25%; } to { width:85%; } }
.ui-float { position:absolute; z-index:2; display:flex; align-items:center; gap:10px; padding:11px 14px 11px 11px; border-radius:15px; color:#1d3327; animation:ui-float 6s ease-in-out infinite; }
.ui-float-br { right:22px; bottom:26px; } .ui-float-tr { right:22px; top:24px; }
@keyframes ui-float { 50% { translate:0 -6px; } }
.ui-table { padding:8px 14px 14px; font-size:11px; }
.ui-row { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) 78px; align-items:center; gap:12px; padding:9px 4px; border-bottom:1px solid #ffffff8c; }
.ui-row:last-child { border:0; } .ui-row > span:first-child { display:flex; align-items:center; gap:8px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ui-row-head { color:#7c9184; font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding-top:4px; }
.ui-row-faint { opacity:.55; }
.ui-avatar { display:grid; place-items:center; flex:none; width:26px; height:26px; border-radius:50%; background:#f3d8c9; color:#5a3d2e; font:700 8px/1 'Inter',sans-serif; font-style:normal; }
.ui-avatar-blue { background:#d3e5f3; color:#2d5170; } .ui-avatar-gold { background:#efe2b8; color:#6d5418; }
.ui-fit { height:6px; border-radius:6px; background:#1d332714; overflow:hidden; } .ui-fit i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#7cc095,#3f7a54); }
.ui-call { width:min(400px,100%); }
.ui-call-body { display:flex; flex-direction:column; align-items:center; gap:12px; padding:22px 18px 20px; }
.ui-orb { display:grid; place-items:center; flex:none; width:68px; height:68px; border-radius:50%; background:radial-gradient(circle at 32% 28%,#fff,#b8e0cb 55%,#5ea585); color:#fff; font-size:24px; box-shadow:0 0 0 8px #ffffff59,0 12px 26px #2e6a4a40; }
.ui-orb-sm { width:36px; height:36px; font-size:14px; box-shadow:0 0 0 4px #ffffff59; }
.ui-wave { display:flex; align-items:center; gap:3px; height:26px; } .ui-wave i { width:3px; height:10px; border-radius:3px; background:#3f7a54; animation:wave 1.2s ease-in-out infinite alternate; } .ui-wave i:nth-child(2n) { height:20px; animation-delay:.2s; } .ui-wave i:nth-child(3n) { height:26px; animation-delay:.4s; }
.ui-wave-sm { margin-left:auto; height:18px; } .ui-wave-sm i:nth-child(3n) { height:18px; }
.ui-bubble { max-width:85%; padding:9px 12px; border-radius:14px; font-size:11px; line-height:1.45; }
.ui-bubble-in { align-self:flex-start; background:#ffffffc7; border-bottom-left-radius:4px; }
.ui-bubble-out { align-self:flex-end; background:linear-gradient(145deg,#3f7a54,#2c5c3e); color:#fff; border-bottom-right-radius:4px; }
.ui-summary { display:block; padding:13px 15px; min-width:170px; }
.ui-summary small { font-size:8px; font-weight:700; letter-spacing:.12em; color:#6b8273; }
.ui-summary dl { display:grid; grid-template-columns:auto 1fr; gap:5px 12px; margin:8px 0 0; font-size:11px; } .ui-summary dt { color:#7c9184; } .ui-summary dd { margin:0; font-weight:600; text-align:right; }
.ui-agent { padding:16px 18px 18px; }
.ui-goal { font-size:13px; font-weight:600; line-height:1.4; } .ui-goal small { display:block; margin-bottom:4px; font-size:8px; letter-spacing:.12em; color:#6b8273; }
.ui-steps { list-style:none; margin:14px 0; padding:0; display:grid; gap:6px; }
.ui-steps li { display:grid; grid-template-columns:24px 1fr; column-gap:10px; align-items:center; padding:9px 10px; border-radius:12px; background:#ffffff80; }
.ui-steps li span { grid-row:span 2; display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:#3f7a54; color:#fff; font-size:11px; }
.ui-steps li b { font-size:12px; font-weight:600; } .ui-steps li small { font-size:10px; color:#6b8273; }
.ui-steps li.is-waiting { background:#ffffffd9; box-shadow:0 0 0 2px #8a74d633; } .ui-steps li.is-waiting span { background:#efe9ff; color:#6b55c4; }
.ui-approve { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 10px 10px 14px; border-radius:12px; background:#1d3327; color:#fff; font-size:11px; }
.ui-approve button { border:0; border-radius:100px; padding:7px 14px; background:#fff; color:#1d3327; font-size:11px; font-weight:600; pointer-events:none; }

/* Larger mockups replace the phone and tablet photos. */
.feature-phone.glass-stage { place-items:center; padding:40px; }
.feature-phone .ui-window,.agent-spotlight-visual .ui-window { width:min(480px,100%); }
.ui-inbox { display:grid; gap:8px; padding:16px; }
.ui-call-card { display:flex; align-items:center; gap:11px; padding:12px; border-radius:14px; }
.ui-call-card .ui-chip { margin-left:auto; }
.ui-call-card .ui-avatar { width:34px; height:34px; font-size:9px; }
.agent-spotlight-visual.glass-stage { padding:36px; }
.agent-spotlight-visual .ui-workspace { width:min(560px,100%); }
.ui-workspace-body { display:grid; grid-template-columns:118px 1fr; min-height:320px; }
.ui-side { display:flex; flex-direction:column; gap:3px; padding:12px 8px; border-right:1px solid #ffffff99; font-size:11px; color:#5d7466; }
.ui-side span { padding:7px 9px; border-radius:9px; } .ui-side .is-active { background:#ffffffc7; color:#1d3327; font-weight:600; }
.ui-chat { display:flex; flex-direction:column; gap:9px; padding:14px; }
.ui-plan { display:grid; gap:7px; padding:12px; border-radius:13px; font-size:11px; } .ui-plan b { font-size:12px; font-weight:600; }
.ui-plan span { display:flex; align-items:center; gap:8px; color:#4c6455; } .ui-plan i { width:13px; height:13px; border-radius:4px; border:1.5px solid #3f7a5466; } .ui-plan i.is-done { background:#3f7a54; border-color:#3f7a54; }
.ui-input { margin-top:auto; display:flex; justify-content:space-between; align-items:center; padding:8px 8px 8px 13px; border-radius:100px; background:#ffffffb3; color:#8a9d91; font-size:11px; } .ui-input span { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:#3f7a54; color:#fff; }

/* Stronger glass on the workflow and lead cards. */
.feature-workflow,.feature-lead-canvas { position:relative; isolation:isolate; overflow:hidden; border:1px solid #ffffffb8; background:radial-gradient(circle at 12% 88%,#a9d8bd 0,transparent 40%),radial-gradient(circle at 92% 10%,#cadcf6 0,transparent 42%),linear-gradient(140deg,#f0f7f2,#e8f0f5); box-shadow:0 26px 60px #1b3d2b1f; }
.feature-workflow-top { background:#ffffff66; border-color:#ffffff99; -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); }
.feature-step,.feature-lead-list > div { background:#ffffff8c; border-color:#ffffffd9; -webkit-backdrop-filter:blur(16px) saturate(1.5); backdrop-filter:blur(16px) saturate(1.5); box-shadow:inset 0 1px 0 #fff,0 10px 24px #1b3d2b12; }
.feature-step-highlight { background:#ffffffd1; box-shadow:0 0 0 2px #3f7a5426,0 14px 28px #1b3d2b1a; }
.feature-workflow-note { background:#ffffff8c; -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
.feature-lead-top { border-color:#ffffff99; }
.feature-lead-index { background:#ffffffd9; }
@media(max-width:760px) {
  .service-visual.glass-stage,.feature-phone.glass-stage { padding:24px; }
  .feature-phone { height:auto; min-height:0; }
  .agent-spotlight-visual.glass-stage { padding:22px; }
}
@media(max-width:510px) {
  .service-visual.glass-stage { padding:16px 14px 70px; align-items:flex-start; }
  .ui-float-br { right:12px; bottom:14px; } .ui-float-tr { position:relative; top:auto; right:auto; margin-top:12px; }
  .visual-voice { flex-direction:column; align-items:stretch; padding-bottom:16px; }
  .ui-row { grid-template-columns:minmax(0,1.4fr) minmax(0,.7fr) 70px; gap:8px; }
  .ui-workspace-body { grid-template-columns:1fr; } .ui-side { display:none; }
  .feature-phone.glass-stage { padding:14px; } .ui-call-card { padding:10px; } .ui-call-card .ui-chip { display:none; }
}
@media(prefers-reduced-motion:reduce) { .ui-float,.ui-progress i,.ui-wave i,.ui-chip-live i { animation:none; } }
.saint-services .ui-tag,.saint-services .ui-chip { font:600 10px/1.2 'Inter',sans-serif; letter-spacing:0; }
.saint-services .ui-tag { font-weight:500; color:#7c9184; }

/* Voice receptionist: three clear iPhone call examples. */
.service-feature-voice { background:#f6f7f6; }
.voice-showcase-intro { display:grid; grid-template-columns:1.1fr .9fr; align-items:end; gap:clamp(35px,6vw,90px); padding-top:57px; }
.voice-showcase-intro .service-feature-copy h2 { max-width:750px; }
.voice-showcase-detail { padding-bottom:8px; }
.voice-showcase-detail > p:not(.service-pill) { max-width:500px; }
.voice-phone-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; gap:clamp(3px,1vw,14px); margin-top:52px; padding:34px 18px 30px; border:1px solid #34383a; border-radius:34px; background:linear-gradient(180deg,#4d5356 0%,#292e31 31%,#111517 68%,#030405 100%); box-shadow:0 30px 70px #080b0d45,inset 0 1px #ffffff38; }
.voice-phone-card { position:relative; min-width:0; margin:0; text-align:center; transform-origin:center 56%; filter:drop-shadow(0 25px 20px #00000080); transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .5s; will-change:transform; }
.voice-phone-card-one { transform:translateY(30px) rotate(-9deg); }
.voice-phone-card-two { transform:translateY(10px) rotate(-2deg); }
.voice-phone-card-three { transform:translateY(30px) rotate(9deg); }
.voice-phone-gallery.is-near .voice-phone-card { transform:translateY(0) rotate(0); }
.voice-phone-gallery.is-near .voice-phone-card-two { transition-delay:.08s; }
.voice-phone-gallery.is-near .voice-phone-card-three { transition-delay:.16s; }
.voice-phone-card:hover,.voice-phone-gallery.is-near .voice-phone-card:hover { z-index:2; transform:translateY(-10px) rotate(0) scale(1.025); filter:drop-shadow(0 34px 28px #000000b3); }
.voice-phone-visual { position:relative; width:min(100%,390px); aspect-ratio:2/3; margin:auto; }
.voice-phone-visual > img { display:block; width:100%; height:100%; object-fit:contain; pointer-events:none; }
.voice-home-widgets { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.voice-widget { display:flex; flex-direction:column; align-items:flex-start; aspect-ratio:1; min-width:0; padding:9px 8px; border-radius:13px; text-align:left; box-shadow:0 7px 16px #0a2b2630; }
.voice-widget span { font-size:6px; font-weight:700; letter-spacing:.12em; }
.voice-widget strong { margin-top:auto; font:500 clamp(21px,2.5vw,32px)/.95 'Inter',sans-serif; }
.voice-widget small { margin-top:5px; font-size:6px; white-space:nowrap; }
.voice-widget-weather { background:linear-gradient(145deg,#9ebfd5,#447e9b); }
.voice-widget-day { background:linear-gradient(145deg,#f4f3e9,#d8e7dc); color:#254a3a; }
.voice-home-apps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px 5px; margin-top:18px; }
.voice-home-apps > span { display:flex; flex-direction:column; align-items:center; gap:4px; min-width:0; font-size:6px; text-shadow:0 1px 4px #183b3766; }
.voice-home-apps i,.voice-home-dock > span { display:grid; place-items:center; width:clamp(27px,2.5vw,35px); height:clamp(27px,2.5vw,35px); border-radius:9px; color:#fff; font:500 17px/1 'Inter',sans-serif; font-style:normal; box-shadow:0 3px 10px #08221e3a; }
.voice-home-apps .app-mail { background:#4d9de0; }.voice-home-apps .app-calendar { background:#f9fbf7; color:#d15e4e; font-size:15px; }.voice-home-apps .app-notes { background:#f4ce66; color:#51452f; }.voice-home-apps .app-photos { background:#f4f4f0; color:#df86a6; }
.voice-home-apps .app-maps { background:#79bb83; }.voice-home-apps .app-clock { background:#202d2a; }.voice-home-apps .app-music { background:#db7d83; }.voice-home-apps .app-settings { background:#87928d; }
.voice-home-dock { display:flex; justify-content:space-around; gap:3px; margin-top:auto; padding:7px 2px; border:1px solid #ffffff54; border-radius:13px; background:#e5f1e45c; backdrop-filter:blur(12px); }
.voice-home-dock > span { width:clamp(26px,2.4vw,34px); height:clamp(26px,2.4vw,34px); }
.voice-home-dock .app-phone,.voice-home-dock .app-messages { background:#46b76c; }.voice-home-dock .app-messages { font-size:9px; letter-spacing:-2px; }.voice-home-dock .app-browser { background:#67a8d3; }.voice-home-dock .app-camera { background:#555f5c; }
.voice-device-screen { position:absolute; z-index:2; inset:5.8% 23.25% 19.2%; overflow:hidden; border-radius:8% 8% 7% 7%; pointer-events:none; box-shadow:inset 0 0 12px #08161d2b; }
.voice-device-screen::after { content:''; position:absolute; z-index:3; inset:0; border-radius:inherit; background:linear-gradient(115deg,#ffffff1c 0%,#ffffff08 16%,transparent 35%,transparent 76%,#ffffff0c 100%); box-shadow:inset 2px 0 7px #ffffff21,inset -2px 0 8px #06152019; pointer-events:none; }
.voice-screen-directory { display:flex; flex-direction:column; padding:17% 5% 2.5%; background:linear-gradient(180deg,#e4e7e8,#f6f7f7); color:#283138; text-align:left; }
.voice-directory-head { display:flex; align-items:center; gap:5px; height:15px; font-size:8px; }
.voice-directory-head > span { display:grid; place-items:center; width:14px; height:14px; border-radius:4px; background:#171e20; color:#fff; font-size:10px; }
.voice-directory-head b { font-size:8px; }.voice-directory-head small { margin-left:auto; font-size:10px; }
.voice-directory-search { display:flex; align-items:center; gap:5px; height:25px; margin-top:7px; padding:0 8px; border-radius:20px; background:#f9fbfc; color:#71808a; font-size:8px; box-shadow:0 1px 3px #122b3c0d; }
.voice-directory-search b { margin-left:auto; color:#52616a; font-size:10px; }
.voice-directory-list { display:grid; grid-template-rows:repeat(3,minmax(0,1fr)); gap:6px; flex:1; min-height:0; margin-top:7px; overflow:hidden; }
.voice-directory-person { min-height:0; overflow:hidden; padding:7px 7px 5px; border-radius:12px; background:#fff; box-shadow:0 3px 7px #1a34441a; }
.voice-directory-person > div { display:flex; align-items:center; gap:5px; }
.voice-person-avatar { display:grid; place-items:center; width:19px; height:19px; flex:none; border-radius:50%; color:#fff; font:600 7px/1 'Inter',sans-serif; font-style:normal; }
.avatar-jada { background:linear-gradient(140deg,#8b57d9,#e98db3); }.avatar-noah { background:linear-gradient(140deg,#4b9bd4,#82c7ad); }.avatar-maya { background:linear-gradient(140deg,#f1a56b,#e46a84); }
.voice-directory-person > div span { display:grid; gap:1px; min-width:0; }.voice-directory-person b { font-size:8px; line-height:1; }.voice-directory-person small { color:#71808a; font-size:6px; }
.voice-directory-person p { display:-webkit-box; overflow:hidden; margin:5px 0 4px; color:#42515a; font-size:6px; line-height:1.25; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.voice-person-tags { display:flex; gap:3px; padding:2px 0; font-size:5px; color:#536168; }.voice-person-tags em { padding:2px 4px; border-radius:6px; background:#ebedef; font:inherit; }
.voice-directory-nav { display:flex; justify-content:space-around; align-items:center; height:22px; margin-top:5px; border-radius:12px; background:#ffffffeb; color:#8f9ca4; font-size:13px; }.voice-directory-nav .is-active { color:#15222a; }
.voice-screen-home { display:flex; flex-direction:column; padding:17% 5% 3%; background:radial-gradient(circle at 76% 12%,#aab1b4 0%,#596367 28%,#263033 59%,#080d0f 100%); color:#fff; }
.voice-screen-home .voice-home-widgets { gap:5px; }.voice-screen-home .voice-widget { padding:6px; border-radius:11px; }.voice-screen-home .voice-widget strong { font-size:clamp(19px,2.2vw,29px); }.voice-screen-home .voice-widget small { font-size:5px; white-space:normal; }
.voice-screen-home .voice-widget-weather { background:linear-gradient(145deg,#89969d,#394c56); }.voice-screen-home .voice-widget-day { background:linear-gradient(145deg,#fcfbf9,#e8eaea); color:#bc4540; }
.voice-screen-home .voice-home-apps { gap:8px 3px; margin-top:12px; }.voice-screen-home .voice-home-apps > span { gap:3px; font-size:5px; }
.voice-screen-home .voice-home-apps i,.voice-screen-home .voice-home-dock > span { width:clamp(23px,2.35vw,31px); height:clamp(23px,2.35vw,31px); border-radius:8px; font-size:15px; }
.voice-screen-home .app-facetime { background:#37c873; }.voice-screen-home .app-camera { background:#6c727f; }.voice-screen-home .app-reminders { background:#fbfbfa; color:#4784cc; }.voice-screen-home .app-files { background:#f7f9fa; color:#449bd2; }
.voice-screen-home .app-facetime,.voice-screen-home .app-camera,.voice-screen-home .app-notes,.voice-screen-home .app-reminders,.voice-screen-home .app-clock { position:relative; font-size:0; }
.voice-screen-home .app-facetime::before { content:''; position:absolute; left:25%; top:31%; width:37%; height:38%; border-radius:3px; background:#fff; }.voice-screen-home .app-facetime::after { content:''; position:absolute; right:19%; top:34%; width:19%; height:32%; background:#fff; clip-path:polygon(0 25%,100% 0,100% 100%,0 75%); }
.voice-screen-home .app-camera { background:linear-gradient(145deg,#d6d9dc,#969da5); }.voice-screen-home .app-camera::before { content:''; width:47%; height:47%; border:3px solid #414c55; border-radius:50%; box-shadow:0 0 0 2px #707b83; }
.voice-screen-home .app-photos { background:#fff; color:transparent; font-size:0; }.voice-screen-home .app-photos::before { content:'✿'; font:500 25px/1 'Inter',sans-serif; background:conic-gradient(#ea606f,#f8b761,#e6d46c,#72bc80,#67a9d5,#a788d9,#ea606f); background-clip:text; -webkit-background-clip:text; color:transparent; }
.voice-screen-home .app-notes { background:linear-gradient(#efd164 0 26%,#faf9f4 26%); }.voice-screen-home .app-notes::before { content:''; width:55%; height:2px; margin-top:8px; background:#aab1ab; box-shadow:0 5px #aab1ab,0 10px #aab1ab; }
.voice-screen-home .app-reminders::before { content:'•  ━\A•  ━\A•  ━'; position:absolute; left:19%; top:19%; color:#54a1d5; font-size:8px; line-height:7px; white-space:pre; }
.voice-screen-home .app-clock { background:#f6f7f7; }.voice-screen-home .app-clock::before { content:''; width:65%; height:65%; border:2px solid #3b4246; border-radius:50%; }.voice-screen-home .app-clock::after { content:''; position:absolute; top:30%; left:49%; width:1px; height:31%; background:#262a2d; transform:rotate(37deg); transform-origin:bottom; }
.voice-screen-home .voice-home-dock .app-messages { position:relative; font-size:0; }.voice-screen-home .voice-home-dock .app-messages::before { content:''; width:57%; height:43%; border-radius:50%; background:#fff; }.voice-screen-home .voice-home-dock .app-messages::after { content:''; position:absolute; left:29%; bottom:26%; width:15%; height:14%; background:#fff; transform:rotate(28deg); }
.voice-screen-home .voice-home-pages { margin-top:auto; text-align:center; color:#eff4ff; font-size:7px; letter-spacing:2px; }
.voice-screen-home .voice-home-dock { margin-top:5px; padding:5px 2px; border-radius:12px; background:#dce2e499; }
.voice-screen-assistant { display:flex; flex-direction:column; padding:17% 5% 0; background:linear-gradient(180deg,#373e42 0%,#7f898e 42%,#dce1e3 70%,#fafbfb 71%); color:#fff; text-align:center; }
.voice-assistant-brand { display:flex; align-items:center; justify-content:center; gap:4px; font-size:8px; font-weight:700; }.voice-assistant-brand::first-letter { font-size:12px; }
.voice-screen-assistant h3 { margin:14px 0 5px; color:#fff; font:500 clamp(13px,1.4vw,19px)/1.04 'Inter',sans-serif; letter-spacing:-.02em; }.voice-screen-assistant > p { margin:0; color:#eef2f3; font-size:6px; }
.voice-assistant-prompts { display:grid; grid-template-columns:1fr 1fr; gap:5px; margin-top:13px; }.voice-assistant-prompts span { padding:5px 3px; border-radius:20px; background:#fafbfbef; color:#4e5a60; font-size:5.5px; white-space:nowrap; box-shadow:0 2px 7px #27333b26; }
.voice-assistant-sheet { min-height:43%; margin:auto -11% 0; padding:10px 9px 7px; border-radius:17px 17px 0 0; background:#fcfdfd; color:#303a3e; text-align:left; box-shadow:0 -8px 22px #34414826; }
.voice-assistant-sheet > div:first-child { display:flex; align-items:center; justify-content:space-between; }.voice-assistant-sheet b { font-size:8px; }.voice-assistant-sheet small { color:#8395a0; font-size:6px; }
.voice-assistant-cards { display:grid; grid-template-columns:1fr 1fr; gap:5px; margin-top:8px; }.voice-assistant-cards span { display:flex; flex-direction:column; min-height:77px; padding:8px 6px; border:1px solid #e5e9eb; border-radius:11px; background:#fff; }.voice-assistant-cards i { display:grid; place-items:center; width:21px; height:21px; border-radius:7px; background:#edf0f1; color:#52616a; font-size:10px; font-style:normal; }.voice-assistant-cards b { margin-top:auto; font-size:7px; line-height:1.15; }
.voice-assistant-input { display:flex; justify-content:space-between; align-items:center; margin-top:7px; padding:5px 7px; border:1px solid #e3e8ea; border-radius:14px; color:#96a0a5; font-size:6px; }.voice-assistant-input span { display:grid; place-items:center; width:14px; height:14px; border-radius:50%; background:#303a3f; color:#fff; font-size:9px; }
.voice-call-island { position:absolute; z-index:4; top:6.45%; left:24.2%; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:3px; width:51.6%; height:8.5%; padding:5px 6px; border-radius:999px; background:#030707; color:#fff; text-align:left; box-shadow:0 8px 18px #00180f60; pointer-events:none; }
.voice-call-avatar { display:grid; place-items:center; width:clamp(19px,1.7vw,25px); aspect-ratio:1; border-radius:50%; background:linear-gradient(145deg,#c2d8c4,#658c76); color:#2a4b37; font:600 clamp(7px,.75vw,9px)/1 'Inter',sans-serif; }
.voice-phone-card-two .voice-call-avatar { background:linear-gradient(145deg,#d9c9d8,#a37e9d); color:#5b3d56; }
.voice-phone-card-three .voice-call-avatar { background:linear-gradient(145deg,#e6d5b6,#bd9473); color:#694b37; }
.voice-call-id { display:flex; flex-direction:column; gap:2px; min-width:0; }
.voice-call-id small { color:#9ca9a3; font-size:clamp(5px,.5vw,7px); line-height:1; }
.voice-call-id strong { overflow:hidden; font:500 clamp(7px,.75vw,10px)/1.12 'Inter',sans-serif; text-overflow:ellipsis; white-space:nowrap; }
.voice-island-actions { display:flex; gap:3px; }
.voice-island-actions > span { display:grid; place-items:center; width:clamp(19px,1.7vw,24px); aspect-ratio:1; border-radius:50%; }
.voice-island-actions svg { width:59%; height:59%; fill:#fff; }
.voice-island-decline { background:#f05255; }
.voice-island-answer { background:#49c976; }
.voice-island-answer svg { transform:rotate(180deg); }
.voice-phone-card figcaption { display:grid; gap:5px; margin-top:0; color:#fff; text-shadow:0 2px 9px #000000bd; }
.voice-phone-card figcaption span { color:#e2e6e8; font-size:9px; font-weight:700; letter-spacing:.13em; }
.voice-phone-card figcaption strong { font:500 20px/1.2 'Inter',sans-serif; }
.voice-showcase-note { margin-top:45px; color:#84978a; text-align:center; font-size:10px; }
@media(max-width:950px) {
  .voice-phone-gallery { display:flex; gap:10px; padding-inline:20px; overflow-x:auto; scroll-snap-type:x mandatory; }
  .voice-phone-card { flex:0 0 min(38vw,360px); scroll-snap-align:center; }
  .voice-call-island { gap:3px; padding-inline:6px; }
  .voice-island-actions { gap:3px; }
}
@media(max-width:760px) {
  .voice-showcase-intro { grid-template-columns:1fr; gap:15px; padding-top:40px; }
  .voice-showcase-detail { padding:0; }
  .voice-phone-gallery { display:flex; gap:8px; margin:40px -24px 0; padding:22px max(20px,calc((100vw - 300px)/2)) 24px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:thin; border-radius:24px; }
  .voice-phone-card { flex:0 0 min(79vw,320px); scroll-snap-align:center; }
}
@media(max-width:510px) {
  .voice-phone-gallery { margin-left:-24px; margin-right:-24px; }
  .voice-showcase-note { margin-top:22px; }
}
@media(prefers-reduced-motion:reduce) {
  .voice-phone-card,.voice-phone-card-one,.voice-phone-card-two,.voice-phone-card-three,.voice-phone-gallery.is-near .voice-phone-card { transform:none; transition:none; }
}

/* Light, airy display type with a green gradient on the accent words. */
.saint-services h1,.saint-services h2,.saint-services h3,
.feature-workflow-title strong,.feature-lead-heading strong,.pricing-grid strong { font-family:'Inter',sans-serif; font-weight:300; letter-spacing:-.035em; line-height:1.08; }
.saint-services h3 { font-weight:400; letter-spacing:-.03em; }
.saint-services h1 { font-weight:300; letter-spacing:-.045em; color:#14261d; }
.saint-services :is(h1,h2,h3) em,.feature-workflow-title strong em,.feature-lead-heading strong em { font-family:inherit; font-style:normal; font-weight:inherit; letter-spacing:inherit; padding-right:.04em; background:linear-gradient(100deg,#1f5a3a 0%,#2f7a4e 40%,#4fa06d 75%,#76bf8f 100%); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; }
.saint-services .service-hero h1 em { background-image:linear-gradient(100deg,#1d5236 0%,#357d52 45%,#5fae7d 100%); }
.saint-services .service-closing :is(h1,h2,h3) em { background-image:linear-gradient(100deg,#d8f0c8 0%,#a8e0b6 50%,#7cc9a0 100%); }
.service-intro-heading h2,.pricing-heading h2,.agent-world h2,.approach-grid h2,.faq-layout h2 { font-size:clamp(46px,5.4vw,80px); }
.service-feature-copy h2 { font-size:clamp(44px,4.8vw,70px); }
.service-panel-copy h3,.agent-spotlight-copy h3 { font-size:clamp(36px,3.6vw,54px); }
.service-hero h1 { font-size:clamp(62px,7.4vw,108px); line-height:1.02; }
.service-closing h2 { font-size:clamp(44px,4.8vw,72px); }
@media(max-width:510px) {
  .service-intro-heading h2,.pricing-heading h2,.agent-world h2,.approach-grid h2,.faq-layout h2,.service-feature-copy h2 { font-size:clamp(40px,10vw,54px); }
  .service-hero h1 { font-size:clamp(50px,12vw,64px); }
  .service-panel-copy h3,.agent-spotlight-copy h3 { font-size:36px; }
}

/* AI automation: photo card beside a calm 2x2 feature grid. */
.automation-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); align-items:center; gap:clamp(36px,5vw,80px); padding-top:58px; }
.automation-photo { position:relative; margin:0; min-height:560px; border-radius:26px; overflow:hidden; box-shadow:0 26px 60px #1b3d2b1f; }
.automation-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:46% center; }
.automation-photo-chip { position:absolute; left:20px; right:auto; bottom:20px; display:flex; align-items:center; gap:11px; padding:11px 16px 11px 11px; border-radius:16px; color:#1d3327; animation:ui-float 6s ease-in-out infinite; }
.automation-photo-chip > span:last-child { display:grid; gap:2px; } .automation-photo-chip b { font-size:12px; font-weight:600; } .automation-photo-chip small { font-size:10px; color:#5d7466; }
.automation-copy h2 { margin:20px 0 16px; font-size:clamp(40px,4vw,60px); }
.automation-lede { max-width:470px; color:#5c6d61; font-size:14px; line-height:1.75; }
.automation-features { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:30px 0 30px; }
.automation-features article { padding:20px; border-radius:18px; background:linear-gradient(160deg,#ffffffd9,#f2f8f4b3); border:1px solid #e3ece5; box-shadow:inset 0 1px 0 #fff,0 10px 26px #1b3d2b0d; transition:transform .2s,box-shadow .2s; }
.automation-features article:hover { transform:translateY(-3px); box-shadow:inset 0 1px 0 #fff,0 16px 32px #1b3d2b17; }
.automation-icon { display:grid; place-items:center; width:36px; height:36px; margin-bottom:26px; border-radius:11px; background:#eaf4ed; color:#2f7a4e; font-size:15px; box-shadow:inset 0 0 0 1px #d6e8db; }
.saint-services .automation-features h3 { font-size:16px; font-weight:500; letter-spacing:-.02em; }
.automation-features p { margin-top:6px; color:#6b7d71; font-size:12px; line-height:1.55; }
@media(max-width:900px) { .automation-split { grid-template-columns:1fr; } .automation-photo { min-height:440px; } }
@media(max-width:510px) { .automation-photo { min-height:360px; border-radius:20px; } .automation-features { grid-template-columns:1fr; gap:8px; } .automation-features article { padding:16px; } .automation-icon { margin-bottom:14px; } }
@media(prefers-reduced-motion:reduce) { .automation-photo-chip { animation:none; } }

/* Book a call: bright lime with a grainy, scratched surface. */
.saint-services .cta-lime { position:relative; isolation:isolate; overflow:hidden; border:1px solid #9fd61f; color:#0f2316; background-color:#c8f53c; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.008 .7' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 .97 0 0 0 0 1 0 0 0 0 .8 -4 0 0 0 1.25'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23s)'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .1 0 0 0 0 .2 0 0 0 0 .05 1.4 0 0 0 -.8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),linear-gradient(160deg,#dcff6a 0%,#c4f43a 45%,#a8e324 100%); background-size:180px 180px,120px 120px,100% 100%; box-shadow:inset 0 1px 0 #f4ffc6,inset 0 -2px 0 #8fc21a66,0 8px 22px #9ad41f59; text-shadow:0 1px 0 #e9ff9f80; font-weight:700 !important; }
.saint-services .cta-lime:hover { background-color:#d4ff4f; filter:brightness(1.05) saturate(1.1); box-shadow:inset 0 1px 0 #f4ffc6,inset 0 -2px 0 #8fc21a66,0 12px 28px #9ad41f80; }
.saint-services .cta-lime span { color:inherit; }
/* Fuzzy felt layer on the lime Book a call buttons. */
.saint-services .cta-lime::before { content:''; position:absolute; inset:-1px; z-index:-1; border-radius:inherit; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='turbulence' baseFrequency='.55' numOctaves='4' seed='3'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 .85 0 0 0 1.6 -.55'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E"); background-size:140px 140px; filter:blur(.5px); opacity:.7; mix-blend-mode:soft-light; }
.saint-services .cta-lime { box-shadow:inset 0 1px 0 #f4ffc6,inset 0 -2px 0 #8fc21a66,inset 0 0 6px 1px #f2ffb880,0 0 0 1px #c8f53c59,0 0 10px 1px #c8f53c66,0 8px 22px #9ad41f59; }
.saint-services .cta-lime:hover { box-shadow:inset 0 1px 0 #f4ffc6,inset 0 -2px 0 #8fc21a66,inset 0 0 8px 2px #f2ffb899,0 0 0 1px #c8f53c80,0 0 14px 2px #c8f53c80,0 12px 28px #9ad41f80; }

/* Book a call: deep forest green, keeping the scratched and fuzzy surface. */
.saint-services .cta-lime { border-color:#2c5a3d; color:#f1f8ec; background-color:#1f4a31; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.008 .7' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 .75 0 0 0 0 .9 0 0 0 0 .72 -3 0 0 0 .8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23s)'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .02 0 0 0 0 .08 0 0 0 0 .04 1.4 0 0 0 -.7'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),linear-gradient(160deg,#2f6544 0%,#1f4a31 50%,#163824 100%); text-shadow:0 1px 1px #0a1f1266; box-shadow:inset 0 1px 0 #ffffff26,inset 0 -2px 0 #0b1f1259,inset 0 0 6px 1px #8fc29f26,0 0 0 1px #1f4a3133,0 8px 22px #12301f40; }
.saint-services .cta-lime:hover { background-color:#265a3c; filter:brightness(1.08); box-shadow:inset 0 1px 0 #ffffff33,inset 0 -2px 0 #0b1f1259,inset 0 0 8px 2px #8fc29f33,0 0 0 1px #1f4a3159,0 12px 28px #12301f59; }
.saint-services .cta-lime::before { opacity:.45; }

/* Green gradient flow between sections (full-bleed backgrounds behind the content column). */
:root { --flow-mint:#eaf5ec; --flow-mid:#a9d8b4; --flow-deep:#3d8458; }
.service-hero { border:0; border-radius:0; }
.service-hero::after { content:''; position:absolute; left:0; right:0; bottom:0; height:42%; z-index:1; pointer-events:none; background:linear-gradient(180deg,#eaf5ec00 0%,#eaf5ec8c 45%,#eaf5ece6 78%,var(--flow-mint) 100%); }
.service-hero-bottom { color:#2c4a38; text-shadow:none; }
#automation,#voice-receptionist,#approach,#faq,.service-footer { position:relative; isolation:isolate; }
#automation::before,#voice-receptionist::before,#approach::before,#faq::before,.service-footer::before { content:''; position:absolute; z-index:-1; top:0; bottom:0; left:50%; width:100vw; transform:translateX(-50%); pointer-events:none; }
#automation::before { background:linear-gradient(180deg,var(--flow-mint) 0%,#f4faf5 28%,#fff 55%); }
#voice-receptionist::before { background:linear-gradient(180deg,#fff 0%,#fff 62%,#eef7f0 76%,var(--flow-mid) 90%,var(--flow-deep) 100%); }
#approach::before { background:linear-gradient(180deg,var(--flow-deep) 0%,var(--flow-mid) 6%,#e6f3e9 14%,#fff 30%); }
#faq::before { background:linear-gradient(180deg,#fff 0%,#fff 55%,var(--flow-mint) 100%); }
.service-closing { box-shadow:0 0 0 100vw var(--flow-mint); clip-path:inset(-30px -100vw 0 -100vw); }
.service-footer::before { background:linear-gradient(180deg,var(--flow-mint) 0%,#fff 45%); }

/* Pricing plan board: three plans, a testimonial, and a closing call to action. */
.plan-section { padding-bottom:110px; }
.plan-intro { display:flex; flex-direction:column; align-items:center; text-align:center; margin:70px auto 54px; max-width:640px; }
.plan-mark { width:10px; height:10px; border-radius:3px; background:linear-gradient(135deg,#4fa06d,#1f5a3a); box-shadow:0 0 0 5px #4fa06d1f; margin-bottom:26px; }
.saint-services .plan-intro h2 { font-size:clamp(40px,4.4vw,62px); }
.plan-intro p { margin-top:18px; max-width:470px; color:var(--s-muted); font-size:14px; line-height:1.7; }
.plan-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; align-items:start; }
.plan-card { position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; padding:28px 26px 26px; border-radius:24px; color:#14261d; }
.plan-card-featured { background:linear-gradient(170deg,#ffffffeb,#f3faf5d9); border:1px solid #ffffff; box-shadow:inset 0 1px 0 #fff,0 0 0 6px #e8f3eb,0 26px 60px #1b3d2b1f; -webkit-backdrop-filter:blur(20px) saturate(1.5); backdrop-filter:blur(20px) saturate(1.5); }
.plan-card-featured::before,.plan-card-dark::before,.plan-cta::before { content:''; position:absolute; z-index:-1; top:0; right:0; width:70%; height:46%; pointer-events:none; background-image:radial-gradient(circle,#4fa06d 1.1px,transparent 1.6px); background-size:7px 7px; -webkit-mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); opacity:.55; }
.plan-card-dark { background:radial-gradient(circle at 85% 0%,#1f4a31 0%,transparent 55%),linear-gradient(170deg,#12291d,#0a1a12); color:#eef6ef; box-shadow:0 26px 60px #0a1f1240; }
.plan-card-dark::before,.plan-cta::before { background-image:radial-gradient(circle,#7cc495 1.1px,transparent 1.6px); opacity:.45; }
.plan-icon { display:grid; place-items:center; width:44px; height:36px; margin-bottom:22px; border-radius:12px; background:#14261d; color:#e7f6e9; font-size:15px; box-shadow:0 8px 18px #14261d33; }
.plan-icon-light { background:#f3faf4; color:#1f4a31; box-shadow:0 8px 18px #00000040; }
.saint-services .plan-card h3 { display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:24px; font-weight:400; }
.plan-badge { padding:4px 10px; border-radius:100px; background:#4fa06d33; color:#a8e0b8; font:600 10px/1.2 'Inter',sans-serif; letter-spacing:0; }
.plan-badge-light { background:#e3f3e7; color:#2f6b46; }
.plan-desc { margin-top:9px; min-height:58px; color:#5c6d61; font-size:13px; line-height:1.55; }
.plan-card-dark .plan-desc,.plan-cta p { color:#a9c2b1; }
.plan-price { display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; margin:26px 0 22px; }
.plan-price strong { font:400 32px/1 'Inter',sans-serif; letter-spacing:-.035em; }
.plan-price small { color:#6b7d71; font-size:12px; }
.plan-card-dark .plan-price small { color:#9db8a6; }
.plan-button { width:100%; min-height:48px; border-radius:100px; font-size:14px !important; font-weight:600 !important; transition:transform .2s,box-shadow .2s,filter .2s; }
.plan-button:hover { transform:translateY(-2px); filter:brightness(1.06); }
.plan-button-dark { border:0; background:#14261d; color:#fff; box-shadow:0 10px 22px #14261d33; }
.plan-button-green { border:1px solid #2c5a3d; background:linear-gradient(160deg,#3f8a5c,#1f4a31); color:#f1f8ec; box-shadow:inset 0 1px 0 #ffffff33,0 12px 26px #1f4a3159; }
.plan-button-light { border:0; background:#f3faf4; color:#12291d; box-shadow:0 10px 22px #00000033; }
.plan-features { display:grid; gap:11px; margin:24px 0 0; padding:0; list-style:none; font-size:12.5px; color:#3f5548; }
.plan-features li { display:flex; align-items:center; gap:10px; }
.plan-features i { flex:none; width:16px; color:#4f8f65; font-style:normal; text-align:center; font-size:12px; }
.plan-card-dark .plan-features { color:#d7e7dc; } .plan-card-dark .plan-features i { color:#8fd0a3; }
.plan-addon { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:24px; padding:14px 16px; border-radius:16px; }
.plan-addon span:first-child { display:grid; gap:3px; } .plan-addon b { font-size:12.5px; font-weight:600; } .plan-addon small { color:#4f8f65; font-size:11px; }
.plan-toggle { width:36px; height:20px; padding:2px; border-radius:20px; background:#d9e6dc; } .plan-toggle i { display:block; width:16px; height:16px; border-radius:50%; background:#fff; box-shadow:0 1px 3px #0003; }
.plan-bottom { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:16px; margin-top:16px; }
.plan-quote { padding:30px 32px; border-radius:24px; background:linear-gradient(170deg,#ffffffeb,#f3faf5d9); border:1px solid #fff; box-shadow:inset 0 1px 0 #fff,0 0 0 6px #e8f3eb,0 20px 50px #1b3d2b14; }
.plan-quote-mark { display:block; height:26px; color:#3f8a5c; font:400 54px/1 Georgia,serif; }
.plan-quote-stat { margin-top:12px; font:400 28px/1.1 'Inter',sans-serif; letter-spacing:-.03em; color:#14261d; }
.plan-quote-sub { margin-top:4px; color:#5c6d61; font-size:14px; }
.plan-quote blockquote { margin:18px 0 22px; max-width:620px; color:#3f5548; font-size:13.5px; line-height:1.7; }
.plan-quote footer { display:flex; align-items:center; gap:12px; }
.plan-quote-avatar { display:grid; place-items:center; width:44px; height:44px; border-radius:14px; background:linear-gradient(145deg,#cfe9d6,#8fc9a1); color:#14261d; font-size:13px; font-weight:700; box-shadow:0 0 0 3px #fff,0 6px 14px #1b3d2b26; }
.plan-quote footer span:last-child { display:grid; gap:2px; } .plan-quote footer b { font-size:14px; font-weight:600; } .plan-quote footer small { color:#6b7d71; font-size:12px; }
.plan-cta { position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; padding:30px 28px 28px; border-radius:24px; color:#eef6ef; background:radial-gradient(circle at 90% 100%,#2c6a45 0%,transparent 55%),linear-gradient(170deg,#12291d,#0a1a12); box-shadow:0 26px 60px #0a1f1240; }
.plan-cta::before { top:auto; bottom:0; -webkit-mask-image:radial-gradient(ellipse at 100% 100%,#000 0%,#0008 35%,transparent 72%); mask-image:radial-gradient(ellipse at 100% 100%,#000 0%,#0008 35%,transparent 72%); }
.saint-services .plan-cta h3 { font-size:28px; font-weight:400; line-height:1.12; }
.saint-services .plan-cta h3 em { background-image:linear-gradient(100deg,#d8f0c8,#8fd3a5); }
.plan-cta p { margin:14px 0 24px; font-size:13px; line-height:1.6; }
.plan-cta .plan-button { margin-top:auto; width:auto; align-self:flex-start; padding:0 26px; }
.service-plans-page .plan-section { padding-top:40px; }
@media(max-width:1000px) { .plan-grid { grid-template-columns:1fr 1fr; } .plan-card-dark { grid-column:1/-1; } .plan-bottom { grid-template-columns:1fr; } }
@media(max-width:640px) { .plan-grid { grid-template-columns:1fr; } .plan-desc { min-height:0; } .plan-quote { padding:24px 22px; } .plan-intro { margin:50px auto 38px; } }

/* No divider lines between sections; the section labels stay. */
.section-topline,.agent-world .section-topline { border-top:0; padding-top:0; }
.saint-services .plan-intro p { margin-top:18px; }
.saint-services .plan-desc { margin-top:9px; }
.saint-services .plan-price { margin:28px 0 22px; }
.saint-services .plan-quote-stat { margin-top:12px; }
.saint-services .plan-quote-sub { margin-top:4px; }
.saint-services .plan-cta p { margin:14px 0 24px; }

/* Homepage hero: photo of a business owner on a call, text on the left. */
.saint-services:not(.service-plans-page) .service-hero-landscape { background:url('/assets/home/hero-desk-call.jpg') 70% 35%/cover no-repeat; }
.saint-services:not(.service-plans-page) .service-hero { text-align:left; min-height:780px; }
.saint-services:not(.service-plans-page) .service-hero::before { background:linear-gradient(90deg,#f3faf5f2 0%,#f1f9f3d9 30%,#eef7f08c 48%,#eef7f000 66%); }
.saint-services:not(.service-plans-page) .service-hero-content { width:min(620px,52%); margin:0 0 0 clamp(28px,6vw,110px); padding:210px 0 150px; text-align:left; }
.saint-services:not(.service-plans-page) .service-hero h1 { margin:0 0 22px; font-size:clamp(60px,6.4vw,96px); }
.saint-services:not(.service-plans-page) .service-hero-lede { margin:0 !important; max-width:470px; color:#33493d; }
.saint-services:not(.service-plans-page) .service-hero-actions { justify-content:flex-start; }
@media(max-width:760px) {
  .saint-services:not(.service-plans-page) .service-hero { text-align:center; min-height:820px; }
  .saint-services:not(.service-plans-page) .service-hero-landscape { background-position:74% center; }
  .saint-services:not(.service-plans-page) .service-hero::before { background:linear-gradient(180deg,#f3faf5f5 0%,#f1f9f3e6 42%,#eef7f080 62%,#eef7f000 78%); }
  .saint-services:not(.service-plans-page) .service-hero-content { width:calc(100% - 40px); margin:0 auto; padding:140px 0 0; text-align:center; }
  .saint-services:not(.service-plans-page) .service-hero h1 { font-size:clamp(50px,11vw,72px); }
  .saint-services:not(.service-plans-page) .service-hero-lede { margin:0 auto !important; }
  .saint-services:not(.service-plans-page) .service-hero-actions { justify-content:center; }
}

/* AI automation illustration: apps flow into the Saint hub and out as finished work. */
.automation-illo { display:grid; place-items:center; padding:24px; }
.illo-canvas { position:relative; width:100%; max-width:600px; aspect-ratio:600/560; }
.illo-lines { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.illo-lines path { fill:none; stroke:url(#illoStroke); stroke-width:2; stroke-dasharray:5 7; animation:illo-flow 1.6s linear infinite; }
.illo-dots circle { fill:#2f7a4e; filter:drop-shadow(0 0 4px #7cc495); }
@keyframes illo-flow { to { stroke-dashoffset:-24; } }
.illo-app,.illo-out,.illo-hub,.illo-hub-label { position:absolute; transform:translate(-50%,-50%); }
.illo-app { display:grid; place-items:center; gap:4px; width:clamp(58px,13%,78px); aspect-ratio:1; border-radius:20px; color:#1d3327; }
.illo-app i { font-style:normal; font-size:clamp(16px,2.6vw,22px); color:#2f7a4e; line-height:1; }
.illo-app small { font-size:10px; font-weight:600; color:#4c6455; }
.illo-hub { display:grid; place-items:center; width:clamp(84px,20%,118px); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 32% 28%,#8fd3a5,#3f8a5c 55%,#1f4a31); box-shadow:inset 0 2px 6px #ffffff59,0 0 0 8px #ffffff66,0 18px 40px #1f4a3159; color:#fff; }
.illo-hub b { position:relative; z-index:1; font-size:clamp(26px,4vw,38px); font-weight:400; }
.illo-ring { position:absolute; inset:-14px; border-radius:50%; border:1.5px solid #3f8a5c55; animation:illo-ring 3s ease-out infinite; }
.illo-ring-2 { animation-delay:1.5s; }
@keyframes illo-ring { from { transform:scale(.9); opacity:1; } to { transform:scale(1.45); opacity:0; } }
.illo-hub-label { padding:5px 12px; border-radius:100px; background:#ffffffcc; color:#1f4a31; font-size:11px; font-weight:600; white-space:nowrap; box-shadow:0 4px 12px #1b3d2b14; }
.illo-out { display:flex; align-items:center; gap:7px; padding:9px 12px 9px 9px; border-radius:14px; color:#1d3327; font-size:11.5px; font-weight:600; white-space:nowrap; }
.illo-out i { display:grid; place-items:center; width:22px; height:22px; border-radius:7px; background:linear-gradient(145deg,#3f7a54,#285539); color:#fff; font-style:normal; font-size:11px; }
@media(max-width:510px) { .automation-illo { padding:10px; } .illo-out { padding:6px 8px 6px 6px; font-size:9.5px; gap:5px; } .illo-out i { width:18px; height:18px; } .illo-app small { font-size:8.5px; } .illo-hub-label { font-size:9.5px; } }
@media(prefers-reduced-motion:reduce) { .illo-lines path,.illo-ring { animation:none; } .illo-dots { display:none; } }

/* Warmer automation illustration: moving gradient, Saint mascot hub, colourful apps. */
.automation-illo.glass-stage { background:linear-gradient(125deg,#f8ecd6,#e3f1df,#fbdcc4,#d8ecdd,#f6e7c3,#e6f2e2); background-size:320% 320%; animation:illo-bg 16s ease-in-out infinite alternate; box-shadow:0 26px 60px #6b4a1f1f,inset 0 1px 0 #fff8; }
@keyframes illo-bg { 0% { background-position:0% 30%; } 50% { background-position:100% 60%; } 100% { background-position:40% 100%; } }
.automation-illo.glass-stage::before { width:52%; left:-10%; bottom:-14%; background:radial-gradient(circle at 35% 35%,#ffd59a,#f0a45d); opacity:.55; filter:blur(30px); animation:illo-drift-a 18s ease-in-out infinite alternate; }
.automation-illo.glass-stage::after { width:44%; right:-6%; top:-8%; background:radial-gradient(circle at 35% 35%,#b7e2c2,#5fae7d); opacity:.5; filter:blur(30px); animation:illo-drift-b 20s ease-in-out infinite alternate; }
@keyframes illo-drift-a { to { transform:translate(38%,-30%) scale(1.15); } }
@keyframes illo-drift-b { to { transform:translate(-40%,34%) scale(.9); } }
.illo-dots circle { fill:#e39a3b; filter:drop-shadow(0 0 5px #f6c477); }
.illo-hub { background:radial-gradient(circle at 34% 28%,#fffaf0,#fde9b8 48%,#f2c66b 100%); box-shadow:inset 0 2px 8px #ffffffb3,inset 0 -6px 14px #d9963a40,0 0 0 8px #fff5e080,0 0 50px #f5c46f73,0 18px 40px #8a5a1a33; }
.illo-hub img { position:relative; z-index:1; width:62%; height:auto; filter:drop-shadow(0 4px 6px #8a5a1a40); animation:illo-bob 4.5s ease-in-out infinite; }
@keyframes illo-bob { 50% { translate:0 -3px; rotate:-4deg; } }
.illo-ring { border-color:#e9b45f80; }
.illo-hub-label { background:#fffaf0e6; color:#6b4a1f; }
.illo-app { border-radius:22px; animation:ui-float 6s ease-in-out infinite; }
.illo-app-forms { animation-delay:-2s; } .illo-app-crm { animation-delay:-4s; }
.illo-app i { display:grid; place-items:center; width:32px; height:32px; border-radius:10px; color:#fff; font-size:15px; box-shadow:0 6px 12px #0000001f; }
.illo-app-email i { background:linear-gradient(145deg,#f39a7b,#e0644a); }
.illo-app-forms i { background:linear-gradient(145deg,#f7c96a,#e39a2e); }
.illo-app-crm i { background:linear-gradient(145deg,#7cc4a0,#3f8a6c); }
.illo-badge { position:absolute; top:-6px; right:-6px; display:grid; place-items:center; min-width:20px; height:20px; padding:0 5px; border-radius:20px; background:#e0644a; color:#fff; font:700 10px/1 'Inter',sans-serif; font-style:normal; box-shadow:0 0 0 2px #fff,0 4px 8px #e0644a59; }
.illo-out { align-items:center; animation:ui-float 7s ease-in-out infinite; }
.illo-out:nth-of-type(2n) { animation-delay:-3s; }
.illo-out > span { display:grid; gap:1px; line-height:1.2; } .illo-out small { font-size:9.5px; font-weight:500; color:#7a6a55; }
.illo-out i { background:linear-gradient(145deg,#3f8a5c,#285539); }
.illo-status { position:absolute; transform:translate(-50%,-50%); display:flex; align-items:center; gap:7px; padding:6px 12px; border-radius:100px; color:#2f5d40; font-size:10.5px; font-weight:600; white-space:nowrap; }
.illo-status i { width:7px; height:7px; border-radius:50%; background:#3fa36a; box-shadow:0 0 0 3px #3fa36a33; animation:ui-pulse 1.6s ease-in-out infinite; }
@media(max-width:510px) { .illo-app i { width:24px; height:24px; font-size:12px; border-radius:8px; } .illo-badge { min-width:16px; height:16px; font-size:8px; } .illo-out small { display:none; } .illo-status { font-size:9px; } }
@media(prefers-reduced-motion:reduce) { .automation-illo.glass-stage,.automation-illo.glass-stage::before,.automation-illo.glass-stage::after,.illo-hub img,.illo-app,.illo-out,.illo-status i { animation:none; } }
.saint-services .illo-badge { font:700 10px/1 'Inter',sans-serif; letter-spacing:0; color:#fff; }

/* Real app marks on the input tiles; clear status icons on the results. */
.illo-app i.illo-logo { width:34px; height:34px; border-radius:10px; background:#fff; box-shadow:0 4px 10px #1b3d2b1a,inset 0 0 0 1px #0000000d; }
.illo-logo svg { width:22px; height:22px; } .illo-logo-wide svg { width:28px; height:20px; }
.illo-app small { white-space:nowrap; }
.illo-out i.illo-ico { position:relative; width:26px; height:26px; background:none; box-shadow:0 4px 10px #0000001f; }
.illo-ico svg { width:16px; height:16px; }
.illo-ico-check { border-radius:50% !important; background:linear-gradient(145deg,#34d36b,#16a34a) !important; box-shadow:0 0 0 3px #22c55e33,0 4px 10px #16a34a59 !important; }
.illo-ico-mail { border-radius:8px !important; background:linear-gradient(145deg,#f6b65a,#e58b2a) !important; }
.illo-ico-msg { border-radius:8px !important; background:linear-gradient(145deg,#7d8cff,#5b6cf0) !important; }
.saint-services .illo-badge-sm { top:-7px; right:-7px; min-width:15px; height:15px; padding:0 3px; font-size:8.5px; }
@media(max-width:510px) { .illo-app i.illo-logo { width:26px; height:26px; } .illo-logo svg { width:17px; height:17px; } .illo-logo-wide svg { width:22px; height:16px; } .illo-out i.illo-ico { width:20px; height:20px; } .illo-ico svg { width:13px; height:13px; } .illo-app small { font-size:7.5px; } }
.illo-app { width:clamp(64px,15%,90px); }
.illo-app small { font-size:9.5px; }
.illo-out { gap:10px; }
.saint-services .illo-badge-sm { right:auto; left:-7px; }

/* Type matched to the Stacker reference: Inter throughout, medium headings with tight tracking. */
.saint-services { font-family:'Inter',system-ui,sans-serif; }
.saint-services h1,.saint-services h2,.saint-services h3,.feature-lead-heading strong,.plan-price strong,.plan-quote-stat { font-family:'Inter',system-ui,sans-serif; font-weight:500; letter-spacing:-.045em; line-height:1.04; }
.saint-services h1 { letter-spacing:-.05em; }
.saint-services h3 { letter-spacing:-.03em; line-height:1.15; }
.saint-services .automation-features h3 { font-weight:600; letter-spacing:-.02em; }
.saint-services p,.saint-services li { letter-spacing:-.005em; }
.service-hero-bottom { justify-content:flex-end; }

/* How it works: a simple numbered path beside a video-call photo. */
.steps-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); align-items:center; gap:clamp(36px,5vw,80px); }
.saint-services .steps-copy h2 { margin:20px 0 14px; font-size:clamp(40px,4.2vw,60px); }
.saint-services .steps-lede { max-width:460px; color:var(--s-muted); font-size:15px; line-height:1.65; }
.steps-list { list-style:none; margin:30px 0 32px; padding:0; display:grid; gap:10px; counter-reset:none; }
.steps-list li { display:grid; grid-template-columns:44px 1fr; gap:14px; align-items:start; padding:16px 18px; border-radius:18px; background:linear-gradient(160deg,#ffffffe6,#f3faf5c7); border:1px solid #e3ece5; box-shadow:inset 0 1px 0 #fff,0 8px 22px #1b3d2b0d; transition:transform .2s,box-shadow .2s; }
.steps-list li:hover { transform:translateX(4px); box-shadow:inset 0 1px 0 #fff,0 12px 28px #1b3d2b17; }
.steps-num { display:grid; place-items:center; width:44px; height:44px; border-radius:14px; background:linear-gradient(145deg,#e6f5ea,#cfeada); color:#1f6a40; font-size:13px; font-weight:700; box-shadow:inset 0 0 0 1px #c3e3cd; }
.steps-list li:first-child .steps-num { background:linear-gradient(145deg,#2fbf6b,#13874a); color:#fff; box-shadow:0 6px 14px #16a34a40; }
.saint-services .steps-list h3 { font-size:17px; font-weight:600; letter-spacing:-.02em; }
.saint-services .steps-list p { margin-top:4px; color:#5f7066; font-size:13px; line-height:1.55; }
.steps-photo { position:relative; margin:0; min-height:560px; border-radius:26px; overflow:hidden; box-shadow:0 26px 60px #1b3d2b26; }
.steps-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:60% center; }
@media(max-width:900px) { .steps-split { grid-template-columns:1fr; } .steps-photo { min-height:380px; order:-1; } }
@media(max-width:510px) { .steps-photo { min-height:280px; border-radius:20px; } .steps-list li { grid-template-columns:36px 1fr; padding:14px; } .steps-num { width:36px; height:36px; border-radius:11px; } }

/* Book a call: a brighter emerald that still sits in the forest palette. */
.saint-services .cta-lime { border-color:#1d8a4c; color:#fff; background-color:#1f9a55; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .02 0 0 0 0 .2 0 0 0 0 .08 1.3 0 0 0 -.75'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),linear-gradient(160deg,#34c472 0%,#1f9a55 52%,#16793f 100%); background-size:120px 120px,100% 100%; text-shadow:0 1px 1px #0a3d1f59; box-shadow:inset 0 1px 0 #ffffff4d,inset 0 -2px 0 #0b3d1f40,0 0 0 1px #1f9a5533,0 8px 22px #1f9a5559; }
.saint-services .cta-lime:hover { background-color:#25a95e; filter:brightness(1.06); box-shadow:inset 0 1px 0 #ffffff59,inset 0 -2px 0 #0b3d1f40,0 0 0 4px #34c47233,0 12px 28px #1f9a5573; }
.saint-services .cta-lime::before { opacity:.3; }
.cta-pop { min-height:52px; padding:0 30px; }
.steps-photo { min-height:500px; }
.steps-photo img { object-position:52% center; }

/* Voice receptionist: a soft green wash at the top that fades into white. */
#lead-generation { position:relative; isolation:isolate; }
#lead-generation::before { content:''; position:absolute; z-index:-1; top:0; bottom:0; left:50%; width:100vw; transform:translateX(-50%); pointer-events:none; background:linear-gradient(180deg,#fff 0%,#fff 70%,#dff0e4 100%); }
#voice-receptionist::before { background:linear-gradient(180deg,#dff0e4 0%,#eef7f0 10%,#fff 24%,#fff 62%,#eef7f0 76%,var(--flow-mid) 90%,var(--flow-deep) 100%); }

/* Saint illustration card: clean white at the top, fading into the warm moving colours below. */
.automation-illo.glass-stage { background-image:linear-gradient(180deg,#ffffff 0%,#fffffff2 22%,#ffffffa6 46%,#ffffff00 78%),linear-gradient(125deg,#f8ecd6,#e3f1df,#fbdcc4,#d8ecdd,#f6e7c3,#e6f2e2); background-size:100% 100%,320% 320%; animation:illo-bg-2 16s ease-in-out infinite alternate; border:1px solid #eef3ee; }
@keyframes illo-bg-2 { 0% { background-position:0 0,0% 30%; } 50% { background-position:0 0,100% 60%; } 100% { background-position:0 0,40% 100%; } }
.automation-illo.glass-stage::before { top:auto; bottom:-18%; left:-10%; }
.automation-illo.glass-stage::after { top:auto; bottom:-16%; right:-8%; }
@keyframes illo-drift-a { to { transform:translate(55%,-8%) scale(1.12); } }
@keyframes illo-drift-b { to { transform:translate(-60%,-6%) scale(.92); } }

/* Automation feature cards share the pricing plan card design. */
.automation-features { gap:16px; }
.automation-features article { position:relative; isolation:isolate; overflow:hidden; padding:24px 22px 22px; border-radius:24px; border:1px solid #fff; background:linear-gradient(170deg,#ffffffeb,#f3faf5d9); box-shadow:inset 0 1px 0 #fff,0 0 0 6px #e8f3eb,0 20px 44px #1b3d2b14; -webkit-backdrop-filter:blur(20px) saturate(1.5); backdrop-filter:blur(20px) saturate(1.5); }
.automation-features article:hover { transform:translateY(-3px); box-shadow:inset 0 1px 0 #fff,0 0 0 6px #e3f1e7,0 26px 52px #1b3d2b1f; }
.automation-features article::before { content:''; position:absolute; z-index:-1; top:0; right:0; width:60%; height:60%; pointer-events:none; background-image:radial-gradient(circle,#4fa06d 1.1px,transparent 1.6px); background-size:7px 7px; -webkit-mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); opacity:.45; }
.automation-icon { width:44px; height:36px; margin-bottom:20px; border-radius:12px; background:#14261d; color:#e7f6e9; font-size:15px; box-shadow:0 8px 18px #14261d33; }
.saint-services .automation-features h3 { font-size:22px; font-weight:400; letter-spacing:-.03em; line-height:1.15; }
.saint-services .automation-features p { margin-top:8px; color:#5c6d61; font-size:13px; line-height:1.55; }

/* Automation cards: clean line icons with no badge behind them. */
.automation-icon { display:block; width:auto; height:auto; margin-bottom:18px; padding:0; border-radius:0; background:none; box-shadow:none; color:#2a7a4b; }
.automation-icon svg { display:block; width:34px; height:34px; }

/* Every Book a call button: solid black. */
.saint-services .cta-lime { border:1px solid #0d0f0e; color:#fff; background:#111312; background-image:none; text-shadow:none; box-shadow:0 8px 20px #0000002e; filter:none; }
.saint-services .cta-lime:hover { background:#262a28; background-image:none; filter:none; box-shadow:0 12px 26px #00000040; }
.saint-services .cta-lime::before { display:none; }
.saint-services .plan-button[data-open="demo"] { border:0; background:#111312; color:#fff; box-shadow:0 10px 22px #0000002e; }
.saint-services .plan-card-dark .plan-button[data-open="demo"] { background:#fff; color:#111312; }
.automation-icon { text-align:left; } .automation-icon svg { margin:0 !important; }
.automation-icon { display:flex !important; justify-content:flex-start; width:auto; }

/* Illustration connector lines: darker and a little thicker. */
.illo-lines path { stroke:#1d2a22 !important; stroke-width:2.6; stroke-dasharray:6 6; opacity:.78; }

/* How it works steps: pricing-card design, kept as a vertical list. */
.steps-list { gap:14px; }
.steps-list li { position:relative; isolation:isolate; overflow:hidden; grid-template-columns:44px 1fr; gap:16px; align-items:center; padding:18px 22px; border-radius:24px; border:1px solid #fff; background:linear-gradient(170deg,#ffffffeb,#f3faf5d9); box-shadow:inset 0 1px 0 #fff,0 0 0 6px #e8f3eb,0 18px 40px #1b3d2b12; -webkit-backdrop-filter:blur(20px) saturate(1.5); backdrop-filter:blur(20px) saturate(1.5); }
.steps-list li:hover { transform:translateX(4px); box-shadow:inset 0 1px 0 #fff,0 0 0 6px #e3f1e7,0 24px 48px #1b3d2b1c; }
.steps-list li::before { content:''; position:absolute; z-index:-1; top:0; right:0; width:45%; height:100%; pointer-events:none; background-image:radial-gradient(circle,#4fa06d 1.1px,transparent 1.6px); background-size:7px 7px; -webkit-mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); opacity:.45; }
.steps-num,.steps-list li:first-child .steps-num { width:44px; height:36px; border-radius:12px; background:#14261d; color:#e7f6e9; font-size:13px; font-weight:600; box-shadow:0 8px 18px #14261d33; }
.saint-services .steps-list h3 { font-size:20px; font-weight:400; letter-spacing:-.03em; line-height:1.15; }
.saint-services .steps-list p { margin-top:5px; color:#5c6d61; font-size:13px; line-height:1.55; }

/* Steps darken as the journey progresses: light → pale green → sage → dark forest. */
.steps-list li:nth-child(2) { background:linear-gradient(170deg,#eef8f0f2,#dff0e4e6); border-color:#f4fbf5; }
.steps-list li:nth-child(3) { background:linear-gradient(170deg,#9fd0ad,#6faf84); border-color:#b5dcc0; box-shadow:inset 0 1px 0 #ffffff59,0 0 0 6px #d6ebdc,0 18px 40px #1b3d2b1f; }
.steps-list li:nth-child(4) { background:radial-gradient(circle at 85% 0%,#1f4a31 0%,transparent 55%),linear-gradient(170deg,#12291d,#0a1a12); border-color:#1f3b2b; box-shadow:0 0 0 6px #cfe5d6,0 22px 46px #0a1f1240; }
.steps-list li:nth-child(3) h3 { color:#0f2a1a; } .steps-list li:nth-child(3) p { color:#1f4430; }
.steps-list li:nth-child(3)::before { background-image:radial-gradient(circle,#ffffff 1.1px,transparent 1.6px); opacity:.35; }
.steps-list li:nth-child(4) h3 { color:#eef6ef; } .steps-list li:nth-child(4) p { color:#a9c2b1; }
.steps-list li:nth-child(4)::before { background-image:radial-gradient(circle,#7cc495 1.1px,transparent 1.6px); }
.steps-list li:nth-child(4) .steps-num { background:#f3faf4; color:#12291d; box-shadow:0 8px 18px #00000040; }

/* Closing card: the same green dot texture as the dark pricing card. */
.service-closing { isolation:isolate; }
.service-closing::after { content:''; position:absolute; z-index:0; top:0; right:0; width:55%; height:70%; pointer-events:none; background-image:radial-gradient(circle,#7cc495 1.2px,transparent 1.7px); background-size:8px 8px; -webkit-mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); opacity:.5; }
.service-closing::before { content:''; position:absolute; z-index:0; bottom:0; left:0; width:45%; height:60%; pointer-events:none; background-image:radial-gradient(circle,#7cc495 1.2px,transparent 1.7px); background-size:8px 8px; -webkit-mask-image:radial-gradient(ellipse at 0% 100%,#000 0%,#0008 35%,transparent 72%); mask-image:radial-gradient(ellipse at 0% 100%,#000 0%,#0008 35%,transparent 72%); opacity:.35; }
.service-closing > div:first-child { position:relative; z-index:2; }

/* Voice phone panel: the same green dot pattern over its dark gradient. */
.voice-phone-gallery { position:relative; isolation:isolate; }
.voice-phone-gallery::before,.voice-phone-gallery::after { content:''; position:absolute; z-index:0; pointer-events:none; background-image:radial-gradient(circle,#7cc495 1.2px,transparent 1.7px); background-size:8px 8px; }
.voice-phone-gallery::before { top:0; right:0; width:55%; height:65%; border-top-right-radius:inherit; -webkit-mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 35%,transparent 72%); opacity:.5; }
.voice-phone-gallery::after { bottom:0; left:0; width:45%; height:55%; border-bottom-left-radius:inherit; -webkit-mask-image:radial-gradient(ellipse at 0% 100%,#000 0%,#0008 35%,transparent 72%); mask-image:radial-gradient(ellipse at 0% 100%,#000 0%,#0008 35%,transparent 72%); opacity:.35; }
.voice-phone-gallery > * { position:relative; z-index:1; }

/* Saint illustration card: green dots that fade out under the white top. */
.automation-illo.glass-stage { background-image:linear-gradient(180deg,#ffffff 0%,#fffffff2 22%,#ffffffa6 46%,#ffffff00 78%),radial-gradient(circle,#3f8a5c4d 1.2px,transparent 1.7px),linear-gradient(125deg,#f8ecd6,#e3f1df,#fbdcc4,#d8ecdd,#f6e7c3,#e6f2e2); background-size:100% 100%,8px 8px,320% 320%; animation:illo-bg-3 16s ease-in-out infinite alternate; }
@keyframes illo-bg-3 { 0% { background-position:0 0,0 0,0% 30%; } 50% { background-position:0 0,0 0,100% 60%; } 100% { background-position:0 0,0 0,40% 100%; } }

/* Saint illustration card: green gradient matching the page body. */
.automation-illo.glass-stage { background-image:linear-gradient(180deg,#ffffff 0%,#fffffff2 22%,#ffffffa6 46%,#ffffff00 78%),radial-gradient(circle,#3f8a5c4d 1.2px,transparent 1.7px),linear-gradient(125deg,#eaf5ec,#cfe9d6,#e3f2e6,#b9dfc4,#dcefe1,#c6e6cf); }
.automation-illo.glass-stage::before { background:radial-gradient(circle at 35% 35%,#b9e3c5,#5fae7d); opacity:.5; }
.automation-illo.glass-stage::after { background:radial-gradient(circle at 35% 35%,#d6efdc,#3f8a5c); opacity:.4; }
.illo-hub { background:radial-gradient(circle at 34% 28%,#ffffff,#e6f5ea 48%,#a9d8b4 100%); box-shadow:inset 0 2px 8px #ffffffb3,inset 0 -6px 14px #3f8a5c33,0 0 0 8px #ffffff80,0 0 50px #7cc49566,0 18px 40px #1f4a3133; }
.illo-ring { border-color:#5fae7d66; }
.illo-dots circle { fill:#2f7a4e; filter:drop-shadow(0 0 5px #7cc495); }

/* Liquid-glass nav indicator. */
.service-nav-pill { position:relative; }
.service-nav-item.is-active,.service-nav-item[aria-current="page"] { background:none; box-shadow:none; }
.service-nav-pill .service-nav-item:hover { background:none; }
.service-nav-pill .service-nav-item > span { display:inline-block; transition:transform .35s cubic-bezier(.34,1.56,.64,1),color .25s; }
.service-nav-pill .service-nav-item.is-lensed { color:#0f2318; }
.service-nav-pill .service-nav-item.is-lensed > span { transform:scale(1.07); }
.nav-lens { position:absolute; z-index:2; top:50%; left:0; height:38px; margin-top:-19px; border-radius:100px; pointer-events:none; opacity:0;
  background:linear-gradient(180deg,#ffffff59 0%,#ffffff1a 45%,#ffffff33 100%);
  border:1px solid #ffffffb3;
  box-shadow:inset 0 1px 1px #ffffffe6,inset 0 -1px 2px #ffffff80,inset 0 0 0 1px #ffffff40,inset 2px 0 6px #ffffff59,inset -2px 0 6px #ffffff59,0 4px 14px #1b3d2b26,0 1px 3px #1b3d2b1f;
  -webkit-backdrop-filter:blur(.6px) saturate(1.8) brightness(1.06); backdrop-filter:blur(.6px) saturate(1.8) brightness(1.06);
  transition:transform .55s cubic-bezier(.34,1.45,.5,1),width .55s cubic-bezier(.34,1.45,.5,1),scale .32s cubic-bezier(.3,1.6,.5,1),opacity .3s; }
@supports (backdrop-filter:url(#nav-lens)) { .nav-lens { backdrop-filter:url(#nav-lens) blur(.3px) saturate(1.8) brightness(1.06); } }
.nav-lens::before { content:''; position:absolute; inset:2px 10% auto; height:45%; border-radius:100px; background:linear-gradient(180deg,#ffffffd9,#ffffff00); opacity:.75; }
.nav-lens::after { content:''; position:absolute; inset:0; border-radius:inherit; background:radial-gradient(120% 90% at 50% 120%,#7cc49533,transparent 60%); }
.nav-lens.is-ready { opacity:1; }
.nav-lens.is-moving { scale:1.12 .86; }
.nav-lens.is-instant { transition:none; }
.service-nav-pill .service-nav-item { position:relative; z-index:1; }
@media(max-width:1040px) { .nav-lens { display:none; } .service-nav-item.is-active { background:#ffffffd9; } }
@media(prefers-reduced-motion:reduce) { .nav-lens { transition:opacity .2s; } .nav-lens.is-moving { scale:1; } }
.service-nav-pill .service-nav-item.is-lensed > span { transform:none; }

/* Lens physics without SVG refraction: magnified label with a soft prism fringe. */
.nav-lens,.nav-lens.is-ready { z-index:0; -webkit-backdrop-filter:blur(2px) saturate(1.9) brightness(1.08); backdrop-filter:blur(2px) saturate(1.9) brightness(1.08); }
@supports (backdrop-filter:url(#nav-lens)) { .nav-lens { backdrop-filter:blur(2px) saturate(1.9) brightness(1.08); } }
.service-nav-pill .service-nav-item { z-index:1; }
.service-nav-pill .service-nav-item.is-lensed > span { transform:scale(1.08); text-shadow:-.6px 0 0 #ff6a5a38,.6px 0 0 #3a8dff38,0 1px 1px #ffffffb3; }

/* Lead generation: a realistic Gmail-style inbox filling with lead replies. */
.gmail-mock { position:relative; min-width:0; margin:0; overflow:hidden; border-radius:22px; background:#f6f8fc; border:1px solid #e3e7ee; box-shadow:0 30px 70px #1b3d2b26,0 2px 6px #1b3d2b0f; font-family:'Inter',Roboto,Arial,sans-serif; color:#1f1f1f; }
.gm-top { display:flex; align-items:center; gap:14px; height:58px; padding:0 16px; }
.gm-burger { display:grid; gap:3px; width:18px; } .gm-burger i { height:2px; border-radius:2px; background:#5f6368; }
.gm-logo { display:flex; align-items:center; gap:6px; } .gm-logo svg { width:26px; height:20px; } .gm-logo b { font:400 19px/1 'Inter',Arial,sans-serif; color:#5f6368; letter-spacing:-.01em; }
.gm-search { flex:1; display:flex; align-items:center; gap:10px; height:40px; margin-left:10px; padding:0 14px; border-radius:100px; background:#e9eef6; color:#444746; font-size:12.5px; } .gm-search svg { width:16px; height:16px; color:#444746; }
.gm-me { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:linear-gradient(145deg,#3f8a5c,#1f4a31); color:#fff; font-size:12px; font-weight:600; }
.gm-main { display:grid; grid-template-columns:150px 1fr; min-height:420px; }
.gm-side { display:flex; flex-direction:column; gap:2px; padding:4px 10px 14px 8px; font-size:12px; color:#1f1f1f; }
.gm-compose { display:flex; align-items:center; gap:10px; width:max-content; margin:2px 0 12px; padding:13px 18px 13px 14px; border-radius:16px; background:#c2e7ff; color:#001d35; font-weight:500; font-size:12.5px; } .gm-compose svg { width:16px; height:16px; }
.gm-nav { display:flex; align-items:center; gap:10px; height:28px; padding:0 10px 0 12px; border-radius:0 100px 100px 0; } .gm-nav i { width:14px; font-style:normal; color:#444746; font-size:11px; text-align:center; } .gm-nav em { margin-left:auto; font-style:normal; font-size:11px; font-weight:600; }
.gm-nav.is-active { background:#d3e3fd; font-weight:600; color:#041e49; }
.gm-dot { width:9px !important; height:9px; border-radius:3px; } .gm-dot-hot { background:#e8710a; } .gm-dot-meet { background:#1e8e3e; }
.gm-list { margin:0 10px 12px 0; border-radius:16px; background:#fff; overflow:hidden; }
.gm-tabs { display:flex; border-bottom:1px solid #eceff1; font-size:12px; color:#444746; } .gm-tabs span { display:flex; align-items:center; gap:6px; padding:12px 18px; } .gm-tabs .is-active { color:#0b57d0; font-weight:600; box-shadow:inset 0 -3px 0 #0b57d0; } .gm-tabs em { padding:2px 6px; border-radius:6px; background:#1e8e3e; color:#fff; font-style:normal; font-size:9.5px; font-weight:600; }
.gmail-mock ul { margin:0; padding:0; list-style:none; }
.gm-row { display:grid; grid-template-columns:14px 14px 30px minmax(0,150px) minmax(0,1fr) 56px; align-items:center; gap:10px; height:50px; padding:0 14px 0 12px; border-bottom:1px solid #f1f3f4; background:#f2f6fc; font-size:12px; color:#444746; transition:box-shadow .2s; }
.gm-row.is-unread { background:#fff; color:#1f1f1f; }
.gm-row:hover { box-shadow:inset 1px 0 0 #dadce0,inset -1px 0 0 #dadce0,0 1px 2px #3c40434d; position:relative; z-index:1; }
.gm-check { width:13px; height:13px; border:1.5px solid #9aa0a6; border-radius:2px; }
.gm-star { color:#c4c7c5; font-size:13px; line-height:1; } .gm-star.is-on { color:#f4b400; }
.gm-avatar { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; color:#fff; font-size:11px; font-weight:600; }
.gm-from { display:grid; min-width:0; line-height:1.25; } .gm-from b,.gm-from small { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .gm-from b { font-weight:500; } .gm-row.is-unread .gm-from b { font-weight:700; } .gm-from small { color:#5f6368; font-size:10.5px; }
.gm-body { display:flex; align-items:center; gap:6px; min-width:0; overflow:hidden; white-space:nowrap; } .gm-body > b { font-weight:500; } .gm-row.is-unread .gm-body > b { font-weight:700; } .gm-body > span:last-child { overflow:hidden; text-overflow:ellipsis; color:#5f6368; }
.gm-label { flex:none; padding:2px 7px; border-radius:5px; font-size:10px; font-weight:600; }
.gm-label-hot { background:#fde3cf; color:#a14a00; } .gm-label-qual { background:#d3e3fd; color:#0b57d0; } .gm-label-meet { background:#ceead6; color:#137333; } .gm-label-new { background:#eceff1; color:#444746; }
.gm-row time { text-align:right; font-size:11px; } .gm-row.is-unread time { font-weight:700; color:#1f1f1f; }
.gm-toast { position:absolute; left:50%; bottom:18px; transform:translateX(-50%); display:flex; align-items:center; gap:11px; padding:11px 18px 11px 11px; border-radius:16px; background:linear-gradient(145deg,#ffffffeb,#f0f8f2d9); border:1px solid #ffffff; box-shadow:0 18px 40px #1b3d2b33; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); white-space:nowrap; animation:ui-float 6s ease-in-out infinite; }
.gm-toast > span:last-child { display:grid; gap:2px; } .gm-toast b { font-size:12.5px; font-weight:600; color:#14261d; } .gm-toast small { font-size:10.5px; color:#5c6d61; }
.gm-toast-ico { display:grid; place-items:center; width:32px; height:32px; border-radius:10px; background:linear-gradient(145deg,#3f8a5c,#1f4a31); color:#fff; font-size:14px; }
.gmail-mock .gm-row { opacity:0; transform:translateY(-8px); animation:gm-in .5s ease forwards; }
.gmail-mock .gm-row:nth-child(1) { animation-delay:.1s; } .gmail-mock .gm-row:nth-child(2) { animation-delay:.25s; } .gmail-mock .gm-row:nth-child(3) { animation-delay:.4s; } .gmail-mock .gm-row:nth-child(4) { animation-delay:.55s; } .gmail-mock .gm-row:nth-child(5) { animation-delay:.7s; } .gmail-mock .gm-row:nth-child(6) { animation-delay:.85s; }
@keyframes gm-in { to { opacity:1; transform:none; } }
@media(max-width:1100px) { .gm-main { grid-template-columns:1fr; } .gm-side { display:none; } .gm-list { margin:0 10px 12px; } }
@media(max-width:640px) { .gm-row { grid-template-columns:30px minmax(0,1fr) 46px; height:auto; padding:10px 12px; row-gap:2px; } .gm-check,.gm-star { display:none; } .gm-from { grid-column:2; } .gm-body { grid-column:2; } .gm-row time { grid-column:3; grid-row:1; } .gm-avatar { grid-row:span 2; } .gm-search { font-size:11px; } .gm-logo b { display:none; } .gm-tabs span:nth-child(3) { display:none; } .gm-toast { position:static; transform:none; margin:0 10px 12px; white-space:normal; animation:none; } }
@media(prefers-reduced-motion:reduce) { .gmail-mock .gm-row { opacity:1; transform:none; animation:none; } .gm-toast { animation:none; } }
/* Two-line inbox rows so subjects and previews stay readable. */
.gm-row { grid-template-columns:14px 14px 34px minmax(0,1fr) auto; grid-template-rows:auto auto; column-gap:10px; row-gap:3px; height:auto; padding:11px 16px 11px 12px; }
.gm-check,.gm-star { grid-row:1 / span 2; } .gm-avatar { grid-row:1 / span 2; width:34px; height:34px; }
.gm-from { grid-column:4; grid-row:1; display:flex; align-items:baseline; gap:6px; } .gm-from small::before { content:'· '; }
.gm-body { grid-column:4 / span 2; grid-row:2; }
.gm-row time { grid-column:5; grid-row:1; }
@media(max-width:1300px) { .gm-main { grid-template-columns:1fr; } .gm-side { display:none; } .gm-list { margin:0 10px 12px; } }
@media(max-width:640px) { .gm-check,.gm-star { display:none; } .gm-row { grid-template-columns:34px minmax(0,1fr) auto; } .gm-avatar { grid-column:1; } .gm-from { grid-column:2; } .gm-body { grid-column:2 / span 2; } .gm-row time { grid-column:3; } }
.gmail-mock { padding-bottom:74px; } .gm-toast { bottom:14px; } @media(max-width:640px) { .gmail-mock { padding-bottom:0; } }
.steps-photo img { object-position:62% center; }
.gmail-mock { padding-bottom:0; }

/* AI agents: white section with a front-facing laptop running little sprite agents. */
.saint-services .agent-laptop-section { background:#fff; border-radius:0; padding-top:110px; padding-bottom:110px; }
.agent-laptop-section .agent-world-heading { margin-top:0; }
.mbp { position:relative; width:min(980px,100%); margin:64px auto 0; }
.mbp-lid { position:relative; padding:1.6% 1.6% 2.4%; border-radius:22px 22px 6px 6px; background:linear-gradient(180deg,#2b2d30,#16171a 60%,#0e0f11); box-shadow:inset 0 0 0 1.5px #3c3f44,inset 0 1px 0 #55595f,0 1px 0 #000; }
.mbp-screen { position:relative; overflow:hidden; aspect-ratio:16/10; border-radius:10px 10px 3px 3px; background:radial-gradient(120% 90% at 18% 70%,#fde56a 0%,#f4e14a 18%,#c9ea2f 38%,#74c71f 58%,#2e6b12 82%,#132c09 100%),#1d3a10; container-type:inline-size; font-family:'Inter',-apple-system,sans-serif; }
.mbp-screen::before { content:''; position:absolute; inset:0; background:radial-gradient(70% 60% at 85% 10%,#0b1a0680,transparent 70%),radial-gradient(60% 50% at 10% 0%,#ffffff26,transparent 60%); pointer-events:none; }
.mbp-notch { position:absolute; z-index:5; top:0; left:50%; width:13%; height:3.4%; transform:translateX(-50%); border-radius:0 0 1cqw 1cqw; background:#0e0f11; }
.mbp-glare { position:absolute; inset:0; z-index:6; pointer-events:none; background:linear-gradient(115deg,#ffffff1f 0%,#ffffff08 28%,transparent 42%); }
.os-bar { position:relative; z-index:4; display:flex; align-items:center; gap:1.8cqw; height:3.4%; padding:0 1.6cqw; background:#ffffff38; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); color:#10200c; font-size:1.05cqw; }
.os-bar b { font-weight:600; } .os-apple { font-size:1.2cqw; }
.os-right { margin-left:auto; display:flex; align-items:center; gap:.7cqw; font-weight:500; }
.os-live { width:.75cqw; height:.75cqw; border-radius:50%; background:#16a34a; box-shadow:0 0 0 .35cqw #16a34a33; animation:ui-pulse 1.6s ease-in-out infinite; }
.os-win { position:absolute; z-index:2; border-radius:1.2cqw; background:#ffffffe0; border:1px solid #ffffffb3; box-shadow:0 1.6cqw 3.6cqw #0b1a0640,0 .2cqw .6cqw #0b1a0626; -webkit-backdrop-filter:blur(18px) saturate(1.4); backdrop-filter:blur(18px) saturate(1.4); color:#14261d; font-size:1.05cqw; }
.os-win-top { display:flex; align-items:center; gap:.5cqw; height:2.6cqw; padding:0 1cqw; border-bottom:1px solid #0000000f; }
.os-win-top i { width:.8cqw; height:.8cqw; border-radius:50%; background:#ff5f57; } .os-win-top i:nth-child(2) { background:#febc2e; } .os-win-top i:nth-child(3) { background:#28c840; }
.os-win-top b { margin-left:.6cqw; font-weight:600; } .os-win-top em { margin-left:auto; padding:.2cqw .7cqw; border-radius:1cqw; background:#e3f2e7; color:#2f6b46; font:600 .85cqw/1.2 'Inter',sans-serif; }
.os-win-inbox { left:5%; top:9%; width:31%; } .os-win-cal { left:40%; top:7.5%; width:33%; } .os-win-research { left:7%; top:52%; width:34%; } .os-win-report { left:50%; top:47%; width:30%; }
.os-mail { margin:0; padding:.6cqw .8cqw 1cqw; list-style:none; display:grid; gap:.45cqw; }
.os-mail li { display:flex; justify-content:space-between; gap:1cqw; padding:.6cqw .8cqw; border-radius:.7cqw; background:#f3f6f4; }
.os-mail small { color:#6b7d71; } .os-mail li.is-done small { color:#2f7a4e; font-weight:600; }
.os-mail li.is-active { background:#fff; box-shadow:0 0 0 .15cqw #3f8a5c55; animation:os-flash 2.4s ease-in-out infinite; }
@keyframes os-flash { 50% { box-shadow:0 0 0 .3cqw #3f8a5c33; } }
.os-cal { display:grid; grid-template-columns:repeat(5,1fr); grid-template-rows:auto 3.4cqw 3.4cqw; gap:.4cqw; padding:.8cqw; text-align:center; }
.os-cal span { color:#6b7d71; font-size:.85cqw; }
.os-cal i { border-radius:.5cqw; background:#e9eef0; font-style:normal; }
.os-cal i.is-new { display:grid; place-items:center; background:linear-gradient(160deg,#3f8a5c,#1f4a31); color:#fff; font-size:.8cqw; line-height:1.2; font-weight:600; animation:os-pop 4s ease-in-out infinite; }
@keyframes os-pop { 0%,15% { opacity:0; transform:scale(.8); } 25%,85% { opacity:1; transform:scale(1); } 100% { opacity:0; } }
.os-research { display:grid; gap:.7cqw; padding:1cqw; }
.os-q { padding:.7cqw 1cqw; border-radius:2cqw; background:#f1f4f2; color:#3f5548; }
.os-bar-line { height:.5cqw; border-radius:1cqw; background:#e3ece5; overflow:hidden; } .os-bar-line i { display:block; height:100%; width:70%; background:linear-gradient(90deg,#7cc495,#2f7a4e); animation:ui-load 2.6s ease-in-out infinite alternate; }
.os-res b { color:#1f6a40; }
.os-doc { display:grid; gap:.55cqw; padding:1cqw 1.2cqw 1.4cqw; } .os-doc b { font-weight:600; margin-bottom:.2cqw; }
.os-doc i { display:block; height:.55cqw; border-radius:1cqw; background:#e3e8e5; }
.os-typing { position:relative; animation:os-type 2.8s steps(12) infinite; }
.os-typing::after { content:''; position:absolute; right:-.4cqw; top:-.3cqw; width:.15cqw; height:1.1cqw; background:#1f4a31; animation:os-caret .8s step-end infinite; }
@keyframes os-type { from { width:6%; } to { width:58%; } } @keyframes os-caret { 50% { opacity:0; } }
.os-sprite { position:absolute; width:7.2cqw; height:auto; filter:drop-shadow(0 .8cqw .7cqw #0b1a0647); }
.sprite-duck { right:-3cqw; bottom:-2.2cqw; animation:sprite-hop 1.6s ease-in-out infinite; }
.sprite-pink { right:-2.6cqw; bottom:-2.8cqw; width:6.6cqw; animation:sprite-sway 2.4s ease-in-out infinite; }
.sprite-ninja { right:-3.2cqw; top:-3.6cqw; width:7.6cqw; animation:sprite-dash 3s ease-in-out infinite; }
.sprite-sun { left:-3cqw; bottom:-2cqw; width:6cqw; animation:sprite-spin 3.2s ease-in-out infinite; }
@keyframes sprite-hop { 0%,100% { transform:translateY(0); } 40% { transform:translateY(-1.2cqw) rotate(-4deg); } 60% { transform:translateY(-.4cqw); } }
@keyframes sprite-sway { 0%,100% { transform:rotate(-6deg); } 50% { transform:rotate(6deg) translateY(-.5cqw); } }
@keyframes sprite-dash { 0%,100% { transform:translateX(0); } 45% { transform:translateX(-2.2cqw) rotate(-6deg); } 55% { transform:translateX(-2.2cqw); } }
@keyframes sprite-spin { 0%,100% { transform:translateY(0) rotate(0); } 50% { transform:translateY(-.9cqw) rotate(10deg); } }
.os-dock { position:absolute; z-index:3; left:50%; bottom:2%; display:flex; gap:.9cqw; padding:.8cqw 1cqw; transform:translateX(-50%); border-radius:1.6cqw; background:#ffffff40; border:1px solid #ffffff59; -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
.os-dock span { width:3.2cqw; height:3.2cqw; border-radius:.9cqw; box-shadow:0 .3cqw .6cqw #0000002e; }
.os-dock .d1 { background:linear-gradient(145deg,#fff,#dfe7e2); } .os-dock .d2 { background:linear-gradient(145deg,#ffd76a,#f2a72c); } .os-dock .d3 { background:linear-gradient(145deg,#7cc495,#2f7a4e); } .os-dock .d4 { background:linear-gradient(145deg,#8fb6ff,#3a6fe0); } .os-dock .d5 { background:linear-gradient(145deg,#ff9b8a,#e0523e); } .os-dock .d6 { background:linear-gradient(145deg,#2b2d30,#0e0f11); }
.mbp-base { position:relative; z-index:1; width:112%; height:clamp(10px,1.6vw,18px); margin-left:-6%; border-radius:2px 2px 14px 14px / 2px 2px 100% 100%; background:linear-gradient(180deg,#d9dce0 0%,#b9bdc3 35%,#8d9198 80%,#6b6f75 100%); box-shadow:inset 0 1px 0 #f4f5f7,0 1px 1px #0000001a; }
.mbp-lip { position:absolute; left:50%; top:0; width:16%; height:42%; transform:translateX(-50%); border-radius:0 0 10px 10px; background:linear-gradient(180deg,#8e9298,#b4b8be); }
.mbp-shadow { position:absolute; left:2%; right:2%; bottom:-22px; height:26px; border-radius:50%; background:radial-gradient(ellipse at center,#0b1a0638 0%,transparent 70%); filter:blur(6px); z-index:0; }
.agent-laptop-cta { display:flex; flex-direction:column; align-items:center; gap:6px; margin-top:64px; text-align:center; }
.agent-laptop-cta span { color:#5c6d61; font-size:14px; }
.saint-services .agent-laptop-cta p { margin:0 0 16px; font:500 clamp(26px,2.6vw,36px)/1.15 'Inter',sans-serif; letter-spacing:-.035em; color:#14261d; }
@media(max-width:760px) { .saint-services .agent-laptop-section { padding-top:80px; padding-bottom:80px; } .mbp { margin-top:40px; } .mbp-lid { border-radius:14px 14px 4px 4px; } }
@media(prefers-reduced-motion:reduce) { .os-sprite,.os-mail li.is-active,.os-cal i.is-new,.os-typing,.os-typing::after,.os-bar-line i,.os-live { animation:none; } }
.sprite-duck { right:auto; left:-2.6cqw; bottom:-3cqw; }
.sprite-ninja { right:auto; left:-3.4cqw; top:auto; bottom:-2.6cqw; }
.os-win-inbox { left:6%; top:10%; width:30%; } .os-win-cal { left:42%; top:9%; width:33%; } .os-win-research { left:9%; top:56%; width:33%; } .os-win-report { left:56%; top:46%; width:32%; }
.sprite-duck { left:-6.6cqw; bottom:-1.2cqw; }
.sprite-ninja { left:-7.4cqw; bottom:-1cqw; }
.sprite-sun { left:-6.2cqw; bottom:.2cqw; }
.os-win-inbox { left:9%; } .os-win-research { left:12%; } .os-win-report { left:58%; }

/* Photoreal laptop body with the live agent screen fitted into its display. */
.mbp-photo { width:min(1080px,100%); }
.mbp-body { display:block; width:100%; height:auto; }
.mbp-photo .mbp-lid { position:absolute; left:7.6%; top:4.5%; width:84.7%; height:79.4%; padding:0; border-radius:.8% / 1.3%; background:none; box-shadow:none; overflow:hidden; }
.mbp-photo .mbp-screen { width:100%; height:100%; aspect-ratio:auto; border-radius:inherit; }
.mbp-photo .mbp-notch,.mbp-photo .mbp-base,.mbp-photo .mbp-shadow { display:none; }
.mbp-photo .mbp-glare { background:linear-gradient(115deg,#ffffff14 0%,#ffffff05 30%,transparent 45%); }
/* Re-fit: full base visible, screen fills the whole black display. */
.mbp-photo { width:min(1200px,100%); }
.mbp-photo .mbp-lid { left:11.5%; top:3.72%; width:77%; height:82.3%; border-radius:.6% .6% 0 0 / 1% 1% 0 0; }

/* Mac-style scenic wallpaper behind the agent windows. */
.mbp-screen { background:url('/assets/agents/mac-wallpaper.jpg') center 62%/cover no-repeat,#9cc7d8; }
.mbp-screen::before { background:linear-gradient(180deg,#0b1a0626 0%,transparent 30%,transparent 70%,#0b1a0633 100%); }
.os-bar { background:#ffffff4d; color:#0e1b14; }

/* Dock with real app icons. */
.os-dock { gap:.8cqw; padding:.7cqw .9cqw; border-radius:1.8cqw; background:#ffffff59; border:1px solid #ffffff80; }
.os-dock .dk { position:relative; display:grid; place-items:center; width:3.6cqw; height:3.6cqw; border-radius:.95cqw; background:#fff; box-shadow:0 .3cqw .7cqw #0000002e,inset 0 0 0 1px #0000000d; transition:transform .25s cubic-bezier(.34,1.56,.64,1); }
.os-dock .dk:hover { transform:translateY(-.8cqw) scale(1.18); }
.os-dock .dk svg,.os-dock .dk img { width:62%; height:62%; object-fit:contain; }
.dk-saint { background:linear-gradient(145deg,#fffbe8,#fde9a6) !important; } .dk-saint img { width:72%; height:72%; }
.dk-cal svg { width:78%; height:78%; } .dk-forms svg { width:46%; } .dk-sf svg { width:76%; }
.dk-zoom { background:linear-gradient(145deg,#4a8cff,#0b5cff) !important; } .dk-zoom svg { width:70%; height:70%; }
.dk-dot { position:absolute; bottom:-.55cqw; left:50%; width:.35cqw; height:.35cqw; margin-left:-.175cqw; border-radius:50%; background:#1d2a22; }

/* Pricing: clean line icons matching the automation cards. */
.plan-icon,.plan-icon-light { width:auto; height:auto; margin-bottom:20px; border-radius:0; background:none; box-shadow:none; color:#2a7a4b; display:flex; }
.plan-icon svg { width:34px; height:34px; }
.plan-card-dark .plan-icon { color:#8fd0a3; }
.plan-features i { display:grid; place-items:center; width:18px; height:18px; }
.plan-features i svg { width:17px; height:17px; }
.plan-quote-avatar { object-fit:cover; border-radius:50%; }

/* Feature lists: green check-circle icons instead of skinny arrows. */
.service-feature-copy ul { gap:12px; }
.service-feature-copy li { padding-left:28px; line-height:1.5; }
.service-feature-copy li::before { content:''; top:50%; width:18px; height:18px; margin-top:-9px; background:#2a7a4b; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8.5 12 2.5 2.5 4.5-5'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8.5 12 2.5 2.5 4.5-5'/%3E%3C/svg%3E") center/contain no-repeat; }
