body.home-preview-page,
.home-preview-page,
.home-preview-page .site-main,
.home-preview-page .frontend-site {
    background:#fff;
}

.home-preview-page *,
.home-preview-page *::before,
.home-preview-page *::after {
    box-sizing:border-box;
}

.home-preview-page .topbar {
    display:block;
    padding:12px 0;
    background:linear-gradient(180deg,#fff 0%,#fbfffe 100%);
    border-bottom:1px solid #e7eef1;
    box-shadow:0 10px 28px rgba(15,23,42,.045);
    backdrop-filter:blur(18px);
}

.home-preview-page .topbar .nav {
    width:calc(100% - 28px);
    max-width:none;
    min-height:76px;
    padding:0 26px;
    border:1px solid #dce8ec;
    border-radius:15px;
    background:rgba(255,255,255,.96);
    box-shadow:0 16px 42px rgba(15,23,42,.1);
}

.home-preview-page .topbar .links,
.home-preview-page .topbar .nav-actions,
.home-preview-page .topbar .links a,
.home-preview-page .topbar .nav-actions a,
.home-preview-page .topbar .nav-dropdown summary,
.home-preview-page .topbar .language-switcher summary {
    font-weight:600;
}

.home-preview-page .topbar .links a.active,
.home-preview-page .topbar .nav-actions a.active:not(.btn),
.home-preview-page .topbar .nav-dropdown summary.active {
    font-weight:700;
}

.home-preview-page .topbar .btn.primary {
    font-weight:700;
}

.home-preview-page .preview-nav-shell {
    display:none;
}

.preview-shell {
    width:min(1220px, calc(100% - 36px));
    margin-inline:auto;
}

.preview-nav-shell {
    position:relative;
    z-index:5;
    padding:12px 0;
    background:linear-gradient(180deg,#fff 0%,#fbfffe 100%);
    border-bottom:1px solid #e7eef1;
    box-shadow:0 10px 28px rgba(15,23,42,.045);
}

.preview-nav {
    width:calc(100% - 28px);
    min-height:76px;
    display:grid;
    grid-template-columns:230px minmax(0,1fr) auto;
    align-items:center;
    gap:20px;
    margin-inline:auto;
    padding:0 26px;
    border:1px solid #dce8ec;
    border-radius:15px;
    background:rgba(255,255,255,.96);
    box-shadow:0 16px 42px rgba(15,23,42,.1);
    backdrop-filter:blur(14px);
}

.preview-brand {
    display:inline-flex;
    align-items:center;
}

.preview-brand img {
    width:158px;
    height:auto;
    display:block;
}

.preview-nav-links,
.preview-nav-actions {
    display:flex;
    align-items:center;
}

.preview-nav-links {
    justify-content:center;
    gap:30px;
    flex-wrap:wrap;
}

.preview-nav-actions {
    justify-content:end;
    gap:22px;
}

.preview-mobile-menu {
    display:none;
}

.preview-nav a,
.preview-nav summary,
.preview-mobile-menu-panel a {
    color:#0f2731;
    font-size:15px;
    font-weight:680;
    text-decoration:none;
}

.preview-nav summary {
    cursor:pointer;
    list-style:none;
}

.preview-nav summary::-webkit-details-marker {
    display:none;
}

.preview-mobile-menu summary {
    min-height:40px;
    align-items:center;
    justify-content:center;
    padding:0 18px;
    border:1px solid #dce8ec;
    border-radius:10px;
    background:#fff;
}

.preview-mobile-menu summary::after {
    content:"";
    width:6px;
    height:6px;
    margin:0 0 2px 8px;
    border-right:1.5px solid currentColor;
    border-bottom:1.5px solid currentColor;
    transform:rotate(45deg);
}

.preview-mobile-menu-panel {
    display:grid;
    gap:8px;
    margin-top:10px;
    padding:10px;
    border:1px solid #dce8ec;
    border-radius:12px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.1);
}

.preview-mobile-menu-panel a {
    display:flex;
    min-height:38px;
    align-items:center;
    padding:0 12px;
    border-radius:8px;
    background:#f8fbfb;
}

.preview-nav-dropdown {
    position:relative;
}

.preview-nav-dropdown summary::after {
    content:"";
    display:inline-block;
    width:6px;
    height:6px;
    margin:0 0 2px 6px;
    border-right:1.5px solid currentColor;
    border-bottom:1.5px solid currentColor;
    transform:rotate(45deg);
}

.preview-nav-dropdown-menu {
    position:absolute;
    top:calc(100% + 16px);
    left:50%;
    z-index:20;
    min-width:230px;
    display:none;
    padding:10px;
    border:1px solid #dce8ec;
    border-radius:12px;
    background:#fff;
    box-shadow:0 18px 42px rgba(15,23,42,.14);
    transform:translateX(-50%);
}

.preview-nav-dropdown[open] .preview-nav-dropdown-menu {
    display:grid;
    gap:2px;
}

.preview-nav-dropdown-menu a {
    display:block;
    padding:10px 12px;
    border-radius:8px;
    color:#25364a;
    font-size:14px;
    font-weight:620;
}

.preview-nav-dropdown-menu a:hover,
.preview-nav-dropdown-menu a:focus-visible {
    background:#f2fffc;
    color:#087f78;
    outline:none;
}

.preview-nav .btn {
    min-height:42px;
    padding:0 26px;
    font-size:15px;
    box-shadow:0 10px 20px rgba(8,127,120,.18);
}

.preview-hero {
    position:relative;
    overflow:hidden;
    padding:58px 0 34px;
    background:
        radial-gradient(circle at 82% 24%, rgba(16,185,129,.18), transparent 34%),
        linear-gradient(90deg, #fff 0%, #fff 58%, #f2fffd 100%);
}

.preview-hero::after {
    content:"";
    position:absolute;
    inset:auto 0 0;
    height:1px;
    background:#edf2f4;
}

.preview-hero-grid {
    display:grid;
    grid-template-columns:minmax(330px,.82fr) minmax(560px,1.18fr);
    gap:48px;
    align-items:center;
}

.preview-hero h1,
.preview-section h2,
.preview-starter-band h2,
.preview-cta-strip h2 {
    margin:0;
    color:#06142b;
    letter-spacing:0;
}

.preview-hero h1 {
    max-width:560px;
    margin-top:14px;
    font-size:63px;
    line-height:1.02;
    font-weight:780;
    text-wrap:balance;
}

.preview-hero h1 span {
    color:#087f78;
}

.preview-hero-copy p {
    max-width:540px;
    margin:22px 0 0;
    color:#24364c;
    font-size:20px;
    line-height:1.55;
    font-weight:430;
    text-wrap:pretty;
}

.preview-actions {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:20px;
    margin-top:30px;
}

.preview-text-link {
    color:#087f78;
    font-size:15px;
    font-weight:700;
    text-decoration:none;
}

.preview-text-link::after {
    content:" ->";
}

.preview-trust-row {
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    margin-top:34px;
}

.preview-trust-row span {
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#314155;
    font-size:13px;
    font-weight:520;
}

.preview-trust-row span::before,
.preview-workflow-copy li::before,
.preview-website-copy li::before,
.preview-industry-card small::before {
    content:"";
    width:13px;
    height:13px;
    flex:0 0 13px;
    border-radius:50%;
    border:1px solid #0c938a;
    background:linear-gradient(#fff,#ecfffc);
    box-shadow:inset 0 0 0 4px #fff;
}

.preview-dashboard-showcase {
    position:relative;
    min-height:450px;
}

.preview-app-card {
    overflow:hidden;
    aspect-ratio:1365 / 900;
    border:1px solid #dbe6eb;
    border-radius:13px;
    background:#fff;
    box-shadow:0 22px 70px rgba(15,23,42,.14);
    transform:scale(1.035);
    transform-origin:center right;
}

.preview-ai-scan-card {
    aspect-ratio:1792 / 1024;
    border-color:#dbe6eb;
    background:#fff;
    box-shadow:0 22px 70px rgba(15,23,42,.12);
}

.preview-window-dots {
    display:flex;
    gap:7px;
    height:28px;
    align-items:center;
    padding:0 14px;
    border-bottom:1px solid #ecf1f4;
}

.preview-window-dots i {
    width:8px;
    height:8px;
    border-radius:50%;
    background:#f2a4a4;
}

.preview-window-dots i:nth-child(2) {
    background:#f4d27e;
}

.preview-window-dots i:nth-child(3) {
    background:#8ad9ba;
}

.preview-app-card img,
.preview-form-shot img,
.preview-kanban-shot img,
.preview-website-shot img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:top left;
}

.preview-mock-dashboard {
    display:grid;
    grid-template-columns:118px minmax(0,1fr);
    min-height:430px;
    background:#fff;
}

.preview-mock-dashboard aside {
    display:grid;
    align-content:start;
    gap:8px;
    padding:18px 13px;
    background:linear-gradient(180deg,#052f35,#081f27);
    color:#d8f7f2;
}

.preview-mock-dashboard aside b {
    width:24px;
    height:24px;
    margin-bottom:10px;
    border-radius:8px;
    border:2px solid #16b5aa;
    position:relative;
}

.preview-mock-dashboard aside b::after {
    content:"";
    position:absolute;
    inset:6px;
    border-radius:4px;
    background:#16b5aa;
}

.preview-mock-dashboard aside span {
    min-height:28px;
    display:flex;
    align-items:center;
    padding:0 9px;
    border-radius:7px;
    font-size:12px;
    font-weight:650;
}

.preview-mock-dashboard aside span::before {
    content:"";
    width:10px;
    height:10px;
    margin-right:8px;
    border:1.5px solid currentColor;
    border-radius:3px;
    opacity:.82;
}

.preview-mock-dashboard aside span.active {
    color:#fff;
    background:#0d8d84;
}

.preview-mock-dashboard main {
    display:grid;
    gap:18px;
    padding:26px;
}

.preview-mock-head,
.preview-mock-stats,
.preview-mock-bottom {
    display:grid;
    gap:12px;
}

.preview-mock-head {
    grid-template-columns:1fr auto;
    align-items:center;
}

.preview-mock-head strong {
    color:#06142b;
    font-size:17px;
}

.preview-mock-head button {
    min-height:34px;
    padding:0 14px;
    border:0;
    border-radius:7px;
    background:#087f78;
    color:#fff;
    font:inherit;
    font-size:12px;
    font-weight:720;
}

.preview-mock-stats {
    grid-template-columns:repeat(4,minmax(0,1fr));
}

.preview-mock-stats span,
.preview-mock-board article,
.preview-mock-bottom section {
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    box-shadow:0 8px 20px rgba(15,23,42,.04);
}

.preview-mock-stats span {
    display:grid;
    gap:2px;
    padding:16px 14px;
}

.preview-mock-stats strong {
    color:#06142b;
    font-size:24px;
    line-height:1;
}

.preview-mock-stats small {
    color:#64748b;
    font-size:12px;
    font-weight:520;
}

.preview-mock-pipeline {
    display:grid;
    gap:10px;
}

.preview-mock-pipeline h3,
.preview-mock-bottom h3 {
    margin:0;
    color:#06142b;
    font-size:14px;
    font-weight:740;
}

.preview-mock-board {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.preview-mock-board article {
    display:grid;
    gap:5px;
    padding:13px;
    border-top:3px solid #0d8d84;
}

.preview-mock-board article:nth-child(2) {
    border-top-color:#2563eb;
}

.preview-mock-board article:nth-child(3) {
    border-top-color:#f59e0b;
}

.preview-mock-board article:nth-child(4) {
    border-top-color:#22c55e;
}

.preview-mock-board b {
    color:#64748b;
    font-size:10px;
    letter-spacing:.04em;
}

.preview-mock-board strong {
    color:#06142b;
    font-size:13px;
}

.preview-mock-board small {
    color:#64748b;
    font-size:11px;
}

.preview-mock-bottom {
    grid-template-columns:1fr 1fr;
}

.preview-mock-bottom section {
    padding:14px;
}

.preview-mock-bottom p {
    display:flex;
    justify-content:space-between;
    margin:9px 0 0;
    color:#475569;
    font-size:12px;
}

.preview-mock-bottom p b {
    color:#087f78;
}

.preview-alert {
    position:absolute;
    right:-16px;
    width:178px;
    display:grid;
    gap:4px;
    padding:17px 16px;
    border:1px solid #e2e8f0;
    border-radius:12px;
    background:rgba(255,255,255,.95);
    box-shadow:0 18px 42px rgba(15,23,42,.14);
}

.preview-alert-ready {
    top:24%;
}

.preview-alert-payment {
    top:43%;
}

.preview-alert-stock {
    top:62%;
}

.preview-alert strong {
    color:#06142b;
    font-size:13px;
    font-weight:700;
}

.preview-alert span {
    color:#475569;
    font-size:12px;
    line-height:1.35;
}

.preview-ai-alert {
    border-color:#fed7aa;
}

.preview-ai-alert strong {
    color:#9a3412;
}

.preview-ai-alert::before {
    content:"";
    width:9px;
    height:9px;
    border-radius:999px;
    position:absolute;
    top:15px;
    right:15px;
    background:#f97316;
    box-shadow:0 0 0 5px rgba(249,115,22,.14);
}

.preview-section {
    padding:34px 0;
    border-bottom:1px solid #edf2f4;
    background:#fff;
}

.preview-section-head {
    display:grid;
    gap:8px;
    margin-bottom:24px;
}

.preview-section-head.centered {
    max-width:780px;
    margin-inline:auto;
    text-align:center;
    justify-items:center;
}

.preview-industries-section .preview-section-head {
    margin-bottom:18px;
}

.preview-industries-section h2 {
    font-size:28px;
}

.preview-section h2,
.preview-starter-band h2,
.preview-cta-strip h2 {
    font-size:38px;
    line-height:1.1;
    font-weight:760;
    text-wrap:balance;
}

.preview-section-head p,
.preview-report-copy p,
.preview-starter-copy p,
.preview-kanban-copy p,
.preview-website-copy p,
.preview-cta-strip p {
    margin:0;
    color:#334155;
    font-size:18px;
    line-height:1.55;
    font-weight:430;
    text-wrap:pretty;
}

.preview-tool-grid {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:18px;
    max-width:1180px;
    margin-inline:auto;
}

.preview-tool-card {
    position:relative;
    min-height:184px;
    display:grid;
    justify-items:center;
    align-content:center;
    gap:13px;
    padding:24px 20px;
    border:1px solid #dce6ea;
    border-radius:12px;
    background:#fff;
    text-align:center;
    box-shadow:0 16px 38px rgba(15,23,42,.05);
}

.preview-tool-icon {
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    border-radius:14px;
    background:#e8fbf8;
    color:#087f78;
}

.preview-tool-icon svg {
    width:33px;
    height:33px;
    fill:none;
    stroke:currentColor;
    stroke-width:2.4;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.preview-tool-icon-repairs {
    background:#e3fbf7;
    color:#087f78;
}

.preview-tool-icon-pos {
    background:#eff6ff;
    color:#2563eb;
}

.preview-tool-icon-inventory {
    background:#fff7ed;
    color:#ea580c;
}

.preview-tool-icon-customers {
    background:#f5f3ff;
    color:#7c3aed;
}

.preview-tool-icon-online {
    background:#fff1f2;
    color:#e11d48;
}

.preview-tool-icon-ai {
    background:#fff7ed;
    color:#ea580c;
}

.preview-tool-icon-accounts {
    background:#ecfeff;
    color:#0891b2;
}

.preview-tool-card strong {
    color:#06142b;
    font-size:17px;
    font-weight:720;
}

.preview-tool-card p {
    margin:0;
    color:#526174;
    font-size:14.5px;
    line-height:1.45;
    font-weight:430;
}

.preview-workflow-section {
    padding-top:30px;
    background:#fff;
}

.preview-workflow-grid {
    display:grid;
    grid-template-columns:250px minmax(260px,.65fr) minmax(360px,1.1fr);
    gap:22px;
    align-items:stretch;
    padding:18px;
    border:1px solid #e2e8f0;
    border-radius:18px;
    background:#fff;
    box-shadow:0 18px 44px rgba(15,23,42,.055);
}

.preview-step-list {
    display:grid;
    gap:10px;
    align-content:start;
    min-width:0;
    max-width:100%;
}

.preview-step {
    width:100%;
    min-height:54px;
    padding:0 16px;
    border:1px solid #dce6ea;
    border-radius:8px;
    background:#fff;
    color:#1e293b;
    text-align:left;
    font:inherit;
    font-size:15px;
    font-weight:640;
    cursor:pointer;
}

.preview-step.is-active {
    color:#04766d;
    border-color:#8fd4cd;
    background:#f2fffc;
    box-shadow:0 14px 28px rgba(8,127,120,.12);
}

.preview-step:focus-visible {
    outline:2px solid rgba(8,127,120,.32);
    outline-offset:2px;
}

.preview-workflow-copy {
    display:grid;
    align-content:center;
    gap:14px;
    padding:12px 12px 12px 22px;
}

.preview-workflow-copy h2 {
    font-size:28px;
}

.preview-workflow-copy p {
    margin:0;
    color:#334155;
    font-size:16px;
    line-height:1.55;
    font-weight:430;
}

.preview-workflow-copy ul,
.preview-website-copy ul {
    display:grid;
    gap:9px;
    margin:0;
    padding:0;
    list-style:none;
}

.preview-workflow-copy li,
.preview-website-copy li {
    display:flex;
    align-items:center;
    gap:9px;
    color:#334155;
    font-size:14px;
    font-weight:520;
}

.preview-form-shot {
    position:relative;
    overflow:hidden;
    min-height:260px;
    aspect-ratio:1365 / 900;
    margin:0;
    border:1px solid #e2e8f0;
    border-radius:14px;
    background:#f8fafc;
    cursor:zoom-in;
    transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.preview-form-shot:hover,
.preview-form-shot:focus-visible {
    border-color:#8fd4cd;
    box-shadow:0 18px 42px rgba(8,127,120,.12);
    outline:none;
}

.preview-shot-zoom {
    position:absolute;
    right:12px;
    bottom:12px;
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border:1px solid rgba(255,255,255,.76);
    border-radius:999px;
    background:rgba(255,255,255,.92);
    color:#064e49;
    box-shadow:0 12px 26px rgba(15,23,42,.16);
    backdrop-filter:blur(8px);
    pointer-events:none;
}

.preview-shot-zoom svg {
    width:18px;
    height:18px;
    fill:none;
    stroke:currentColor;
    stroke-width:2.2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.preview-image-lightbox[hidden] {
    display:none;
}

.preview-image-lightbox {
    position:fixed;
    inset:0;
    z-index:1000;
    display:grid;
    place-items:center;
    padding:28px;
    background:rgba(9,18,32,.78);
    backdrop-filter:blur(6px);
}

.preview-lightbox-open {
    overflow:hidden;
}

.preview-image-lightbox-inner {
    display:grid;
    gap:12px;
    width:min(1180px, 94vw);
}

.preview-image-lightbox-inner img {
    display:block;
    width:100%;
    max-height:82vh;
    object-fit:contain;
    border:1px solid rgba(255,255,255,.2);
    border-radius:18px;
    background:#fff;
    box-shadow:0 30px 90px rgba(0,0,0,.36);
}

.preview-image-lightbox-inner p {
    margin:0;
    justify-self:start;
    display:inline-flex;
    min-height:30px;
    align-items:center;
    padding:0 12px;
    border-radius:999px;
    background:rgba(255,255,255,.96);
    color:#172037;
    font-size:14px;
    font-weight:650;
}

.preview-image-lightbox-close {
    position:fixed;
    top:18px;
    right:18px;
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border:1px solid rgba(255,255,255,.32);
    border-radius:50%;
    background:#fff;
    color:#172037;
    font-size:28px;
    line-height:1;
    cursor:pointer;
    box-shadow:0 18px 42px rgba(0,0,0,.18);
}

.preview-image-lightbox-close:focus-visible {
    outline:3px solid rgba(255,255,255,.42);
    outline-offset:3px;
}

.preview-report-grid {
    display:grid;
    grid-template-columns:270px minmax(0,1fr);
    gap:28px;
    align-items:center;
}

.preview-report-copy {
    display:grid;
    gap:15px;
}

.preview-report-panel {
    display:grid;
    gap:14px;
    padding:14px;
    border:1px solid #e2e8f0;
    border-radius:15px;
    background:#fff;
    box-shadow:0 14px 34px rgba(15,23,42,.052);
}

.preview-report-panel-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:4px 3px 0;
}

.preview-report-panel-head strong {
    color:#06142b;
    font-size:16px;
    font-weight:780;
}

.preview-report-panel-head span {
    color:#087f78;
    font-size:13px;
    font-weight:760;
}

.preview-stat-row {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.preview-stat-row span {
    display:grid;
    gap:3px;
    padding:16px;
    border:1px solid #e6edf1;
    border-radius:10px;
}

.preview-stat-row strong {
    color:#06142b;
    font-size:24px;
    font-weight:760;
}

.preview-stat-row small {
    color:#64748b;
    font-size:13px;
    font-weight:520;
}

.preview-chart-grid {
    display:grid;
    grid-template-columns:1.35fr .65fr;
    gap:12px;
}

.preview-report-list,
.preview-donut {
    min-height:180px;
    border:1px solid #e6edf1;
    border-radius:10px;
    background:#fff;
}

.preview-report-list {
    display:grid;
    align-content:center;
    padding:20px;
}

.preview-report-list div {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:13px 0;
    border-bottom:1px solid #edf2f4;
}

.preview-report-list div:last-child {
    border-bottom:0;
}

.preview-report-list span {
    color:#526179;
    font-size:14px;
    font-weight:650;
}

.preview-report-list strong {
    color:#06142b;
    font-size:16px;
    font-weight:820;
}

.preview-donut {
    display:grid;
    place-items:center;
}

.preview-donut span {
    width:110px;
    height:110px;
    border-radius:50%;
    background:conic-gradient(#087f78 0 58%, #f4b63c 58% 78%, #2563eb 78% 92%, #e2e8f0 92% 100%);
    position:relative;
}

.preview-donut span::after {
    content:"";
    position:absolute;
    inset:28px;
    border-radius:50%;
    background:#fff;
}

.preview-industry-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
    max-width:1220px;
    margin-inline:auto;
}

.preview-industry-card {
    overflow:hidden;
    display:grid;
    grid-template-rows:205px 1fr;
    min-height:360px;
    border:1px solid #e0e8ed;
    border-radius:16px;
    background:#fff;
    color:inherit;
    text-decoration:none;
    box-shadow:0 14px 32px rgba(15,23,42,.055);
    transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.preview-industry-card:hover,
.preview-industry-card:focus-visible {
    transform:translateY(-2px);
    border-color:#8fd4cd;
    box-shadow:0 22px 45px rgba(15,23,42,.09);
    outline:none;
}

.preview-industry-card span {
    display:grid;
    align-content:start;
    gap:9px;
    padding:18px 18px 20px;
}

.preview-industry-card strong {
    color:#06142b;
    font-size:19px;
    line-height:1.1;
    font-weight:720;
}

.preview-industry-card small {
    display:block;
    color:#435369;
    font-size:14px;
    line-height:1.45;
    font-weight:450;
}

.preview-industry-card small::before {
    display:none;
}

.preview-industry-card b {
    margin-top:6px;
    color:#087f78;
    font-size:14px;
    font-weight:720;
}

.preview-industry-media {
    overflow:hidden;
    min-height:205px;
    border-bottom:1px solid #edf2f4;
    background:#f8fbfb;
}

.preview-industry-card img {
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    display:block;
}

.preview-industry-card.is-watch img {
    transform:scale(1.29);
    transform-origin:center center;
    object-position:center center;
}

.preview-starter-band {
    overflow:hidden;
    padding:34px 0;
    background:linear-gradient(105deg,#07736e,#075d62 55%,#034248);
    color:#fff;
}

.preview-starter-grid {
    display:grid;
    grid-template-columns:minmax(320px,.9fr) minmax(330px,1.1fr);
    gap:40px;
    align-items:center;
}

.preview-starter-visual {
    position:relative;
    display:grid;
    grid-template-columns:1fr .82fr;
    gap:14px;
    min-height:314px;
    align-content:center;
    padding:10px 0;
}

.preview-starter-card {
    position:relative;
    overflow:hidden;
    min-height:142px;
    border:1px solid rgba(255,255,255,.24);
    border-radius:16px;
    background:#fff;
    box-shadow:0 24px 54px rgba(0,0,0,.16);
    backdrop-filter:blur(14px);
    color:inherit;
    text-decoration:none;
}

.preview-starter-card:hover,
.preview-starter-card:focus-visible {
    border-color:rgba(255,255,255,.55);
    transform:translateY(-2px);
    outline:none;
}

.preview-starter-card img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.preview-starter-card::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(4,36,40,.08) 0%, rgba(4,36,40,.76) 100%);
}

.preview-starter-card-body {
    position:absolute;
    inset:auto 0 0;
    z-index:1;
    display:grid;
    gap:5px;
    padding:16px;
}

.preview-starter-card span,
.preview-starter-card small {
    display:block;
    color:#d8fffb;
    font-size:13px;
    font-weight:650;
}

.preview-starter-card strong {
    display:block;
    color:#fff;
    font-size:22px;
    line-height:1.18;
    font-weight:760;
}

.preview-starter-card.is-large {
    grid-row:span 2;
    min-height:310px;
}

.preview-starter-card.is-large .preview-starter-card-body {
    padding:22px;
}

.preview-starter-card.is-large .preview-starter-stats {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:18px;
}

.preview-starter-card.is-large .preview-starter-stats b {
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:0 12px;
    border-radius:999px;
    background:#fff;
    color:#075d62;
    font-size:13px;
    font-weight:760;
}

.preview-starter-card.is-small {
    width:100%;
}

.preview-starter-card.is-small:nth-child(2) {
    margin-left:0;
}

.preview-starter-card.is-small:nth-child(3) {
    margin-left:0;
}

.preview-starter-card.is-small strong {
    margin-top:4px;
    font-size:16px;
}

.preview-starter-copy {
    display:grid;
    gap:16px;
}

.preview-starter-band h2,
.preview-cta-strip h2 {
    color:#fff;
}

.preview-starter-copy p,
.preview-cta-strip p {
    color:#e8fffb;
}

.preview-starter-points {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:6px;
}

.preview-starter-points span {
    min-height:76px;
    padding:14px;
    border:1px solid rgba(255,255,255,.24);
    border-radius:12px;
    color:#f7fffe;
    font-size:14px;
    font-weight:650;
}

.preview-kanban-grid {
    display:grid;
    grid-template-columns:minmax(300px,.55fr) minmax(520px,1fr);
    gap:28px;
    align-items:center;
    padding:28px;
    border:1px solid #e2e8f0;
    border-radius:16px;
    background:#fff;
    box-shadow:0 22px 54px rgba(15,23,42,.06);
}

.preview-kanban-copy {
    display:grid;
    align-content:center;
    gap:16px;
    min-width:0;
}

.preview-kanban-copy h2 {
    max-width:16ch;
    font-size:38px;
    line-height:1.08;
}

.preview-kanban-points {
    display:grid;
    gap:10px;
    margin-top:6px;
}

.preview-kanban-points span {
    display:flex;
    align-items:center;
    gap:10px;
    min-height:40px;
    color:#06142b;
    font-size:15px;
    font-weight:760;
}

.preview-kanban-points span::before {
    content:"";
    width:11px;
    height:11px;
    flex:0 0 11px;
    border:1px solid var(--preview-brand);
    border-radius:999px;
}

.preview-kanban-shot {
    position:relative;
    overflow:hidden;
    min-height:360px;
    margin:0;
    border:1px solid #dbe7e5;
    border-radius:16px;
    background:#f8fbfa;
    box-shadow:0 18px 44px rgba(15,23,42,.07);
    cursor:pointer;
}

.preview-kanban-shot img {
    object-fit:cover;
    object-position:top center;
}

.preview-website-grid {
    display:grid;
    grid-template-columns:300px minmax(0,1fr);
    gap:26px;
    align-items:stretch;
}

.preview-website-copy {
    display:grid;
    gap:14px;
    align-content:center;
}

.preview-website-shot {
    overflow:hidden;
    min-height:340px;
    margin:0;
    border:1px solid #e2e8f0;
    border-radius:16px;
    background:#fff;
    box-shadow:0 18px 44px rgba(15,23,42,.06);
}

.preview-website-themes {
    display:grid;
    grid-template-columns:1.35fr .75fr;
    grid-template-rows:repeat(3, 1fr);
    gap:16px;
    min-height:370px;
}

.preview-theme-card {
    position:relative;
    overflow:hidden;
    min-height:0;
    border:1px solid #cbd5e1;
    border-radius:14px;
    background:#fff;
    color:#06142b;
    text-decoration:none;
    box-shadow:0 22px 54px rgba(15,23,42,.14);
    transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.preview-theme-card::after {
    content:"";
    position:absolute;
    inset:0;
    border-radius:13px;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.88);
    pointer-events:none;
}

.preview-theme-card.is-featured {
    grid-row:1 / span 3;
}

.preview-website-themes.is-industry-theme-grid {
    grid-template-columns:1.35fr .75fr;
    grid-template-rows:repeat(2, 1fr);
    min-height:385px;
}

.preview-website-themes.is-industry-theme-grid .preview-theme-card {
    min-height:0;
}

.preview-website-themes.is-industry-theme-grid .preview-theme-card.is-featured {
    grid-column:1;
    grid-row:1 / span 2;
    min-height:385px;
}

.preview-theme-card img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:top left;
}

.preview-ai-scan-card img {
    object-position:center;
}

.preview-hero-slider {
    position:relative;
}

.preview-hero-slider-stage {
    position:absolute;
    inset:28px 0 0;
    overflow:hidden;
    background:#fff;
}

.preview-hero-slide {
    position:absolute;
    inset:0;
    opacity:0;
    pointer-events:none;
    transition:opacity .42s ease;
}

.preview-hero-slide.is-active {
    opacity:1;
    pointer-events:auto;
}

.preview-hero-slide:nth-child(2) {
    object-position:top left;
}

.preview-hero-slider-controls {
    position:absolute;
    left:14px;
    bottom:14px;
    z-index:5;
    display:flex;
    align-items:center;
    gap:6px;
    padding:6px;
    border:1px solid rgba(213,222,231,.82);
    border-radius:999px;
    background:rgba(255,255,255,.9);
    box-shadow:0 12px 28px rgba(15,23,42,.12);
    backdrop-filter:blur(10px);
}

.preview-hero-slider-dots {
    display:flex;
    align-items:center;
    gap:6px;
}

.preview-hero-slider-controls button {
    appearance:none;
    border:0;
    border-radius:999px;
    background:#eef7f5;
    color:#087f78;
    cursor:pointer;
    transition:background .18s ease, color .18s ease, transform .18s ease;
}

.preview-hero-slider-controls button:hover {
    background:#087f78;
    color:#fff;
    transform:translateY(-1px);
}

.preview-hero-slider-controls button:focus-visible {
    outline:3px solid rgba(8,127,120,.24);
    outline-offset:2px;
}

.preview-hero-slider-arrow {
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    padding:0;
    font-size:22px;
    line-height:1;
    font-weight:850;
}

.preview-hero-slider-dot {
    width:8px;
    height:8px;
    min-height:8px;
    padding:0;
}

.preview-hero-slider-dot.is-active {
    width:20px;
    background:#ff6b16;
}

.preview-ai-badge {
    position:absolute;
    top:-18px;
    right:-38px;
    z-index:4;
    width:102px;
    height:102px;
    display:grid;
    place-items:center;
    align-content:center;
    gap:0;
    border:3px solid rgba(255,255,255,.92);
    border-radius:50%;
    background:
        radial-gradient(circle at 32% 24%, rgba(255,255,255,.38), transparent 28%),
        linear-gradient(135deg,#7c3aed 0%,#5b21b6 48%,#f97316 100%);
    color:#fff;
    text-align:center;
    text-decoration:none;
    box-shadow:0 22px 46px rgba(91,33,182,.3);
    transition:transform .18s ease, box-shadow .18s ease;
}

.preview-ai-badge:hover,
.preview-ai-badge:focus-visible {
    outline:0;
    transform:translateY(-2px) scale(1.03);
    box-shadow:0 28px 56px rgba(91,33,182,.36);
}

.preview-ai-badge strong {
    font-size:34px;
    line-height:.9;
    font-weight:900;
    letter-spacing:0;
}

.preview-ai-badge span {
    font-size:14px;
    font-weight:850;
}

.preview-theme-card:hover,
.preview-theme-card:focus-visible {
    border-color:#7dd3c7;
    box-shadow:0 26px 62px rgba(8,127,120,.2);
    transform:translateY(-2px);
    outline:none;
}

.preview-cta-strip {
    padding:28px 0;
    background:#fff;
}

.preview-cta-grid {
    display:grid;
    grid-template-columns:minmax(0,1fr) 170px 230px;
    gap:20px;
    align-items:center;
    min-height:134px;
    padding:24px 34px;
    border-radius:14px;
    background:linear-gradient(105deg,#10aaa0,#07736e 58%,#03545a);
    color:#fff;
    box-shadow:0 18px 46px rgba(7,115,110,.2);
}

.home-preview-page .preview-cta-help {
    display:grid;
    gap:5px;
    min-height:62px;
    align-content:center;
    padding:10px 12px;
    border:1px solid rgba(255,255,255,.26);
    border-radius:10px;
    background:rgba(255,255,255,.08);
    color:#fff;
    font-size:14px;
    line-height:1.4;
    font-weight:650;
    text-decoration:none;
    transition:background .18s ease, border-color .18s ease, transform .18s ease;
}

.home-preview-page .preview-cta-help b {
    color:#fff;
    font-size:14px;
    font-weight:850;
}

.home-preview-page .preview-cta-help:visited,
.home-preview-page .preview-cta-help:hover,
.home-preview-page .preview-cta-help:focus-visible {
    color:#fff;
    border-color:rgba(255,255,255,.52);
    background:rgba(255,255,255,.14);
    transform:translateY(-1px);
    outline:none;
}

.preview-faq-section {
    padding-bottom:80px;
}

.preview-faq-head {
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:center;
    margin-bottom:18px;
}

.preview-faq-head a {
    color:#087f78;
    font-size:15px;
    font-weight:720;
    text-decoration:none;
}

.preview-faq-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}

.preview-faq-grid article {
    padding:18px;
    border:1px solid #e2e8f0;
    border-radius:12px;
    background:#fff;
}

.preview-faq-grid strong {
    color:#06142b;
    font-size:16px;
    font-weight:720;
}

.preview-faq-grid p {
    margin:8px 0 0;
    color:#475569;
    font-size:15px;
    line-height:1.45;
}

.compact {
    width:max-content;
    min-height:42px;
    padding-inline:18px;
}

.btn.light {
    background:#fff;
    color:#087f78;
    border-color:#fff;
}

@media (max-width: 1080px) {
    .preview-nav {
        grid-template-columns:1fr;
        justify-items:center;
        gap:14px;
        padding:18px;
    }

    .preview-nav-links {
        order:3;
        gap:16px 24px;
    }

    .preview-nav-actions {
        justify-content:center;
    }

    .preview-hero h1 {
        max-width:720px;
        font-size:51px;
    }

    .preview-section h2,
    .preview-starter-band h2,
    .preview-cta-strip h2 {
        font-size:34px;
    }

    .home-preview-page .topbar {
        margin:0;
        max-width:none;
        border-radius:0;
    }

    .preview-hero-grid,
    .preview-workflow-grid,
    .preview-report-grid,
    .preview-starter-grid,
    .preview-kanban-grid,
    .preview-website-grid,
    .preview-cta-grid {
        grid-template-columns:1fr;
    }

    .preview-dashboard-showcase {
        min-height:0;
    }

    .preview-app-card {
        transform:none;
    }

    .preview-ai-badge {
        top:-24px;
        right:8px;
    }

    .preview-alert {
        position:static;
        width:auto;
        margin-top:10px;
    }

    .preview-tool-grid,
    .preview-industry-grid,
    .preview-faq-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .preview-starter-visual {
        display:none;
    }

    .preview-kanban-copy h2 {
        max-width:none;
    }
}

@media (max-width: 680px) {
    .preview-shell {
        width:min(100% - 24px, 1220px);
    }

    .preview-hero {
        padding-top:34px;
    }

    .preview-nav-shell {
        padding:0;
    }

    .preview-nav {
        width:100%;
        border-radius:0;
        border-left:0;
        border-right:0;
        box-shadow:0 10px 26px rgba(15,23,42,.08);
    }

    .preview-brand img {
        width:138px;
    }

    .preview-nav-links {
        width:100%;
        display:none;
    }

    .preview-nav a,
    .preview-nav summary {
        font-size:14px;
    }

    .preview-mobile-menu {
        width:100%;
        display:block;
        order:3;
    }

    .preview-mobile-menu summary {
        display:flex;
    }

    .preview-nav-dropdown-menu {
        left:0;
        right:0;
        transform:none;
        min-width:0;
    }

    .preview-hero h1 {
        font-size:39px;
    }

    .preview-ai-badge {
        width:76px;
        height:76px;
        border-width:2px;
    }

    .preview-ai-badge strong {
        font-size:26px;
    }

    .preview-ai-badge span {
        font-size:12px;
    }

    .preview-hero-slider-controls {
        left:10px;
        bottom:10px;
        padding:5px;
    }

    .preview-hero-slider-arrow {
        width:26px;
        height:26px;
        font-size:20px;
    }

    .preview-actions .btn,
    .preview-actions .preview-text-link {
        width:100%;
        justify-content:center;
        text-align:center;
    }

    .preview-tool-grid,
    .preview-industry-grid,
    .preview-stat-row,
    .preview-chart-grid,
    .preview-starter-points,
    .preview-faq-grid {
        grid-template-columns:1fr;
    }

    .preview-workflow-grid,
    .preview-report-panel,
    .preview-cta-grid {
        padding:16px;
    }

    .preview-step-list {
        display:grid;
        width:100%;
        max-width:100%;
    }

    .preview-step {
        min-width:0;
    }

    .preview-form-shot {
        width:100%;
        max-width:100%;
        min-height:0;
    }

    .preview-website-themes {
        grid-template-columns:1fr;
        grid-template-rows:none;
        min-height:0;
    }

    .preview-website-themes.is-industry-theme-grid {
        grid-template-columns:1fr;
        grid-template-rows:none;
    }

    .preview-theme-card,
    .preview-theme-card.is-featured,
    .preview-website-themes.is-industry-theme-grid .preview-theme-card,
    .preview-website-themes.is-industry-theme-grid .preview-theme-card.is-featured {
        min-height:210px;
        grid-column:auto;
        grid-row:auto;
    }

    .preview-industry-card {
        grid-template-columns:1fr;
        min-height:0;
    }

    .preview-industry-media {
        height:210px;
    }

    .preview-industry-card.is-watch img {
        transform:scale(1.08);
    }

    .preview-section {
        padding:28px 0;
    }

    .preview-section h2,
    .preview-starter-band h2,
    .preview-cta-strip h2,
    .preview-kanban-copy h2 {
        font-size:30px;
    }

    .preview-section-head p,
    .preview-report-copy p,
    .preview-starter-copy p,
    .preview-kanban-copy p,
    .preview-website-copy p,
    .preview-cta-strip p {
        font-size:16px;
    }

    .preview-cta-grid {
        gap:16px;
        min-height:0;
        text-align:center;
    }

    .preview-cta-grid .btn,
    .preview-cta-help,
    .compact {
        width:100%;
        justify-content:center;
        text-align:center;
    }
}
