/* Docs marketing: typography, spacing and colours follow the ZolaHub homepage. */
#marketing{--mkt-ink:#14241c;--mkt-muted:#5c6d63;--mkt-line:#e3e8e4;--mkt-soft:#f4f6f3;--mkt-green:#00a956;--mkt-green-dark:#008442;--mkt-field:radial-gradient(80% 70% at 0% 0%,rgba(0,169,86,.28),transparent 62%),linear-gradient(165deg,#14382c 0%,#1b6844 100%);background:#fff;color:var(--mkt-ink);font-family:"Segoe UI","Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
#marketing[hidden],#marketing [hidden]{display:none!important}
#marketing h1,#marketing h2,#marketing h3,#marketing p,#marketing ul{margin-top:0;font-family:inherit}
#marketing button{font:inherit;cursor:pointer}
#marketing img{display:block;width:100%;height:auto}
#marketing svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
#marketing .mkt-shell{max-width:1180px;margin:0 auto;padding-left:32px;padding-right:32px}
#marketing .mkt-skip{position:absolute;left:16px;top:-80px;z-index:100;background:#14241c;color:#fff;padding:10px 14px;border-radius:8px}
#marketing .mkt-skip:focus{top:12px}
#marketing .mkt-header{position:sticky;top:0;z-index:90;background:#fffffff0;border-bottom:1px solid var(--mkt-line);backdrop-filter:blur(10px)}
#marketing .mkt-header-inner{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:78px;gap:20px}
#marketing .mkt-brand{display:inline-flex;align-items:baseline;font-weight:760;font-size:28px;letter-spacing:-1.5px;line-height:1;white-space:nowrap}
#marketing .mkt-brand>span{color:var(--mkt-green)}
#marketing .mkt-brand small{font-size:11px;letter-spacing:0;font-weight:400;color:#6d8274;margin-left:9px}
#marketing .mkt-nav{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:32px}
#marketing .mkt-nav a,#marketing .mkt-signin{font-size:14px;font-weight:650}
#marketing .mkt-header-actions{display:flex;align-items:center;gap:20px}
#marketing .mkt-signin{padding:10px 0;background:none;border:0;color:var(--mkt-ink)}
#marketing .mkt-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:1px solid transparent;border-radius:999px;padding:12px 20px;background:var(--mkt-green);color:#fff;font-size:14px;font-weight:700;line-height:1.2;white-space:nowrap;transition:background .18s ease}
#marketing .mkt-button:hover{background:var(--mkt-green-dark)}
#marketing .mkt-button-outline{border-color:#cfd9d2;background:#fff;color:var(--mkt-ink)}
#marketing .mkt-button-outline:hover{background:#f7fbf8;border-color:#8eaa98}
#marketing .mkt-button-large{min-height:52px;padding:15px 24px;font-size:15px}
#marketing .mkt-menu{display:none}
#marketing .mkt-eyebrow{margin:0 0 16px;font-size:12px;font-weight:750;letter-spacing:.16em;text-transform:uppercase;color:var(--mkt-green-dark);line-height:1.5}
#marketing .mkt-hero{padding-top:92px;padding-bottom:38px}
#marketing h1{max-width:920px;margin-bottom:22px;font-size:clamp(48px,6.2vw,84px);font-weight:560;letter-spacing:-.04em;line-height:1.02}
#marketing .mkt-lede{max-width:640px;margin-bottom:32px;font-size:18px;line-height:1.6;color:var(--mkt-muted)}
#marketing .mkt-actions{display:flex;gap:12px;flex-wrap:wrap}
#marketing .mkt-showcase{padding-top:28px;padding-bottom:20px;scroll-margin-top:98px}
#marketing .mkt-showcase-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}
#marketing .mkt-showcase-head .mkt-eyebrow{margin:0;font-size:10px}
#marketing .mkt-sample-tabs{display:flex;flex-wrap:wrap;gap:4px}
#marketing .mkt-sample-tabs button{border:1px solid transparent;border-radius:999px;background:#fff;color:#5c6d63;padding:9px 14px;font-size:12px;font-weight:600}
#marketing .mkt-sample-tabs button[aria-selected="true"]{background:#e8f7ee;color:#086234;border-color:#c4e4cf}
#marketing .mkt-capture-stage{padding:48px 48px 0;background:radial-gradient(ellipse at 30% 0%,#c9e2cb,transparent 65%),#e2ebe0;border-radius:22px;overflow:hidden;border:1px solid #dce7db}
#marketing .mkt-sheet{border:9px solid #ffffff90;border-bottom:0;border-radius:18px 18px 0 0;overflow:hidden;box-shadow:0 20px 65px #1d432c29;background:#fff}
#marketing .mkt-sheet img{border-radius:8px 8px 0 0}
#marketing .mkt-capture-note{font-size:11px;color:#7b8c81;margin:13px 0 0;text-align:center;line-height:1.6}
#marketing h2{font-size:clamp(34px,4vw,52px);font-weight:560;letter-spacing:-.045em;line-height:1.05;margin-bottom:22px}
#marketing .mkt-documents{padding-top:74px;padding-bottom:76px;scroll-margin-top:92px}
#marketing .mkt-section-head{margin-bottom:38px}
#marketing .mkt-types{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
#marketing .mkt-types article{border-top:1px solid var(--mkt-line);padding-top:20px}
#marketing .mkt-types svg{width:24px;height:24px;color:var(--mkt-green-dark);margin-bottom:24px}
#marketing h3{font-size:24px;font-weight:600;letter-spacing:-.03em;line-height:1.15;margin-bottom:12px}
#marketing .mkt-types p{font-size:14px;line-height:1.65;color:var(--mkt-muted);margin-bottom:0}
#marketing .mkt-platform{position:relative;padding:72px 0 64px;background:var(--mkt-field);color:#fff;scroll-margin-top:78px}
#marketing .mkt-platform-intro{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:end;margin-bottom:32px}
#marketing .mkt-platform .mkt-eyebrow,#marketing .mkt-close .mkt-eyebrow{color:#d9f3e4}
#marketing .mkt-platform-intro h2{margin-bottom:0}
#marketing .mkt-platform-intro>p{font-size:16px;line-height:1.65;color:#ffffffd6;margin-bottom:0}
#marketing .mkt-editor-feature{display:grid;grid-template-columns:.72fr 1.28fr;gap:30px;align-items:center;background:#f6f8f4;color:var(--mkt-ink);border:1px solid #e1e7e2;border-radius:20px;overflow:hidden;padding:36px 0 36px 36px}
#marketing .mkt-small-label{font-size:11px;letter-spacing:.1em;font-weight:700;color:#6d8274;margin-bottom:12px}
#marketing .mkt-editor-feature h3{font-size:36px;font-weight:560;letter-spacing:-.04em}
#marketing .mkt-editor-feature>div>p:not(.mkt-small-label){font-size:15px;line-height:1.7;color:#4c6156;margin-bottom:24px}
#marketing .mkt-text-button{display:inline-flex;align-items:center;gap:6px;color:var(--mkt-green-dark);font-size:14px;font-weight:750;border:0;background:none;padding:0;text-align:left}
#marketing .mkt-text-button svg{width:16px;height:16px}
#marketing .mkt-editor-image{padding:25px 0 0 25px;border-radius:18px 0 0 0;background:#dbe7d9;align-self:stretch;display:flex;align-items:flex-start;overflow:hidden}
#marketing .mkt-editor-image img{max-width:none;width:136%;border:6px solid #ffffffb3;border-radius:13px;box-shadow:0 15px 40px #18372026}
#marketing .mkt-support-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
#marketing .mkt-support-grid article{display:flex;gap:22px;padding:28px;border:1px solid #e1e7e2;border-radius:20px;background:#fff;color:var(--mkt-ink)}
#marketing .mkt-support-grid article>svg{width:27px;height:27px;color:var(--mkt-green-dark)}
#marketing .mkt-support-grid h3{font-size:25px}
#marketing .mkt-support-grid p{font-size:14px;line-height:1.65;color:#4c6156;margin:0}
#marketing .mkt-library{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:65px;padding-top:96px;padding-bottom:96px}
#marketing .mkt-library-image{padding:27px 0 0 27px;border-radius:18px;background:#e4ece0;overflow:hidden;border:1px solid #dce4d7}
#marketing .mkt-library-image img{max-width:none;width:134%;border:7px solid #ffffffa0;border-radius:14px 0 0 0;box-shadow:0 12px 35px #173d2426}
#marketing .mkt-library-copy>p:not(.mkt-eyebrow){font-size:16px;line-height:1.7;color:var(--mkt-muted);margin-bottom:22px}
#marketing .mkt-library ul{list-style:none;padding:0;margin-bottom:26px}
#marketing .mkt-library li{font-size:14px;line-height:1.65;color:#4c6156;border-bottom:1px solid var(--mkt-line);padding:12px 0}
#marketing .mkt-how-wrap{background:var(--mkt-soft)}
#marketing .mkt-how{padding-top:72px;padding-bottom:72px;scroll-margin-top:78px}
#marketing .mkt-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;list-style:none;padding:0;margin:0}
#marketing .mkt-steps li{padding-top:20px;border-top:1px solid #d8e2d9}
#marketing .mkt-steps li>span{font-size:11px;font-weight:750;color:var(--mkt-green-dark)}
#marketing .mkt-steps h3{font-size:25px;margin:24px 0 12px}
#marketing .mkt-steps p{font-size:15px;line-height:1.7;color:var(--mkt-muted);margin-bottom:0}
#marketing .mkt-faq{display:grid;grid-template-columns:.85fr 1.15fr;gap:85px;padding-top:96px;padding-bottom:96px;scroll-margin-top:78px}
#marketing .mkt-faq h2{max-width:330px}
#marketing .mkt-questions details{border-bottom:1px solid var(--mkt-line)}
#marketing .mkt-questions summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;font-size:15px;font-weight:600;line-height:1.5;cursor:pointer;list-style:none}
#marketing .mkt-questions summary::-webkit-details-marker{display:none}
#marketing .mkt-questions summary svg{width:16px;height:16px;color:var(--mkt-green-dark)}
#marketing .mkt-questions details[open] summary svg{transform:rotate(180deg)}
#marketing .mkt-questions p{font-size:14px;line-height:1.8;color:var(--mkt-muted);margin:0 25px 24px 0}
#marketing .mkt-close{padding:65px 0;background:var(--mkt-field);color:#fff}
#marketing .mkt-close-inner{display:flex;align-items:center;justify-content:space-between;gap:40px}
#marketing .mkt-close h2{margin-bottom:0}
#marketing .mkt-footer{background:#161616;color:#d6d6d1;padding:8px 0 28px}
#marketing .mkt-footer-grid{display:grid;grid-template-columns:1.4fr .7fr .9fr .8fr;gap:32px;padding-top:36px;padding-bottom:28px}
#marketing .mkt-footer .mkt-brand{color:#fff}
#marketing .mkt-footer .mkt-brand small{color:#b9b9b3}
#marketing .mkt-footer-grid>div>p{max-width:280px;margin:14px 0 0;font-size:14px;line-height:1.6;color:#b9b9b3}
#marketing .mkt-footer h2{font-size:12px;letter-spacing:.12em;font-weight:750;color:#9a9a94;line-height:1.5;margin-bottom:14px}
#marketing .mkt-footer nav{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
#marketing .mkt-footer nav a,#marketing .mkt-footer nav button{color:#ecece7;font-size:14px;border:0;background:none;padding:0;text-align:left}
#marketing .mkt-footer nav a:hover,#marketing .mkt-footer nav button:hover{text-decoration:underline;text-underline-offset:3px}
#marketing .mkt-copyright{border-top:1px solid #ffffff1f;padding-top:18px;font-size:12px;color:#9a9a94;margin-bottom:0}
.auth-card .marketing-back{display:flex;align-items:center;gap:6px;background:none;border:0;padding:0 0 20px;color:#64796b;font-size:12px;font-weight:600}.auth-card .marketing-back svg{width:15px;height:15px}
@media(max-width:950px){#marketing .mkt-nav{gap:20px}#marketing .mkt-types{grid-template-columns:repeat(3,minmax(0,1fr))}#marketing .mkt-editor-feature{grid-template-columns:.85fr 1.15fr;padding-left:26px;gap:24px}#marketing .mkt-library{gap:35px}#marketing .mkt-support-grid article{padding:23px;gap:16px}#marketing .mkt-support-grid h3{font-size:22px}}
@media(max-width:760px){#marketing .mkt-nav{display:none}#marketing .mkt-capture-stage{padding:27px 27px 0}#marketing .mkt-platform-intro{grid-template-columns:1fr;gap:20px}#marketing .mkt-platform-intro>p{max-width:500px}#marketing .mkt-editor-feature{grid-template-columns:1fr;padding:28px 28px 0}#marketing .mkt-editor-feature>div:first-child{max-width:500px}#marketing .mkt-editor-image{max-height:420px;padding:20px 0 0 20px}#marketing .mkt-editor-image img{width:112%}#marketing .mkt-library{grid-template-columns:1fr;gap:35px}#marketing .mkt-library-image{max-height:420px}#marketing .mkt-library-image img{width:110%}#marketing .mkt-library-copy{max-width:540px}#marketing .mkt-faq{gap:35px}#marketing .mkt-steps{gap:25px}#marketing .mkt-footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){#marketing .mkt-shell{padding-left:20px;padding-right:20px}#marketing .mkt-header-inner{min-height:68px;gap:14px}#marketing .mkt-brand{font-size:26px}#marketing .mkt-brand small{font-size:10px}#marketing .mkt-header-actions{margin-left:auto}#marketing .mkt-header-actions .mkt-signin{display:none}#marketing .mkt-header-actions .mkt-button{padding:10px 15px;min-height:40px;font-size:12px}#marketing .mkt-menu{display:block}#marketing .mkt-menu>summary{list-style:none;display:grid;place-items:center;width:28px;height:40px;cursor:pointer}#marketing .mkt-menu>summary::-webkit-details-marker{display:none}#marketing .mkt-menu>summary svg{width:21px;height:21px}#marketing .mkt-menu nav{position:absolute;right:20px;top:60px;width:210px;border:1px solid var(--mkt-line);border-radius:12px;box-shadow:0 15px 40px #14241c20;background:#fff;padding:12px;display:grid}#marketing .mkt-menu nav a,#marketing .mkt-menu nav button{padding:12px;text-align:left;background:none;border:0;font-size:14px;color:var(--mkt-ink)}#marketing .mkt-hero{padding-top:52px;padding-bottom:30px}#marketing h1{font-size:clamp(42px,10vw,58px);line-height:1.04}#marketing h1 br{display:none}#marketing .mkt-lede{font-size:16px}#marketing .mkt-eyebrow{font-size:10px}#marketing .mkt-showcase{padding-top:16px}#marketing .mkt-showcase-head{align-items:flex-start;flex-direction:column;gap:10px}#marketing .mkt-sample-tabs{gap:0}#marketing .mkt-sample-tabs button{font-size:11px;padding:8px 11px}#marketing .mkt-capture-stage{padding:22px 16px 0;border-radius:14px}#marketing .mkt-sheet{border-width:5px;border-radius:10px 10px 0 0}#marketing .mkt-sheet img{border-radius:5px 5px 0 0}#marketing .mkt-capture-note{font-size:10px}#marketing .mkt-documents{padding-top:50px;padding-bottom:52px}#marketing h2{font-size:36px}#marketing .mkt-types{grid-template-columns:1fr 1fr;gap:28px 20px}#marketing .mkt-types h3{font-size:23px}#marketing .mkt-types svg{margin-bottom:17px}#marketing .mkt-types p{font-size:13px}#marketing .mkt-platform{padding:52px 0}#marketing .mkt-platform-intro{margin-bottom:25px}#marketing .mkt-platform-intro>p{font-size:15px}#marketing .mkt-editor-feature{padding:25px 20px 0;border-radius:15px;gap:25px}#marketing .mkt-editor-feature h3{font-size:32px}#marketing .mkt-support-grid{grid-template-columns:1fr}#marketing .mkt-support-grid article{border-radius:15px}#marketing .mkt-library{padding-top:56px;padding-bottom:56px}#marketing .mkt-library-image{padding:20px 0 0 20px}#marketing .mkt-library-image img{width:123%}#marketing .mkt-how{padding-top:52px;padding-bottom:52px}#marketing .mkt-steps{grid-template-columns:1fr;gap:30px}#marketing .mkt-steps h3{margin-top:17px}#marketing .mkt-faq{grid-template-columns:1fr;padding-top:56px;padding-bottom:56px;gap:10px}#marketing .mkt-faq h2{max-width:330px}#marketing .mkt-close{padding:48px 0}#marketing .mkt-close-inner{align-items:flex-start;flex-direction:column;gap:25px}#marketing .mkt-footer-grid{gap:30px 20px}#marketing .mkt-footer-grid>div{grid-column:1/-1}}
@media(max-width:360px){#marketing .mkt-brand small{display:none}#marketing .mkt-button-large{padding:14px 18px;font-size:14px}#marketing h2{font-size:32px}#marketing .mkt-capture-stage{padding:17px 11px 0}#marketing .mkt-sample-tabs button{font-size:10px;padding:8px 9px}}
@media(prefers-reduced-motion:reduce){#marketing *{transition:none!important;scroll-behavior:auto!important}}
@media print{#marketing,.marketing-back{display:none!important}}

#marketing .mkt-platform,#marketing .mkt-close{position:relative;isolation:isolate;background:var(--mkt-field)}
#marketing .mkt-platform:before,#marketing .mkt-close:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:url("assets/marketing-grain.png");opacity:.2;mix-blend-mode:overlay}

#marketing .mkt-people{padding:72px 0 0;background:#fff}
#marketing .mkt-people-inner{display:grid;grid-template-columns:.78fr 1.22fr;gap:32px;align-items:center}
#marketing .mkt-people-copy{padding:12px 0 52px}
#marketing .mkt-people-copy h2{font-size:clamp(34px,3.6vw,48px)}
#marketing .mkt-people-copy>p:not(.mkt-eyebrow){max-width:390px;font-size:16px;line-height:1.75;color:var(--mkt-muted);margin-bottom:27px}
#marketing .mkt-people-visual{min-width:0;align-self:end}
#marketing .mkt-people-visual img{width:100%;height:auto}
@media(max-width:760px){#marketing .mkt-people{padding-top:56px}#marketing .mkt-people-inner{grid-template-columns:1fr;gap:12px}#marketing .mkt-people-copy{max-width:540px;padding-bottom:20px}#marketing .mkt-people-copy h2{font-size:40px}#marketing .mkt-people-visual{max-width:660px;justify-self:center}}
@media(max-width:360px){#marketing .mkt-people-copy h2{font-size:34px}}

#marketing .mkt-anywhere{padding:0 0 88px;background:#fff}
#marketing .mkt-anywhere-inner{display:grid;grid-template-columns:.86fr 1.14fr;gap:60px;align-items:center}
#marketing .mkt-anywhere-lede{font-size:16px;line-height:1.75;color:var(--mkt-muted);max-width:420px;margin-bottom:27px}
#marketing .mkt-anywhere-benefits{list-style:none;padding:0;margin:0}
#marketing .mkt-anywhere-benefits li{padding:15px 0;border-top:1px solid var(--mkt-line)}
#marketing .mkt-anywhere-benefits h3{font-size:17px;font-weight:650;letter-spacing:-.02em;margin:0 0 6px}
#marketing .mkt-anywhere-benefits p{font-size:14px;line-height:1.6;color:var(--mkt-muted);margin:0}
#marketing .mkt-device-visual{position:relative;min-width:0;padding:66px 50px 94px 24px;border-radius:22px;background:radial-gradient(ellipse at 10% 0%,#cce3cd,transparent 70%),#e8eee4}
#marketing .mkt-device-cloud{position:absolute;top:23px;left:25px;display:flex;align-items:center;gap:9px;font-size:11px;font-weight:600;color:#365a40}
#marketing .mkt-device-cloud svg{width:19px;height:19px}
#marketing .mkt-desktop-capture{overflow:hidden;border:6px solid #fff;border-radius:12px;box-shadow:0 16px 35px #14241c1a}
#marketing .mkt-phone-capture{position:absolute;right:20px;top:112px;width:31%;overflow:hidden;border:5px solid #173b29;border-radius:22px;box-shadow:0 12px 28px #14241c33;background:#fff}
#marketing .mkt-phone-capture img{border-radius:15px}
@media(max-width:950px){#marketing .mkt-anywhere-inner{gap:35px}#marketing .mkt-device-visual{padding:65px 35px 105px 18px}#marketing .mkt-phone-capture{right:13px;top:110px;width:34%;border-width:4px;border-radius:18px}}
@media(max-width:760px){#marketing .mkt-anywhere{padding-bottom:56px}#marketing .mkt-anywhere-inner{grid-template-columns:1fr;gap:30px}#marketing .mkt-anywhere-copy{max-width:540px}#marketing .mkt-anywhere-lede{max-width:none}#marketing .mkt-device-visual{max-width:610px;width:100%;justify-self:center;padding:65px 60px 105px 25px}#marketing .mkt-phone-capture{right:25px;width:29%;top:110px}}
@media(max-width:480px){#marketing .mkt-device-visual{padding:61px 38px 95px 15px;border-radius:16px}#marketing .mkt-device-cloud{left:17px;top:22px;font-size:10px;gap:7px}#marketing .mkt-phone-capture{right:13px;top:103px;width:32%;border-radius:15px;border-width:4px}#marketing .mkt-phone-capture img{border-radius:10px}#marketing .mkt-desktop-capture{border-width:4px;border-radius:8px}}

#marketing .mkt-audience{max-width:640px;margin:22px 0 0;font-size:13px;line-height:1.7;color:var(--mkt-muted)}
#marketing .mkt-anywhere{padding-top:88px}
@media(max-width:760px){#marketing .mkt-anywhere{padding-top:56px}}

@media(max-width:950px){#marketing .mkt-nav{display:none}}
@media(min-width:601px) and (max-width:950px){#marketing .mkt-header-actions{margin-left:auto}#marketing .mkt-menu{display:block}#marketing .mkt-menu>summary{display:grid;place-items:center;list-style:none;width:28px;height:40px;cursor:pointer}#marketing .mkt-menu>summary::-webkit-details-marker{display:none}#marketing .mkt-menu>summary svg{width:21px;height:21px}#marketing .mkt-menu nav{position:absolute;right:32px;top:68px;width:210px;padding:12px;display:grid;background:#fff;border:1px solid var(--mkt-line);border-radius:12px;box-shadow:0 15px 40px #14241c20}#marketing .mkt-menu nav a,#marketing .mkt-menu nav button{padding:12px;text-align:left;background:none;border:0;font-size:14px;color:var(--mkt-ink)}}

/* Device frame surrounds the original mobile capture. */
#marketing .mkt-phone-capture{width:33%;aspect-ratio:9/19.5;padding:5px;border:1px solid #626664;border-radius:30px;background:linear-gradient(125deg,#707572,#252a27 35%,#565c58 80%,#888d89);box-shadow:0 20px 35px #14241c38,0 0 0 1px #101a13, inset 0 0 0 2px #b5b9b34d;overflow:visible}
#marketing .mkt-phone-screen{position:relative;display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden;border-radius:24px;border:2px solid #111814;background:#fff}
#marketing .mkt-phone-status{height:25px;flex-shrink:0;display:flex;align-items:center;justify-content:flex-end;gap:3px;padding:5px 9px 0;background:#fff;color:#18241b}
#marketing .mkt-phone-status>span:first-child{margin-right:auto;font:600 7px/1 "Segoe UI",Arial,sans-serif}
#marketing .mkt-phone-island{position:absolute;left:50%;top:5px;transform:translateX(-50%);width:31%;height:12px;background:#0c110e;border-radius:20px;box-shadow:inset -8px 0 0 #111914}
#marketing .mkt-phone-island:after{content:"";position:absolute;right:7px;top:4px;width:4px;height:4px;border-radius:50%;background:#142130;box-shadow:inset 0 0 0 1px #1b2c38}
#marketing .mkt-phone-status svg{width:10px;height:10px;stroke-width:2}
#marketing .mkt-phone-screen>img{width:100%;height:0;min-height:0;flex:1;object-fit:cover;object-position:top;border-radius:0}
#marketing .mkt-phone-home{height:14px;flex-shrink:0;position:relative;background:#f7f9f6}
#marketing .mkt-phone-home:after{content:"";position:absolute;bottom:4px;left:33%;width:34%;height:3px;border-radius:8px;background:#19261f}
#marketing .mkt-phone-buttons{position:absolute;left:-3px;top:20%;width:2px;height:10%;border-radius:2px;background:#565d58;box-shadow:0 45px 0 #565d58}
#marketing .mkt-phone-capture:after{content:"";position:absolute;right:-3px;top:30%;width:2px;height:13%;border-radius:2px;background:#565d58}
@media(max-width:950px){#marketing .mkt-phone-capture{width:35%;padding:4px;border-width:1px;border-radius:25px}#marketing .mkt-phone-screen{border-radius:20px}#marketing .mkt-phone-status{height:21px;padding:3px 7px 0}#marketing .mkt-phone-island{height:10px;top:4px}#marketing .mkt-phone-island:after{top:3px;right:6px}}
@media(max-width:760px){#marketing .mkt-phone-capture{width:31%;border-radius:30px}#marketing .mkt-phone-screen{border-radius:25px}}
@media(max-width:480px){#marketing .mkt-phone-capture{width:34%;padding:3px;border-radius:19px}#marketing .mkt-phone-screen{border-radius:15px;border-width:1px}#marketing .mkt-phone-status{height:17px;padding:2px 6px 0;gap:2px}#marketing .mkt-phone-status>span:first-child{font-size:5px}#marketing .mkt-phone-status svg{width:7px;height:7px}#marketing .mkt-phone-island{height:8px;top:3px}#marketing .mkt-phone-island:after{height:3px;width:3px;top:2px;right:4px}#marketing .mkt-phone-home{height:10px}#marketing .mkt-phone-home:after{height:2px;bottom:3px}#marketing .mkt-phone-buttons{box-shadow:0 27px 0 #565d58}}
