/* Sofia home: local-business storytelling and illustrative campaign previews. */
.sfh-home { --sfh-ink:#172a23; --sfh-green:var(--theme-accent,#193f36); --sfh-muted:#65766c; --sfh-line:#dce5df; --sfh-mint:#e3eee7; background:#f9fbf8; color:var(--sfh-ink); }
.sfh-home em { font-style:normal; color:var(--sfh-green); }
.sfh-home .sf-wrap { max-width:1240px; }
.sfh-label { display:inline-flex; align-items:center; gap:10px; color:#557761; font-size:10px; font-weight:650; letter-spacing:1.35px; line-height:1.6; }
.sfh-small-star { font-size:24px; font-weight:400; color:#72976b; }
.sfh-hero { display:grid; grid-template-columns:1.05fr 1fr; gap:45px; align-items:center; padding-block:65px 75px; }
.sfh-hero-copy h1 { font-size:clamp(38px,4.7vw,66px); letter-spacing:-3px; line-height:1.1; font-weight:650; margin:22px 0 24px; }
.sfh-hero-copy h1 em { position:relative; }
.sfh-hero-copy > p { max-width:500px; font-size:15px; line-height:1.85; color:var(--sfh-muted); }
.sfh-actions { display:flex; align-items:center; flex-wrap:wrap; gap:22px; margin-top:30px; }
.sfh-actions .sf-button { font-size:13px; gap:22px; }
.sfh-link { display:inline-flex; align-items:center; gap:20px; color:var(--sfh-green)!important; font-size:13px; font-weight:650; line-height:1.5; }
.sfh-link:hover { text-decoration:underline; text-underline-offset:5px; }
.sfh-hero-footnote { display:flex; align-items:center; gap:8px; margin-top:23px; font-size:11px; color:#798a7e; }
.sfh-mini-check { font-size:12px; color:#587e64; }
.sfh-hero-art { position:relative; padding:52px 48px 45px 32px; min-width:0; }
.sfh-art-orbit { position:absolute; width:95%; height:91%; left:2%; top:3%; border-radius:48% 48% 38% 45%; background:#e1ecdf; transform:rotate(-9deg); }
.sfh-art-orbit::after { content:''; position:absolute; inset:12px -11px -10px 13px; border:1px solid #cadac9; border-radius:inherit; }
.sfh-art-note { position:absolute; z-index:2; top:4px; right:0; display:flex; align-items:center; gap:9px; transform:rotate(4deg); font-size:11px; color:#7d6949; background:#f6ead5; border:1px solid #eaddc5; padding:11px 15px; border-radius:7px; }
.sfh-art-note > span { font-size:18px; }
.sfh-browser-preview { position:relative; z-index:1; border:1px solid #d5e0d5; border-radius:14px; overflow:hidden; background:#fff; transform:rotate(-3deg); box-shadow:0 20px 40px -22px #29493840; }
.sfh-browser-top { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:15px; border-bottom:1px solid #e9eee9; font-size:9px; color:#849386; }
.sfh-window-dots { display:flex; gap:4px; }
.sfh-window-dots i { width:5px; height:5px; background:#c8d3c8; border-radius:50%; }
.sfh-preview-brand { display:flex; flex-direction:column; align-items:center; gap:10px; padding:24px 10px 22px; background:#f8faf6; }
.sfh-business-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:#dce9dc; color:#4e7653; font-size:22px; }
.sfh-preview-brand strong { font-size:13px; font-weight:600; letter-spacing:-.2px; }
.sfh-preview-brand > span:last-child { font-size:7px; color:#83967f; letter-spacing:1.3px; }
.sfh-review-preview { text-align:center; padding:17px 25px 25px; }
.sfh-outline-star { font-size:32px; color:#859d6d; }
.sfh-review-preview h2 { font-size:22px; font-weight:600; letter-spacing:-.7px; margin:7px 0; }
.sfh-review-preview p { font-size:10px; color:#889284; }
.sfh-review-stars { color:#bc9c58; font-size:31px; letter-spacing:2px; margin:14px 0 17px; }
.sfh-preview-action { display:flex; justify-content:space-between; padding:13px 16px; border-radius:7px; background:var(--sfh-green); color:#fff; font-size:10px; font-weight:600; }
.sfh-preview-footer { display:flex; align-items:center; justify-content:center; gap:7px; padding:12px; border-top:1px solid #edf0e9; font-size:8px; color:#889780; }
.sfh-floating-tag { position:absolute; z-index:3; display:flex; align-items:center; gap:12px; background:white; border:1px solid #d9e5db; box-shadow:0 9px 25px -14px #193f3640; border-radius:11px; padding:14px; }
.sfh-tag-qr { bottom:14px; left:-6px; transform:rotate(-5deg); }
.sfh-tag-ai { right:-7px; bottom:14px; transform:rotate(4deg); }
.sfh-float-icon { display:grid; place-items:center; width:37px; height:37px; background:#edf3e7; border-radius:9px; color:#4c7350; font-size:21px; }
.sfh-tag-ai .sfh-float-icon { background:#fbf0df; color:#a1804d; }
.sfh-floating-tag strong { display:block; font-size:11px; font-weight:600; }
.sfh-floating-tag div > span { display:block; font-size:9px; color:#839280; margin-top:5px; }
.sfh-floating-tag > span:last-child:not(.sfh-float-icon) { color:#608368; }
.sfh-art-caption { position:absolute; left:0; right:0; text-align:center; bottom:-18px; font-size:8px; color:#98a592; }
.sfh-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; border-block:1px solid var(--sfh-line); padding-block:26px; }
.sfh-benefits > div { display:flex; align-items:center; gap:15px; }
.sfh-benefit-icon { font-size:23px; color:#698669; }
.sfh-benefits h2 { font-size:13px; font-weight:600; margin:0 0 7px; }
.sfh-benefits p { font-size:11px; color:var(--sfh-muted); line-height:1.6; }
.sfh-heading h2 { font-size:clamp(32px,3.6vw,46px); font-weight:600; letter-spacing:-1.8px; line-height:1.15; margin:17px 0 19px; }
.sfh-heading p { font-size:14px; line-height:1.85; color:var(--sfh-muted); max-width:560px; }
.sfh-heading-center { text-align:center; margin-inline:auto; }
.sfh-heading-center p { margin-inline:auto; }
.sfh-tools { padding-block:68px; }
.sfh-tool-tabs { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px; margin-top:30px; padding:7px; background:#eef3ee; border:1px solid #e2e9e1; border-radius:12px; }
.sfh-tool-tabs button { display:flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; border-radius:8px; padding:13px 8px; min-height:50px; font-size:11px; font-weight:550; background:transparent; color:#6c806f; }
.sfh-tool-tabs button > i { font-size:17px; }
.sfh-tool-tabs button[aria-selected=true] { color:var(--sfh-green); background:white; border-color:#dce7da; box-shadow:0 2px 4px #254b3310; }
.sfh-tool-tabs button:hover { color:var(--sfh-green); }
.sfh-tool-panel { display:grid; grid-template-columns:1fr 1fr; gap:45px; align-items:center; margin-top:16px; padding:32px; background:white; border:1px solid var(--sfh-line); border-radius:17px; }
.sfh-tool-copy { padding:8px 20px; }
.sfh-tool-symbol { display:grid; place-items:center; width:44px; height:44px; border:1px solid #dce7da; border-radius:11px; color:#568464; background:#f1f6ee; font-size:23px; }
.sfh-tool-copy h3 { font-size:32px; font-weight:600; letter-spacing:-1.15px; line-height:1.2; margin:22px 0 16px; max-width:410px; }
.sfh-tool-copy > p { color:var(--sfh-muted); font-size:13px; line-height:1.85; max-width:390px; }
.sfh-tool-copy ul { list-style:none; margin:22px 0 25px; padding:0; display:grid; gap:12px; }
.sfh-tool-copy li { display:flex; align-items:center; gap:10px; font-size:12px; color:#486351; }
.sfh-tool-copy li > span { color:#6c9667; font-size:11px; }
.sfh-tool-art { position:relative; min-height:425px; display:flex; justify-content:center; align-items:center; background:#e9f0e7; border-radius:13px; padding:25px 36px 40px; }
.sfh-tool-art-coupons,.sfh-tool-art-qr { background:#f4edde; }
.sfh-tool-art-leads { background:#e9efed; }
.sfh-tool-art-feedback { background:#eeeedd; }
.sfh-product-preview { width:100%; max-width:330px; background:white; border:1px solid #dae4d8; border-radius:11px; overflow:hidden; box-shadow:0 14px 30px -22px #244f3550; }
.sfh-product-preview-top { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid #e9eee6; color:#69856b; font-size:9px; }
.sfh-product-preview-top > span:first-child { display:flex; align-items:center; gap:8px; }
.sfh-preview-dots { letter-spacing:2px; color:#a7b5a1; }
.sfh-preview-content { padding:23px; }
.sfh-preview-centered { text-align:center; }
.sfh-preview-large-icon { display:grid; place-items:center; width:43px; height:43px; border-radius:12px; background:#edf3e9; color:#6e8b5e; font-size:23px; margin:0 auto 17px; }
.sfh-preview-overline { display:block; font-size:7px; letter-spacing:1.1px; font-weight:600; color:#8ba17f; }
.sfh-preview-content h4 { font-size:22px; font-weight:600; letter-spacing:-.75px; line-height:1.2; margin:11px 0; }
.sfh-preview-content p { font-size:9px; line-height:1.85; color:#8b9883; }
.sfh-preview-rating { font-size:28px; color:#b79952; margin:16px 0; letter-spacing:2px; }
.sfh-preview-submit { display:block; text-align:center; background:var(--sfh-green); color:white; border-radius:6px; font-size:9px; font-weight:550; padding:12px 9px; margin-top:18px; }
.sfh-demo-caption { position:absolute; bottom:13px; font-size:8px; color:#8b9d81; }
.sfh-preview-week,.sfh-preview-dates { display:grid; grid-template-columns:repeat(5,1fr); gap:5px; text-align:center; font-size:9px; }
.sfh-preview-week { margin-top:26px; color:#8b9d81; }
.sfh-preview-dates { margin-top:8px; }
.sfh-preview-dates span { padding:14px 2px; background:#f6f8f2; border-radius:7px; }
.sfh-preview-content .is-picked { background:#dcebd9; color:#305d35; }
.sfh-preview-times { display:flex; gap:8px; margin-top:19px; }
.sfh-preview-times span { flex:1; padding:10px 3px; text-align:center; border:1px solid #e1e8db; border-radius:5px; font-size:9px; }
.sfh-preview-field { margin-top:14px; font-size:8px; color:#83947b; }
.sfh-preview-field > div { margin-top:6px; padding:10px; background:#f9fbf7; border:1px solid #e6ecdf; border-radius:5px; color:#a0ad96; }
.sfh-preview-coupon { margin-top:20px; padding:16px 8px; border-block:1px dashed #d4c8ad; color:#a18a5c; font-size:8px; letter-spacing:1.1px; }
.sfh-preview-faces { display:flex; justify-content:center; gap:21px; font-size:30px; color:#adbca1; margin:23px 0; }
.sfh-preview-faces i:last-child { color:#679068; }
.sfh-preview-feedback { border:1px solid #e1e8da; border-radius:6px; text-align:start; padding:13px 10px 35px; color:#9caa92; font-size:8px; }
.sfh-preview-qr-symbol { display:grid; place-items:center; width:100px; height:100px; border:1px solid #e0e7da; border-radius:12px; margin:20px auto; font-size:64px; color:#41673e; }
.sfh-preview-link { display:block; font-size:9px; color:#6b865d; margin-bottom:14px; }
.sfh-preview-link i { margin-inline-end:5px; }
.sfh-journey { border-block:1px solid #dae5d8; background:#edf3e9; }
.sfh-journey-layout { display:grid; grid-template-columns:1fr 1.05fr; gap:75px; align-items:center; padding-block:55px; }
.sfh-journey .sfh-link { margin-top:23px; }
.sfh-journey-steps { display:grid; }
.sfh-journey-steps article { display:flex; align-items:start; gap:20px; padding:25px 0; border-bottom:1px solid #d4e0cf; }
.sfh-journey-steps article:last-child { border-bottom:0; }
.sfh-journey-number { font-size:10px; color:#7b9770; padding-top:4px; }
.sfh-journey-steps h3 { font-size:17px; font-weight:600; letter-spacing:-.3px; margin:0 0 10px; }
.sfh-journey-steps p { font-size:12px; color:#7c8e72; line-height:1.8; }
.sfh-journey-steps article > i { margin-inline-start:auto; padding-top:2px; color:#90aa7b; font-size:23px; }
.sfh-faq-section { padding-block:62px; display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; }
.sfh-faq-section .sfh-link { margin-top:12px; }
.sfh-faq-list details { border-bottom:1px solid var(--sfh-line); }
.sfh-faq-list summary { list-style:none; display:flex; align-items:center; justify-content:space-between; gap:18px; font-size:14px; font-weight:550; padding:20px 0; cursor:pointer; }
.sfh-faq-list summary::-webkit-details-marker { display:none; }
.sfh-faq-list summary > span { flex-shrink:0; position:relative; width:16px; height:16px; color:#79936c; }
.sfh-faq-list summary > span::before,.sfh-faq-list summary > span::after { content:''; position:absolute; inset:7px 2px auto; border-top:1px solid; }
.sfh-faq-list summary > span::after { transform:rotate(90deg); }
.sfh-faq-list [open] summary > span::after { display:none; }
.sfh-faq-list details p { padding:0 25px 22px 0; font-size:12px; line-height:1.9; color:var(--sfh-muted); white-space:pre-line; }
.sfh-journal { padding-block:8px 60px; }
.sfh-journal > header { display:flex; align-items:center; justify-content:space-between; gap:22px; margin-bottom:26px; }
.sfh-journal .sfh-heading h2 { font-size:31px; letter-spacing:-1px; margin-bottom:0; }
.sfh-journal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:23px; }
.sfh-journal-card { min-width:0; color:var(--sfh-ink)!important; }
.sfh-journal-cover { position:relative; height:165px; background:#dfeadc; border:1px solid #d3dfd0; border-radius:12px; overflow:hidden; }
.sfh-journal-cover-1 { background:#f1e6d2; border-color:#e8dcc7; }
.sfh-journal-cover-2 { background:#e2e8e5; border-color:#d7e1dc; }
.sfh-journal-art { position:absolute; inset:-10px 25px auto auto; font-size:180px; font-family:Georgia,serif; line-height:1; color:#547b5560; transform:rotate(-15deg); }
.sfh-journal-cover-1 .sfh-journal-art { color:#a4895560; }
.sfh-journal-cover-2 .sfh-journal-art { color:#6d887c60; }
.sfh-journal-cover img { position:absolute; width:100%; height:100%; object-fit:cover; inset:0; }
.sfh-journal-badge { position:absolute; left:15px; bottom:15px; font-size:8px; font-weight:600; letter-spacing:1px; padding:7px 10px; color:#4a6852; border:1px solid #ffffff70; border-radius:5px; background:#ffffffdb; }
.sfh-journal-text { padding:17px 3px 0; }
.sfh-journal-text h3 { font-size:16px; font-weight:600; line-height:1.55; letter-spacing:-.25px; margin:0 0 15px; }
.sfh-journal-text > span { font-size:11px; color:#73916c; display:flex; align-items:center; gap:18px; }
.sfh-journal-card:hover h3 { color:var(--sfh-green); text-decoration:underline; text-underline-offset:3px; }
.sfh-closing { position:relative; display:flex; align-items:center; justify-content:space-between; gap:35px; background:var(--sfh-green); color:white; padding:46px 48px; border-radius:18px; overflow:hidden; margin-bottom:60px; }
.sfh-closing .sfh-label { color:#b9d0c1; font-size:9px; }
.sfh-closing h2 { font-size:38px; line-height:1.16; font-weight:600; letter-spacing:-1.3px; margin:16px 0; }
.sfh-closing p { color:#c5d8cb; font-size:12px; line-height:1.8; }
.sfh-closing-actions { display:flex; flex-direction:column; align-items:center; gap:21px; position:relative; flex-shrink:0; }
.sfh-closing-actions .sf-button { color:#244936!important; background:#f2f7ee; font-size:12px; }
.sfh-closing-actions .sfh-link { color:#e0eade!important; font-size:12px; }
.sfh-closing > div:not(.sfh-closing-decoration) { position:relative; }
.sfh-closing-decoration { position:absolute; font-family:Georgia,serif; color:#ffffff07; font-size:440px; line-height:1; right:145px; top:-130px; }
@media(max-width:1100px) { .sfh-hero { gap:15px; } .sfh-hero-copy h1 { font-size:48px; letter-spacing:-2.5px; } .sfh-art-note { right:0; font-size:9px; } .sfh-hero-art { padding:50px 20px 45px; } .sfh-floating-tag { padding:11px; } .sfh-tag-qr { left:-12px; } .sfh-tag-ai { right:-8px; } .sfh-tool-panel { gap:20px; padding:25px; } .sfh-tool-copy { padding:5px 8px; } .sfh-tool-art { padding-inline:24px; } .sfh-tool-tabs button { font-size:10px; } .sfh-journey-layout { gap:40px; } }
@media(max-width:850px) { .sfh-hero { grid-template-columns:1fr; gap:20px; padding-top:42px; padding-bottom:42px; } .sfh-hero-copy { text-align:center; } .sfh-hero-copy > p { margin-inline:auto; } .sfh-actions,.sfh-hero-footnote { justify-content:center; } .sfh-hero-art { width:min(490px,100%); margin:auto; padding-inline:45px; } .sfh-tool-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); } .sfh-tool-tabs button { font-size:11px; } .sfh-benefits { gap:17px; } .sfh-benefits > div { align-items:start; gap:10px; } .sfh-benefits h2 { font-size:12px; } .sfh-benefits p { font-size:10px; } .sfh-tool-copy h3 { font-size:28px; } .sfh-journey-layout { grid-template-columns:1fr; gap:22px; } .sfh-faq-section { gap:35px; } .sfh-heading h2 { font-size:36px; } .sfh-closing { padding:35px; } .sfh-closing h2 { font-size:30px; } }
@media(max-width:640px) { .sfh-hero { padding-top:30px; } .sfh-label { font-size:8px; letter-spacing:1px; gap:7px; } .sfh-small-star { font-size:19px; } .sfh-hero-copy h1 { font-size:38px; letter-spacing:-1.8px; line-height:1.12; margin:19px 0; } .sfh-hero-copy > p { font-size:13px; line-height:1.8; } .sfh-actions { margin-top:23px; gap:19px; } .sfh-actions .sf-button { font-size:12px; padding:14px 16px; gap:12px; } .sfh-link { font-size:12px; gap:10px; } .sfh-hero-footnote { font-size:10px; margin-top:18px; } .sfh-hero-art { padding:39px 30px 44px 23px; margin-top:10px; } .sfh-art-note { font-size:8px; padding:8px 10px; right:5px; } .sfh-browser-top { padding:11px; font-size:8px; } .sfh-preview-brand { padding:18px 8px; } .sfh-preview-brand strong { font-size:12px; } .sfh-preview-brand > span:last-child { font-size:6px; } .sfh-review-preview { padding:10px 20px 20px; } .sfh-review-preview h2 { font-size:20px; } .sfh-review-preview p { font-size:9px; } .sfh-review-stars { font-size:28px; } .sfh-preview-action { font-size:9px; } .sfh-tag-qr { left:0; bottom:13px; } .sfh-tag-ai { display:none; } .sfh-floating-tag { gap:8px; padding:9px; border-radius:8px; } .sfh-floating-tag strong { font-size:9px; } .sfh-floating-tag div > span { font-size:7px; } .sfh-float-icon { width:29px; height:29px; font-size:18px; } .sfh-art-caption { left:0; bottom:-12px; font-size:7px; } .sfh-benefits { grid-template-columns:1fr; gap:19px; padding-block:22px; } .sfh-benefits > div { align-items:center; gap:17px; } .sfh-benefits h2 { font-size:13px; margin-bottom:4px; } .sfh-benefits p { font-size:11px; } .sfh-benefit-icon { width:25px; text-align:center; font-size:21px; } .sfh-tools { padding-block:40px; } .sfh-heading h2 { font-size:33px; letter-spacing:-1.4px; } .sfh-heading p { font-size:13px; } .sfh-tool-tabs { margin-top:24px; gap:4px; padding:5px; } .sfh-tool-tabs button { flex-direction:column; font-size:9px; gap:7px; padding:10px 3px; min-height:62px; text-align:center; } .sfh-tool-panel { grid-template-columns:1fr; gap:25px; padding:23px 18px 18px; } .sfh-tool-copy { padding:0 4px; } .sfh-tool-copy h3 { font-size:28px; margin-top:17px; } .sfh-tool-copy ul { margin:18px 0 22px; } .sfh-tool-art { min-height:365px; padding:23px 18px 35px; } .sfh-preview-content { padding:20px; } .sfh-journey-layout { padding-block:36px; gap:18px; } .sfh-journey-steps article { padding:20px 0; gap:14px; } .sfh-journey-steps h3 { font-size:16px; line-height:1.5; } .sfh-journey-steps article > i { display:none; } .sfh-journey-steps p { font-size:12px; } .sfh-faq-section { grid-template-columns:1fr; gap:22px; padding-block:39px; } .sfh-faq-section .sfh-heading h2 br { display:none; } .sfh-faq-list summary { font-size:13px; } .sfh-journal { padding-block:0 40px; } .sfh-journal > header { align-items:start; flex-direction:column; gap:17px; } .sfh-journal .sfh-heading h2 { font-size:30px; } .sfh-journal-grid { grid-template-columns:1fr; gap:22px; } .sfh-journal-card { display:grid; grid-template-columns:100px minmax(0,1fr); gap:15px; align-items:center; } .sfh-journal-cover { height:108px; border-radius:9px; } .sfh-journal-badge { display:none; } .sfh-journal-art { font-size:110px; right:1px; top:0; } .sfh-journal-text { padding:0; } .sfh-journal-text h3 { font-size:14px; margin-bottom:10px; } .sfh-journal-text > span { font-size:10px; } .sfh-closing { padding:30px 24px; flex-direction:column; align-items:start; gap:27px; margin-bottom:40px; } .sfh-closing h2 { font-size:31px; } .sfh-closing-actions { align-items:start; gap:17px; } .sfh-closing-decoration { font-size:300px; right:-60px; top:10px; } }