.elementor-376 .elementor-element.elementor-element-a479819{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:15px 15px;--row-gap:15px;--column-gap:15px;--overlay-opacity:0.6;--padding-top:250px;--padding-bottom:250px;--padding-left:10px;--padding-right:10px;}.elementor-376 .elementor-element.elementor-element-a479819:not(.elementor-motion-effects-element-type-background), .elementor-376 .elementor-element.elementor-element-a479819 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://oakland.esclatech.com/wp-content/uploads/2025/12/64ae4f0788d64503932a6cd687b32d11x.avif");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-376 .elementor-element.elementor-element-a479819::before, .elementor-376 .elementor-element.elementor-element-a479819 > .elementor-background-video-container::before, .elementor-376 .elementor-element.elementor-element-a479819 > .e-con-inner > .elementor-background-video-container::before, .elementor-376 .elementor-element.elementor-element-a479819 > .elementor-background-slideshow::before, .elementor-376 .elementor-element.elementor-element-a479819 > .e-con-inner > .elementor-background-slideshow::before, .elementor-376 .elementor-element.elementor-element-a479819 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-376 .elementor-element.elementor-element-80be92a{text-align:left;}.elementor-376 .elementor-element.elementor-element-80be92a .elementor-heading-title{font-family:"EB Garamond", Sans-serif;font-size:80px;font-weight:400;color:#FFFFFF;}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-376 .elementor-element.elementor-element-ed14ab9{--divider-border-style:solid;--divider-color:#37CA37;--divider-border-width:5px;}.elementor-376 .elementor-element.elementor-element-ed14ab9 .elementor-divider-separator{width:33%;}.elementor-376 .elementor-element.elementor-element-ad20c1b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-376 .elementor-element.elementor-element-a403dc0{width:100%;max-width:100%;}@media(max-width:1366px){.elementor-376 .elementor-element.elementor-element-a479819{--padding-top:200px;--padding-bottom:200px;--padding-left:10px;--padding-right:10px;}.elementor-376 .elementor-element.elementor-element-80be92a .elementor-heading-title{font-size:50px;}}@media(max-width:1023px){.elementor-376 .elementor-element.elementor-element-80be92a .elementor-heading-title{font-size:40px;line-height:39px;}}@media(max-width:767px){.elementor-376 .elementor-element.elementor-element-a479819{--padding-top:100px;--padding-bottom:100px;--padding-left:10px;--padding-right:10px;}.elementor-376 .elementor-element.elementor-element-80be92a .elementor-heading-title{font-size:35px;line-height:33px;}.elementor-376 .elementor-element.elementor-element-ed14ab9 .elementor-divider-separator{width:27%;}}@media(min-width:768px){.elementor-376 .elementor-element.elementor-element-a479819{--content-width:1440px;}.elementor-376 .elementor-element.elementor-element-ad20c1b{--content-width:1440px;}}/* Start custom CSS for html, class: .elementor-element-a403dc0 */<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=EB+Garamond:wght@500;600;700&family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">

<style>
/* ==============================
   ELEMENTOR: RESPONSIVE PRODUCT TABLES + 1 GLOBAL SEARCH
   Desktop/Laptop: normal table
   Tablet: table with horizontal scroll
   Mobile: card layout
   Fonts: Inter (body), EB Garamond (headings)
   ============================== */

:root{
  --pt-bg: #ffffff;
  --pt-border: rgba(0,0,0,.16);
  --pt-border-soft: rgba(0,0,0,.10);
  --pt-shadow: 0 10px 26px rgba(0,0,0,.08);
  --pt-radius: 18px;
  --pt-muted: rgba(0,0,0,.60);
  --pt-text: rgba(0,0,0,.92);
}

/* Apply fonts inside your section */
#col-qLe17hdW_6{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  color: var(--pt-text);
}
#col-qLe17hdW_6 h1,
#col-qLe17hdW_6 h2,
#col-qLe17hdW_6 h3{
  font-family: "EB Garamond", Georgia, "Times New Roman", serif !important;
}

/* ==============================
   Global search bar (clean, visible)
   ============================== */
.pt-global-toolbar{
  max-width: 90%;
  margin: 16px auto 16px;
  padding: 0 12px;
}

/* Plain container */
.pt-global-search{
  display:flex;
  align-items:center;
  gap:10px;

  padding: 12px 14px;
  border-radius: 8px;

  background:#fff;
  border:1px solid #d0d0d0;

  box-shadow:none !important;
}

