/*!
 * Piero Salardi® · ps-grid.css
 * The site grid, one margin line for every page: the logo's first stroke and every block of copy start on it.
 *   Desktop  12 columns · 32px margins · 24px gutters
 *   Tablet    6 columns · 32px margins · 24px gutters
 *   Phone     4 columns · 24px margins · 16px gutters
 * Loaded last on every page (PS Grid), so it settles the few places that sat off the line.
 */
:root{--ps-gm:32px;--ps-gg:24px}
@media (max-width:767px){:root{--ps-gm:24px;--ps-gg:16px}}

/* 1. Logo: the svg has 7.5px of air before its first stroke, so the frame sits 7.5px left of the margin */
.psh-logo{left:calc(var(--ps-gm) - 7.5px)!important}

/* 2. Privacy and Copyright: the boxed column (93% wide, centered) opens to the margins */
body.page-id-6258 .elementor .e-con,
body.page-id-1039 .elementor .e-con{padding-left:0!important;padding-right:0!important}
body.page-id-6258 .e-con-boxed>.e-con-inner,
body.page-id-1039 .e-con-boxed>.e-con-inner{max-width:none!important;width:100%!important;margin-left:0!important;margin-right:0!important;padding-left:var(--ps-gm)!important;padding-right:var(--ps-gm)!important;box-sizing:border-box}

/* 3. Journal (list and posts): the centered 1160px frame starts on the margin */
.psj .psj-wrap{max-width:none!important;margin-left:0!important;margin-right:0!important;padding-left:var(--ps-gm)!important;padding-right:var(--ps-gm)!important}

/* 4. NFTs: picture on columns 1 to 4, story on columns 5 to 12 */
@media (min-width:1025px){
  .elementor-1074 .elementor-element-523045f{display:grid!important;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--ps-gg)!important}
  .elementor-1074 .elementor-element-dc23ed8{grid-column:1/span 4;width:auto!important;max-width:none!important}
  .elementor-1074 .elementor-element-ca67fe8{grid-column:5/span 8;width:auto!important;max-width:none!important}
}

/* 5. Tablet and phone: Portfolio and PlayGrnd lists, and the Home PlayGrnd band, on the margins */
@media (max-width:1024px){
  .pgl-hd,.pgl-it,.pgl .pgl-ti{left:var(--ps-gm)!important}
  .pgl-it{width:calc(100% - 2 * var(--ps-gm) - 32px)!important}
  .pgl-tb,.pgl-ticks{right:var(--ps-gm)!important}
  .pgs .pgs-hd,.pgs .pgs-rail{padding-left:var(--ps-gm)!important;padding-right:var(--ps-gm)!important}
}

/* 6. Phones: the pages that used 16px margins move to the 24px line */
@media (max-width:767px){
  .pj{--m:24px!important}
  body .elementor .elementor-element.e-con.svp{padding-left:var(--ps-gm)!important;padding-right:var(--ps-gm)!important}
  .svh{padding-left:var(--ps-gm)!important;padding-right:var(--ps-gm)!important}
}
