/* Turnli 0.23.0-rc1.28 — public-site performance, PWA, error/offline and responsive polish. */
:root{--turnli-public-safe-bottom:max(16px,env(safe-area-inset-bottom));}

/* Reduce below-the-fold layout work without changing the visual design. */
@supports (content-visibility:auto){
  .mk-page main>section:not(:first-child){content-visibility:auto;contain-intrinsic-size:auto 760px;}
}

/* Make keyboard focus unmistakable across the marketing journey. */
.mk-page :where(a,button,input,summary):focus-visible,
.turnli-public-state :where(a,button):focus-visible{
  outline:3px solid color-mix(in srgb,#6755df 72%,white);
  outline-offset:3px;
  border-radius:12px;
}

/* Prevent subtle horizontal drift on very small phones and large zoom levels. */
.mk-page{overflow-x:clip;}
.mk-page img,.mk-page svg{max-width:100%;}
.mk-page .mk-shell{width:min(1180px,calc(100% - 40px));}

/* Progressive pricing loading state. */
.mk-pricing-fallback[data-pricing-state="idle"],
.mk-pricing-fallback[data-pricing-state="loading"]{
  min-height:168px;
  display:grid;
  place-items:center;
  border:1px solid rgba(26,22,45,.09);
  border-radius:24px;
  background:linear-gradient(135deg,rgba(103,85,223,.05),rgba(255,255,255,.9));
  color:#777386;
}
.mk-pricing-fallback[data-pricing-state="loading"]::before{
  content:"";
  width:28px;height:28px;margin-right:10px;
  border-radius:50%;border:3px solid rgba(103,85,223,.16);border-top-color:#6755df;
  animation:turnli-public-spin .8s linear infinite;
}
@keyframes turnli-public-spin{to{transform:rotate(360deg)}}

/* Small-screen hardening across public pages. */
@media (max-width:520px){
  .mk-page .mk-shell{width:min(100% - 28px,1180px);}
  .mk-header .mk-nav{min-height:68px;}
  .mk-brand img{width:32px;height:32px;}
  .mk-button{min-height:46px;}
  .mk-hero-actions,.mk-final-cta-actions,.mk-usecase-final-actions,.support-hero-actions-v124,.support-path-actions-v124{align-items:stretch;}
  .mk-hero-actions .mk-button,.mk-final-cta-actions .mk-button,.mk-usecase-final-actions .mk-button,.support-hero-actions-v124 .mk-button,.support-path-actions-v124 .mk-button{width:100%;justify-content:center;}
  .mk-footer-trust-inner-v124{gap:12px;align-items:flex-start;}
  .mk-footer-trust-points-v124{gap:8px;flex-wrap:wrap;}
  .mk-footer-trust-points-v124 span{font-size:12px;}
}
@media (max-width:360px){
  .mk-page .mk-shell{width:calc(100% - 22px);}
  .mk-hero-v2-copy h1{font-size:clamp(42px,14vw,56px);letter-spacing:-.055em;}
  .mk-hero-lead{font-size:16px;}
  .mk-mobile-nav{left:10px;right:10px;}
  .mk-price-value strong{font-size:42px;}
}

/* Dedicated lightweight 404/offline states. */
.turnli-public-state{
  min-height:100dvh;
  margin:0;
  color:#1d1b25;
  background:
    radial-gradient(circle at 18% 12%,rgba(115,92,238,.15),transparent 34%),
    radial-gradient(circle at 88% 76%,rgba(121,233,203,.13),transparent 31%),
    #f8f7fb;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  display:flex;flex-direction:column;
}
.public-state-header{height:78px;display:flex;align-items:center;}
.public-state-shell{width:min(1120px,calc(100% - 40px));margin:0 auto;}
.public-state-brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;color:#201d2a;font-weight:800;font-size:19px;letter-spacing:-.03em;}
.public-state-brand img{width:36px;height:36px;}
.public-state-main{flex:1;display:grid;place-items:center;padding:54px 0 76px;}
.public-state-card{position:relative;overflow:hidden;border:1px solid rgba(34,29,58,.09);border-radius:34px;background:rgba(255,255,255,.83);box-shadow:0 28px 80px rgba(39,31,79,.11);padding:clamp(30px,6vw,64px);isolation:isolate;}
.public-state-card::before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;right:-150px;top:-190px;background:linear-gradient(145deg,rgba(103,85,223,.2),rgba(128,105,239,.03));z-index:-1;}
.public-state-kicker{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#6655df;}
.public-state-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:#73e4c0;box-shadow:0 0 0 5px rgba(115,228,192,.16);}
.public-state-code{margin:22px 0 0;font-size:clamp(64px,13vw,128px);line-height:.82;font-weight:850;letter-spacing:-.08em;color:#211d31;}
.public-state-card h1{max-width:760px;margin:26px 0 14px;font-size:clamp(34px,5.3vw,62px);line-height:1.01;letter-spacing:-.055em;}
.public-state-card>p{max-width:680px;margin:0;color:#706c7c;font-size:18px;line-height:1.65;}
.public-state-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;}
.public-state-button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 20px;border-radius:15px;text-decoration:none;font-weight:760;letter-spacing:-.015em;border:1px solid rgba(32,28,48,.11);color:#272333;background:white;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
.public-state-button.is-primary{background:linear-gradient(135deg,#7662ee,#5941d3);color:#fff;border-color:transparent;box-shadow:0 12px 28px rgba(89,65,211,.22);}
.public-state-button:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(39,31,79,.12);}
.public-state-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:42px;}
.public-state-link{display:block;text-decoration:none;color:#282433;border:1px solid rgba(34,29,58,.08);background:rgba(249,248,252,.78);border-radius:18px;padding:18px;}
.public-state-link strong{display:block;font-size:14px;margin-bottom:5px;}
.public-state-link span{display:block;color:#797584;font-size:13px;line-height:1.45;}
.public-state-footer{padding:0 0 var(--turnli-public-safe-bottom);color:#8a8593;font-size:12px;}
.public-state-footer .public-state-shell{padding:20px 0;border-top:1px solid rgba(34,29,58,.08);display:flex;justify-content:space-between;gap:16px;}
@media(max-width:720px){
  .public-state-shell{width:calc(100% - 28px)}
  .public-state-main{padding:26px 0 50px;align-items:start;}
  .public-state-card{border-radius:26px;padding:28px 22px;}
  .public-state-card>p{font-size:16px;}
  .public-state-actions{display:grid;grid-template-columns:1fr;}
  .public-state-links{grid-template-columns:1fr;margin-top:30px;}
  .public-state-footer .public-state-shell{flex-direction:column;}
}

/* PWA install/update prompt used only when the browser exposes the native install flow. */
.turnli-install-prompt{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:80;width:min(390px,calc(100vw - 28px));padding:15px;border:1px solid rgba(36,31,58,.1);border-radius:20px;background:rgba(255,255,255,.96);box-shadow:0 22px 56px rgba(30,24,64,.18);backdrop-filter:blur(18px);display:flex;gap:12px;align-items:center;}
.turnli-install-prompt[hidden]{display:none!important;}
.turnli-install-prompt img{width:42px;height:42px;border-radius:13px;flex:0 0 auto;}
.turnli-install-copy{min-width:0;flex:1;}
.turnli-install-copy strong{display:block;font-size:14px;line-height:1.2;}
.turnli-install-copy small{display:block;margin-top:3px;color:#777284;font-size:12px;line-height:1.35;}
.turnli-install-actions{display:flex;gap:6px;}
.turnli-install-actions button{border:0;border-radius:10px;padding:9px 11px;font:inherit;font-size:12px;font-weight:760;cursor:pointer;}
.turnli-install-actions .install{background:#6652df;color:white;}
.turnli-install-actions .dismiss{background:#f1eff6;color:#5d5867;}
@media(max-width:520px){.turnli-install-prompt{left:14px;right:14px;width:auto;bottom:calc(14px + env(safe-area-inset-bottom));}}

@media (prefers-reduced-motion:reduce){
  .mk-pricing-fallback[data-pricing-state="loading"]::before{animation:none;}
  .public-state-button{transition:none;}
}