/* Remove badge styling effect */
.pt-global-search .pt-badge{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#666;
}

/* Input – browser-like */
.pt-global-search input{
  width:100%;
  border:0 !important;
  outline:none !important;
  background:transparent !important;

  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-size:14px;
  font-weight:400;
  color:#222;
}

/* Placeholder */
.pt-global-search input::placeholder{
  color:#888;
  font-weight:400;
}

/* Focus – very subtle */
.pt-global-search:focus-within{
  border-color:#999;
}

/* ==============================
   Table wrapper & spacing (Elementor safe)
   ============================== */
.custom-code-container .container.mt-4{
  max-width: 90%;
  margin: 0 auto;
  padding: 0 12px;
}

/* Wrap each table visually */
.custom-code-container .container.mt-4 > table.table{
  background: var(--pt-bg);
  border: 1px solid var(--pt-border);
  border-radius: var(--pt-radius);
  overflow: hidden;
  box-shadow: var(--pt-shadow);
  margin: 0 !important;
}

/* Table base */
.custom-code-container table.table{
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  font-family: Inter, system-ui, sans-serif !important;
}

/* Header */
.custom-code-container table.table thead th{
  background: rgba(0,0,0,.88) !important;
  color: #fff !important;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 800;
  font-size: 12px;
  padding: 14px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
}

/* Body cells */
.custom-code-container table.table tbody td{
  padding: 14px 16px !important;
  border-top: 1px solid var(--pt-border-soft) !important;
  vertical-align: middle !important;
  font-size: 14.5px;
  line-height: 1.35;
}

.custom-code-container table.table tbody tr:nth-child(even){
  background: rgba(0,0,0,.02);
}
.custom-code-container table.table.table-hover tbody tr:hover{
  background: rgba(0,0,0,.04) !important;
}

/* Column tweaks */
.custom-code-container table.table tbody td:nth-child(1){
  font-weight: 800;
  white-space: nowrap;
}
.custom-code-container table.table tbody td:nth-child(2){
  color: rgba(0,0,0,.72);
}
.custom-code-container table.table tbody td:nth-child(3){
  text-align: right;
  font-weight: 900;
  white-space: nowrap;
}
.custom-code-container table.table tbody td:nth-child(3)::before{
  content:"$";
  opacity:.7;
  margin-right: 2px;
}

/* spacing between tables */
.custom-code-container .container.mt-4{
  margin-top: 16px !important;
}
.custom-code-container .container.mt-4 + .container.mt-4{
  margin-top: 22px !important;
}

/* ==============================
   TABLET: horizontal scroll (best for Elementor)
   ============================== */
@media (max-width: 1024px){
  /* Turn the table into a scrollable block */
  .custom-code-container .container.mt-4{
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .custom-code-container .container.mt-4 > table.table{
    min-width: 90%; /* keeps columns readable */
  }
}

/* ==============================
   MOBILE: card layout (no scroll needed)
   ============================== */
@media (max-width: 767px){
  .custom-code-container .container.mt-4{
    overflow: visible;
  }
  .custom-code-container .container.mt-4 > table.table{
    min-width: 0;
  }

  .custom-code-container table.table thead{
    display:none !important;
  }
  .custom-code-container table.table tbody,
  .custom-code-container table.table tr,
  .custom-code-container table.table td{
    display:block !important;
    width:100% !important;
  }

  .custom-code-container table.table tbody tr{
    border: 1px solid var(--pt-border-soft);
    border-radius: 16px;
    overflow:hidden;
    background: #fff;
    box-shadow: 0 10px 22px rgba(0,0,0,.07);
    margin: 12px 0;
  }

  .custom-code-container table.table tbody td{
    text-align:left !important;
    padding: 12px 14px !important;
    border-top: 1px solid rgba(0,0,0,.08) !important;
  }

  .custom-code-container table.table tbody td::before{
    content: attr(data-label);
    display:block;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(0,0,0,.50);
    margin-bottom: 6px;
  }

  .custom-code-container table.table tbody td:nth-child(3){
    font-size: 16px;
  }

  /* search bar tighter on mobile */
  .pt-global-search{
    padding: 13px 14px;
    border-radius: 12px;
  }
  .pt-global-search input{
    font-size: 14.5px;
  }
}
@media (max-width: 768px){
  .pt-global-search{
    padding:11px 12px;
    border-radius:6px;
  }
  .pt-global-search input{
    font-size:14px;
  }
}/* End custom CSS */