/* ZALI Landing Kit — styles for Elementor landing pages.
   Uses the theme's own tokens (--ink, --blaze ...) when the ZALI theme is active,
   with the same values as fallbacks, so the look matches the site. */
:root{
  --zl-ink:var(--ink,#0A0A0A);--zl-ink-2:var(--ink-2,#151515);--zl-paper:var(--paper,#fff);
  --zl-concrete:var(--concrete,#F1F1EE);--zl-concrete-2:var(--concrete-2,#E5E5E0);
  --zl-blaze:var(--blaze,#FF3B18);--zl-blaze-deep:var(--blaze-deep,#CF2C0F);--zl-navy:var(--navy,#0B1F3F);
  --zl-body:var(--t-body,#44443F);--zl-mute:var(--t-mute,#6E6E67);
  --zl-d-body:var(--d-body,#C4C4BE);--zl-d-mute:var(--d-mute,#8C8C85);
  --zl-line:rgba(10,10,10,.12);--zl-line-d:rgba(255,255,255,.15);
  --zl-disp:var(--disp,'Big Shoulders Display','Archivo Narrow','Arial Narrow',system-ui,sans-serif);
  --zl-sans:var(--sans,'Inter Tight',system-ui,-apple-system,'Segoe UI',sans-serif);
  --zl-shell:1380px;--zl-gut:clamp(16px,3vw,24px);--zl-sec:clamp(44px,5vw,72px);
  --zl-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 18l6-6M13 6l6 6'/%3E%3C/svg%3E");
}
@media(max-width:640px){:root{--zl-gut:20px;--zl-sec:52px}}

/* ── Section shell ── */
.e-con.zl-sec{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;--gap:0px;--row-gap:0px;--column-gap:0px;
  padding:var(--zl-sec) var(--zl-gut)!important;gap:0!important;width:100%;max-width:100%;font-family:var(--zl-sans);font-size:16px;line-height:1.55}
.e-con.zl-wrap{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;padding:0!important;width:100%;max-width:var(--zl-shell);margin-inline:auto}
.zl-sec .elementor-widget{margin:0!important}
.zl-stack{display:flex!important;flex-direction:column!important;gap:16px!important}
.zl-dark{background:var(--zl-ink);color:var(--zl-d-body)}
.zl-navy{background:var(--zl-navy);color:var(--zl-d-body)}
.zl-concrete{background:var(--zl-concrete);color:var(--zl-body)}
.zl-paper{background:var(--zl-paper);color:var(--zl-body)}

/* ── Type ── */
.zl-sec .elementor-heading-title{font-family:var(--zl-disp);font-weight:800;text-transform:uppercase;line-height:.95;letter-spacing:0;margin:0;color:var(--zl-ink)}
.zl-dark .elementor-heading-title,.zl-navy .elementor-heading-title{color:#fff}
.zl-h1 .elementor-heading-title{font-size:clamp(46px,5.2vw,76px);line-height:.92}
.zl-h2 .elementor-heading-title{font-size:clamp(34px,3.6vw,48px)}
.zl-h3 .elementor-heading-title{font-size:clamp(24px,2.4vw,30px);line-height:1}
.zl-hot{color:var(--zl-blaze)}
.zl-eyebrow .elementor-heading-title{display:flex;align-items:center;gap:12px;font:700 12px/1.2 var(--zl-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--zl-blaze-deep)}
.zl-eyebrow .elementor-heading-title::before{content:"";width:28px;height:2px;background:var(--zl-blaze);flex:none}
.zl-dark .zl-eyebrow .elementor-heading-title,.zl-navy .zl-eyebrow .elementor-heading-title{color:#fff}
.zl-sec .elementor-widget-text-editor,.zl-sec .elementor-widget-text-editor p{font-family:var(--zl-sans);font-size:16px;line-height:1.6;color:inherit;margin:0}
.zl-lead,.zl-lead p{font-size:17px!important;max-width:540px}
.zl-sub{max-width:560px}
.zl-dark .elementor-widget-text-editor,.zl-navy .elementor-widget-text-editor{color:var(--zl-d-body)}

/* ── Buttons (Elementor button widget) ── */
.zl-actions{display:flex!important;flex-direction:row!important;flex-wrap:wrap;gap:10px!important}
.zl-btn .elementor-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:14px 26px;border:2px solid transparent;border-radius:999px;
  font:700 13px/1 var(--zl-sans);letter-spacing:.12em;text-transform:uppercase;box-shadow:none;transition:background .25s,color .25s,border-color .25s,transform .25s}
.zl-btn .elementor-button:hover{transform:translateY(-2px)}
.zl-btn .elementor-button:focus-visible{outline:3px solid var(--zl-blaze);outline-offset:3px}
.zl-btn--primary .elementor-button{background:var(--zl-blaze);color:#fff}
.zl-btn--primary .elementor-button:hover{background:var(--zl-blaze-deep);color:#fff}
.zl-btn--primary .elementor-button-text::after{content:"";display:inline-block;width:16px;height:16px;margin-left:10px;vertical-align:-3px;background:currentColor;-webkit-mask:var(--zl-arrow) center/contain no-repeat;mask:var(--zl-arrow) center/contain no-repeat}
.zl-btn--ghost .elementor-button{background:transparent;color:var(--zl-ink);border-color:var(--zl-ink)}
.zl-btn--ghost .elementor-button:hover{background:var(--zl-ink);color:#fff}
.zl-dark .zl-btn--ghost .elementor-button,.zl-navy .zl-btn--ghost .elementor-button{color:#fff;border-color:rgba(255,255,255,.4)}
.zl-dark .zl-btn--ghost .elementor-button:hover,.zl-navy .zl-btn--ghost .elementor-button:hover{background:#fff;color:var(--zl-ink);border-color:#fff}

/* ── Layout helpers ── */
.zl-split{display:grid!important;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px)!important;align-items:center}
.zl-grid-3,.zl-grid-4{display:grid!important;gap:12px!important}
.zl-grid-3{grid-template-columns:repeat(3,1fr)}
.zl-grid-4{grid-template-columns:repeat(4,1fr)}
.zl-head{margin-bottom:clamp(22px,3vw,34px)}
@media(max-width:1000px){.zl-grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.zl-split{grid-template-columns:1fr}.zl-grid-3{grid-template-columns:1fr}}
@media(max-width:600px){.zl-grid-4{grid-template-columns:1fr}}

/* ── Stats ── */
.zl-stats{display:grid!important;grid-template-columns:repeat(3,1fr);gap:20px!important;margin-top:8px}
.zl-stat{border-top:1px solid var(--zl-line-d);padding-top:14px}
.zl-stat .elementor-heading-title{font-size:clamp(34px,3.4vw,46px)!important;line-height:1!important}
.zl-stat .elementor-widget-text-editor,.zl-stat .elementor-widget-text-editor p{font-size:13.5px!important;color:var(--zl-d-mute)!important;margin-top:6px!important}
@media(max-width:600px){.zl-stats{grid-template-columns:1fr}}

/* ── Media ── */
.zl-media{border-radius:16px;overflow:hidden;box-shadow:0 24px 48px -24px rgba(10,10,10,.5);background:var(--zl-ink-2)}
.zl-media img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:0}

/* ── Cards ── */
.e-con.zl-card{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;padding:22px 22px 24px!important;background:var(--zl-paper);border:1px solid var(--zl-line);border-radius:12px;gap:10px!important}
.zl-concrete .zl-card{background:var(--zl-paper)}
.zl-card .zl-card-n .elementor-heading-title{font-size:40px;color:var(--zl-blaze)}
.zl-card .elementor-widget-text-editor,.zl-card .elementor-widget-text-editor p{font-size:15px;color:var(--zl-body)}
.e-con.zl-card--dark{background:var(--zl-ink-2);border-color:var(--zl-line-d)}
.zl-card--dark .elementor-heading-title{color:#fff}
.zl-card--dark .elementor-widget-text-editor,.zl-card--dark .elementor-widget-text-editor p{color:var(--zl-d-body)}
.zl-card--dark .zl-card-n .elementor-heading-title{color:var(--zl-blaze)}

/* ── Steps ── */
.e-con.zl-step{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;padding:18px 0 0!important;border-top:2px solid var(--zl-ink);gap:8px!important}
.zl-step .zl-step-n .elementor-heading-title{font:700 13px/1 var(--zl-sans);letter-spacing:.14em;color:var(--zl-blaze-deep)}
.zl-step .elementor-widget-text-editor,.zl-step .elementor-widget-text-editor p{font-size:15px}

/* ── Price band ── */
.zl-price .elementor-heading-title{font-size:clamp(96px,13vw,180px);line-height:.82;color:var(--zl-blaze)!important}
.zl-band{display:grid!important;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,72px)!important;align-items:center}
@media(max-width:800px){.zl-band{grid-template-columns:1fr}}

/* ── Closing CTA ── */
.zl-center{align-items:center;text-align:center}
.zl-center .zl-actions{justify-content:center}
.zl-center .zl-sub{margin-inline:auto}
@media(prefers-reduced-motion:reduce){.zl-btn .elementor-button{transition:none}.zl-btn .elementor-button:hover{transform:none}}

/* ═══ v1.1 additions ═══ */
/* ── Scroll reveal (driven by assets/zali-landing.js, same motion as the theme) ── */
.zl-js .zl-rv{opacity:0;transform:translateY(14px)}
.zl-js .zl-rv.zl-in{opacity:1;transform:none}
.zl-js .zl-h1 .elementor-heading-title,.zl-js .zl-h2 .elementor-heading-title{opacity:0}
.zl-js .zl-media{opacity:0}
.zl-safe .zl-rv,.zl-safe .zl-media,.zl-safe .zl-h1 .elementor-heading-title,.zl-safe .zl-h2 .elementor-heading-title{opacity:1!important;transform:none!important;clip-path:none!important}
.elementor-editor-active .zl-rv,.elementor-editor-active .zl-media,.elementor-editor-active .zl-h1 .elementor-heading-title,.elementor-editor-active .zl-h2 .elementor-heading-title{opacity:1!important;transform:none!important;clip-path:none!important}
.zl-step{position:relative}
.zl-step .zl-line{position:absolute;left:0;right:0;top:-2px;height:2px;background:var(--zl-ink);transform-origin:left;transform:scaleX(1)}
.zl-js .zl-step:not(.zl-on) .zl-line{transform:scaleX(0)}
.zl-step .zl-line{transition:transform .9s cubic-bezier(.16,1,.3,1)}
.zl-line-w{height:0;position:static}

/* ── More layouts ── */
.zl-grid-2,.zl-grid-5{display:grid!important;gap:12px!important}
.zl-grid-2{grid-template-columns:repeat(2,1fr)}
.zl-grid-5{grid-template-columns:repeat(5,1fr)}
@media(max-width:1100px){.zl-grid-5{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.zl-grid-5{grid-template-columns:repeat(2,1fr)}.zl-grid-2{grid-template-columns:1fr}}
@media(max-width:480px){.zl-grid-5{grid-template-columns:1fr}}
.zl-prose-split{display:grid!important;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,5vw,72px)!important;align-items:start}
@media(max-width:900px){.zl-prose-split{grid-template-columns:1fr}}
.zl-prose-body{display:flex!important;flex-direction:column!important;gap:22px!important}
.zl-prose-body .elementor-widget-text-editor,.zl-prose-body .elementor-widget-text-editor p{font-size:16.5px;line-height:1.65}
.zl-prose-body .zl-h3 .elementor-heading-title{margin-bottom:6px}
.zl-dark .zl-prose-body .elementor-widget-text-editor p,.zl-navy .zl-prose-body .elementor-widget-text-editor p{color:var(--zl-d-body)}

/* ── Facts bar ── */
.zl-fact .elementor-heading-title{font-size:clamp(44px,5vw,68px)!important;line-height:.9!important;color:var(--zl-ink)}
.zl-fact .elementor-heading-title .zl-hot{font-size:.5em;margin-left:4px}
.e-con.zl-fact{padding:0 0 0 18px!important;border-left:2px solid var(--zl-blaze);gap:6px!important}
.zl-fact .elementor-widget-text-editor,.zl-fact .elementor-widget-text-editor p{font-size:14.5px;color:var(--zl-mute)}

/* ── Lists inside cards ── */
.zl-list ul{list-style:none;margin:14px 0 0;padding:0}
.zl-list li{padding:11px 0;border-top:1px solid var(--zl-line);font-size:14.5px;line-height:1.45;color:var(--zl-body)}
.zl-list li strong{display:block;color:var(--zl-ink);font-weight:700}
.zl-spec,.zl-spec p{font-size:12.5px!important;letter-spacing:.04em;color:var(--zl-mute)!important;text-transform:uppercase}
.zl-card--dark .zl-spec,.zl-card--dark .zl-spec p{color:var(--zl-d-mute)!important}

/* ── Tables ── */
.zl-table .zl-scroll{overflow-x:auto;border:1px solid var(--zl-line);border-radius:12px;background:var(--zl-paper)}
.zl-table table{width:100%;min-width:560px;border-collapse:collapse;font-family:var(--zl-sans)}
.zl-table th,.zl-table td{padding:14px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--zl-line);font-size:15px;line-height:1.45;color:var(--zl-body)}
.zl-table th{font:700 12px/1.2 var(--zl-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--zl-mute);background:var(--zl-concrete)}
.zl-table tr:last-child td{border-bottom:0}
.zl-table td:first-child{font-weight:700;color:var(--zl-ink)}
.zl-table .zl-yes{color:var(--zl-blaze-deep);font-weight:700}

/* ── Link cards (whole card clickable) ── */
.e-con.zl-card--link{position:relative;transition:border-color .25s,transform .25s}
.zl-card--link:hover{border-color:var(--zl-blaze);transform:translateY(-3px)}
.zl-card--link .elementor-heading-title a{color:inherit;text-decoration:none}
.zl-card--link .elementor-heading-title a::after{content:"";position:absolute;inset:0}
.zl-card--link .zl-more .elementor-heading-title{font:700 12px/1 var(--zl-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--zl-blaze-deep)}
.zl-card--dark.zl-card--link .zl-more .elementor-heading-title{color:var(--zl-blaze)}

/* ── FAQ ── */
.e-con.zl-faq-item{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;padding:20px 22px 22px!important;background:var(--zl-paper);border:1px solid var(--zl-line);border-radius:12px;gap:8px!important}
.zl-faq-item .elementor-heading-title{font-size:clamp(21px,1.7vw,24px)!important;line-height:1.05}
.zl-faq-item .elementor-widget-text-editor,.zl-faq-item .elementor-widget-text-editor p{font-size:15px}
.e-con.zl-step{border-top:2px solid var(--zl-line)}
.elementor-widget.zl-line-w{position:static!important;height:0;margin:0!important}
.zl-line-w .elementor-widget-container{position:static!important}
/* Inner containers: no Elementor default padding, so every block lines up with the section edge */
.zl-wrap .e-con{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;padding:0}

/* ═══ v1.2: Lenis smooth-scroll support (needed whoever starts it) ═══ */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
html:has(.zl-sec){scroll-behavior:auto}
