/* ========================================================================== 
   Need Kala — Page End / Footer Clearance System
   One authoritative spacing contract between every page surface and footer.
   Loaded after all responsive, commerce and color-mode layers.
   ========================================================================== */

body.papillon-theme{
  --pap-page-end-space:56px;
  --pap-footer-separation:36px;
}

/* All native and Elementor page roots receive the same end-space baseline. */
body.papillon-theme > main{
  padding-block-end:var(--pap-page-end-space)!important;
}

/* High-specificity page contracts that previously owned their own bottom paddings. */
body.papillon-front-screen > main.papillon-home,
body.papillon-account-screen > main.papillon-account-page,
body.papillon-cart-screen > main.cart-page-shell,
body.papillon-checkout-screen > main.checkout-page-shell,
body.papillon-product-screen > main.pap-product-page,
body.papillon-catalog-screen > main.pap-shop-page,
body.papillon-legal-screen > main.legal-page,
body.papillon-about-contact-screen > main.papillon-content-page,
body.papillon-blog-screen > main.niazkala-blog-page,
body.blog.papillon-theme > main.niazkala-blog-page,
body.papillon-generic-page-screen > main.page-content,
body.papillon-article-screen > main.pap-single-article,
body.papillon-search-results-screen > main.papillon-search-page,
body.papillon-not-found-screen > main.pap-not-found-page{
  padding-block-end:var(--pap-page-end-space)!important;
}

/* Keep one external breathing strip before the footer. This is intentionally
   separate from page padding so the boundary is visible in both light/dark. */
body.papillon-theme > .site-footer{
  margin-block-start:var(--pap-footer-separation)!important;
}

/* Account used to carry an additional patch margin below its content shell.
   The page-level spacing contract now owns that responsibility. */
body.papillon-account-screen .account-content-shell,
body.papillon-account-screen main .woocommerce:has(>.woocommerce-MyAccount-navigation){
  margin-block-end:0!important;
}

@media(max-width:1024px){
  body.papillon-theme{
    --pap-page-end-space:52px;
    --pap-footer-separation:32px;
  }
}

@media(max-width:700px){
  body.papillon-theme{
    /* Mobile bottom nav is fixed; retain enough scroll-safe space before footer. */
    --pap-page-end-space:68px;
    --pap-footer-separation:28px;
  }
}

@media(max-width:430px){
  body.papillon-theme{
    --pap-page-end-space:64px;
    --pap-footer-separation:26px;
  }
}

/* ========================================================================== 
   Page Start / Header Clearance Contract
   Keeps title/hero surfaces from visually sticking to the header/toolbars.
   ========================================================================== */
body.papillon-theme{
  --pap-page-start-space:clamp(30px,3vw,44px);
}

body.papillon-account-screen > main.papillon-account-page,
body.papillon-cart-screen > main.cart-page-shell,
body.papillon-checkout-screen > main.checkout-page-shell,
body.papillon-product-screen > main.pap-product-page,
body.papillon-catalog-screen > main.pap-shop-page,
body.papillon-legal-screen > main.legal-page,
body.papillon-about-contact-screen > main.papillon-content-page,
body.papillon-blog-screen > main.niazkala-blog-page,
body.blog.papillon-theme > main.niazkala-blog-page,
body.papillon-generic-page-screen > main.page-content,
body.papillon-article-screen > main.pap-single-article,
body.papillon-search-results-screen > main.papillon-search-page,
body.papillon-not-found-screen > main.pap-not-found-page,
body.papillon-theme > main.woocommerce-page-shell{
  padding-block-start:var(--pap-page-start-space)!important;
}

/* The page root owns the top rhythm now; neutralize legacy first-surface offsets. */
body.papillon-account-screen .account-page-heading,
body.papillon-cart-screen .transaction-page-heading:first-child,
body.papillon-checkout-screen .transaction-page-heading:first-child,
body.papillon-legal-screen .legal-hero:first-child,
body.papillon-about-contact-screen .content-page-hero:first-child,
body.papillon-search-results-screen .search-page-heading:first-child{
  margin-block-start:0!important;
}

@media(max-width:1024px){
  body.papillon-theme{--pap-page-start-space:30px;}
}

@media(max-width:700px){
  body.papillon-theme{--pap-page-start-space:22px;}
}

@media(max-width:430px){
  body.papillon-theme{--pap-page-start-space:20px;}
}
