/* ==========================================================================
   EMG Ledger - sitewide design layer
   Generated for emgpmo.com. Loads after all Elementor CSS.
   Token source: Novamira design "EMG Ledger".
   This file only restyles; it never changes page structure or content.
   ========================================================================== */

:root{
  --emg-ink:#0A0A0A;
  --emg-paper:#FAF9F6;
  --emg-green:#1B3A2F;
  --emg-green-deep:#102720;
  --emg-gold:#B8954A;
  --emg-gold-hi:#C8A562;
  --emg-sage:#E8EDE6;
  --emg-gray:#5C5F5B;
  --emg-line:#DAD7CD;
  --emg-muted:#B8B8B2;

  --emg-display:"Space Grotesk", sans-serif;
  --emg-body:"IBM Plex Sans", sans-serif;
  --emg-mono:"IBM Plex Mono", ui-monospace, monospace;

  --emg-radius:2px;
}

/* --------------------------------------------------------------------------
   1. Foundations
   -------------------------------------------------------------------------- */

body{
  font-family:var(--emg-body);
  color:var(--emg-ink);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  /* clip (not hidden) so entrance animations that start off-canvas cannot
     widen the page, while position:sticky keeps working */
  overflow-x:clip;
}

::selection{background:var(--emg-gold);color:var(--emg-green-deep);}

:focus-visible{
  outline:2px solid var(--emg-gold);
  outline-offset:3px;
}

/* --------------------------------------------------------------------------
   2. Typography
   -------------------------------------------------------------------------- */

.elementor h1,.elementor h2,.elementor h3,.elementor h4,
.elementor .elementor-heading-title{
  font-family:var(--emg-display);
  letter-spacing:-0.01em;
}

/* line-height 1 clips descenders on any heading that wraps */
.elementor .elementor-heading-title{line-height:1.14 !important;}
.elementor h1.elementor-heading-title{line-height:1.1 !important;}

/* running copy */
.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-text-editor li,
.elementor-widget-theme-post-content p,
.elementor-icon-list-text,
.elementor-widget-icon-box .elementor-icon-box-description{
  font-family:var(--emg-body) !important;
}

.elementor-widget-text-editor p,
.elementor-widget-text-editor li{line-height:1.62;}

/* --------------------------------------------------------------------------
   3. Eyebrow - a divider hairline followed by a mono label
   -------------------------------------------------------------------------- */

.elementor-widget-divider + .elementor-widget-text-editor,
.elementor-widget-divider + .elementor-widget-text-editor p{
  font-family:var(--emg-mono) !important;
  font-size:12px !important;
  font-weight:400 !important;
  line-height:1.5 !important;
  letter-spacing:0.14em !important;
  text-transform:uppercase;
  color:var(--emg-gold) !important;
}

/* --------------------------------------------------------------------------
   4. Buttons
   -------------------------------------------------------------------------- */

.elementor-button,
.elementor-button-link,
.elementor-field-type-submit button,
.elementor-field-type-submit input[type="submit"]{
  font-family:var(--emg-mono) !important;
  font-size:13px !important;
  font-weight:400 !important;
  letter-spacing:0.06em !important;
  line-height:1.2 !important;
  text-transform:uppercase;
  border-radius:var(--emg-radius) !important;
  transition:transform .25s ease, background-color .25s ease,
             color .25s ease, border-color .25s ease !important;
  will-change:transform;
}

.elementor-button:hover,
.elementor-button:focus-visible{transform:translateY(-2px);}

.elementor-button .elementor-button-icon,
.elementor-button .elementor-button-content-wrapper i,
.elementor-button .elementor-button-content-wrapper svg{
  transition:transform .25s ease;
}
.elementor-button:hover .elementor-button-icon,
.elementor-button:hover .elementor-button-content-wrapper i,
.elementor-button:hover .elementor-button-content-wrapper svg{
  transform:translateX(3px);
}

/* contrast: paper text on the gold hero button reads at ~2.2:1 - move it to
   the deep forest ink the design specifies for gold grounds (~7:1) */
.elementor-element-70c98a4 .elementor-button,
.elementor-element-70c98a4 .elementor-button:hover{
  color:var(--emg-green-deep) !important;
}

/* --------------------------------------------------------------------------
   5. Header navigation
   -------------------------------------------------------------------------- */

.elementor-location-header .elementor-nav-menu .elementor-item{
  font-family:var(--emg-mono) !important;
  font-size:13px !important;
  font-weight:400 !important;
  letter-spacing:0.04em !important;
  color:rgba(250,249,246,0.75) !important;
  transition:color .2s ease !important;
}
.elementor-location-header .elementor-nav-menu .elementor-item:hover,
.elementor-location-header .elementor-nav-menu .elementor-item:focus-visible,
.elementor-location-header .elementor-nav-menu .elementor-item.elementor-item-active{
  color:var(--emg-gold) !important;
}
.elementor-location-header .elementor-nav-menu--dropdown .elementor-item{
  color:rgba(250,249,246,0.85) !important;
}

/* --------------------------------------------------------------------------
   6. Statistic labels
   -------------------------------------------------------------------------- */

.stat{
  font-family:var(--emg-mono) !important;
  font-size:12px !important;
  letter-spacing:0.06em !important;
  line-height:1.5 !important;
  text-transform:uppercase;
  color:var(--emg-muted) !important;
}

/* --------------------------------------------------------------------------
   7. Pull-quote band (Elementor atomic element)
   -------------------------------------------------------------------------- */

.e-atomic-element h2{
  font-family:var(--emg-display) !important;
  font-size:clamp(22px,2.4vw,32px) !important;
  font-weight:600 !important;
  line-height:1.3 !important;
  letter-spacing:-0.01em !important;
  max-width:28ch;
  margin-inline:auto;
}

/* --------------------------------------------------------------------------
   8. Inline links
   -------------------------------------------------------------------------- */

.elementor-widget-text-editor a:not(.elementor-button){
  color:inherit;
  text-decoration:none;
  border-bottom:1px solid rgba(184,149,74,0.55);
  transition:border-color .2s ease;
}
.elementor-widget-text-editor a:not(.elementor-button):hover{
  border-bottom-color:var(--emg-gold);
}

.elementor-icon-list-item a{color:inherit;}

/* --------------------------------------------------------------------------
   9. Forms
   -------------------------------------------------------------------------- */

.elementor-field-group .elementor-field,
.elementor-field-group textarea{
  font-family:var(--emg-body) !important;
  font-size:15px !important;
  border-radius:var(--emg-radius) !important;
  border:1px solid var(--emg-line) !important;
  padding:13px 14px !important;
  background-color:transparent;
  color:inherit;
  transition:border-color .2s ease;
}
.elementor-field-group .elementor-field:focus{
  border-color:var(--emg-gold) !important;
  outline:none;
}
.elementor-field-group .elementor-field::placeholder{
  color:var(--emg-gray);
  opacity:1;
}

/* --------------------------------------------------------------------------
   10. Footer
   -------------------------------------------------------------------------- */

.elementor-location-footer .elementor-heading-title{
  font-family:var(--emg-mono) !important;
  font-size:12px !important;
  font-weight:400 !important;
  letter-spacing:0.1em !important;
  line-height:1.5 !important;
  text-transform:uppercase;
  color:var(--emg-gold) !important;
}

.elementor-location-footer .elementor-icon-list-text,
.elementor-location-footer .elementor-widget-text-editor,
.elementor-location-footer .elementor-widget-text-editor p{
  font-size:14.5px !important;
  color:var(--emg-muted) !important;
}

.elementor-location-footer .elementor-icon-list-item a{
  color:var(--emg-muted) !important;
  transition:color .2s ease;
}
.elementor-location-footer .elementor-icon-list-item a:hover,
.elementor-location-footer .elementor-icon-list-item a:focus-visible{
  color:var(--emg-gold) !important;
}

/* the footer sits on near-black, so the form needs its own treatment */
.elementor-location-footer .elementor-field-group .elementor-field{
  background-color:transparent !important;
  border:1px solid rgba(250,249,246,0.22) !important;
  color:var(--emg-paper) !important;
}
.elementor-location-footer .elementor-field-group .elementor-field::placeholder{
  color:var(--emg-muted) !important;
  opacity:1;
}
.elementor-location-footer .elementor-field-group .elementor-field:focus{
  border-color:var(--emg-gold) !important;
}
.elementor-location-footer .elementor-field-type-submit button,
.elementor-location-footer .elementor-field-type-submit input[type="submit"]{
  background-color:var(--emg-gold) !important;
  color:var(--emg-green-deep) !important;
  border:none !important;
  border-radius:var(--emg-radius) !important;
  transition:background-color .25s ease, transform .25s ease !important;
}
.elementor-location-footer .elementor-field-type-submit button:hover{
  background-color:var(--emg-gold-hi) !important;
  transform:translateY(-2px);
}

/* --------------------------------------------------------------------------
   11. Surfaces - flat, hairline-separated, near-square
   -------------------------------------------------------------------------- */

.elementor img{border-radius:var(--emg-radius);}

/* --------------------------------------------------------------------------
   12. Elementor global tokens

   The kit still shipped Elementor's factory palette and two off-brand faces,
   which is what the Hostinger-built pages - Learning Center, Insights,
   Connect - were rendering their headings with. Re-pointing the global custom
   properties fixes those pages at the source without touching any page data.
   -------------------------------------------------------------------------- */

body[class*="elementor-kit-"]{
  --e-global-color-primary:#0A0A0A;
  --e-global-color-secondary:#1B3A2F;
  --e-global-color-text:#5C5F5B;
  --e-global-color-accent:#B8954A;

  --e-global-typography-primary-font-family:"Space Grotesk";
  --e-global-typography-secondary-font-family:"Space Grotesk";
  --e-global-typography-text-font-family:"IBM Plex Sans";
  --e-global-typography-accent-font-family:"IBM Plex Sans";

  /* display presets the Hostinger pages use - mono belongs on small labels,
     not on 40px page titles */
  --e-global-typography-c83476d-font-family:"Space Grotesk";
  --e-global-typography-c83476d-letter-spacing:-0.01em;
  --e-global-typography-5535e8e-font-family:"Space Grotesk";
  --e-global-typography-5535e8e-letter-spacing:-0.01em;
  --e-global-typography-ff8f921-font-family:"Space Grotesk";
  --e-global-typography-ff8f921-letter-spacing:-0.01em;

  /* body presets */
  --e-global-typography-2142591-font-family:"IBM Plex Sans";
  --e-global-typography-6e52843-font-family:"IBM Plex Sans";
  --e-global-typography-887fca2-font-family:"IBM Plex Sans";
}

/* --------------------------------------------------------------------------
   13. Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto !important;}
  .elementor *,
  .elementor *::before,
  .elementor *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .elementor-invisible{visibility:visible !important;opacity:1 !important;}
}

/* --------------------------------------------------------------------------
   14. Eyebrow written as markup

   Some sections carry the label as <div class="eyebrow"> inside a text widget
   rather than as a divider plus a label. Same treatment either way.
   -------------------------------------------------------------------------- */

.elementor-widget-text-editor .eyebrow{
  font-family:var(--emg-mono) !important;
  font-size:12px !important;
  font-weight:400 !important;
  line-height:1.5 !important;
  letter-spacing:0.14em !important;
  text-transform:uppercase;
  color:var(--emg-gold) !important;
  display:flex;
  align-items:center;
  gap:10px;
}
.elementor-widget-text-editor .eyebrow::before{
  content:"";
  flex:0 0 auto;
  width:22px;
  height:1px;
  background:var(--emg-gold);
}

/* small uppercase category label above a card heading */
.elementor-widget-text-editor .emg-kicker{
  font-family:var(--emg-mono) !important;
  font-size:11px !important;
  font-weight:400 !important;
  letter-spacing:0.12em !important;
  line-height:1.5 !important;
  text-transform:uppercase;
  color:var(--emg-gold) !important;
}

/* --------------------------------------------------------------------------
   15. Comparison table
   -------------------------------------------------------------------------- */

.emg-compare-wrap{overflow-x:auto;}

.emg-compare{
  width:100%;
  min-width:640px;
  border-collapse:collapse;
  background:var(--emg-paper);
  border:1px solid var(--emg-line);
  font-family:var(--emg-body);
}
.emg-compare th{
  font-family:var(--emg-mono);
  font-size:11px;
  font-weight:400;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--emg-green);
  background:var(--emg-sage);
  text-align:left;
  padding:16px 18px;
  border-bottom:1px solid var(--emg-line);
}
.emg-compare td{
  padding:22px 18px;
  vertical-align:top;
  color:var(--emg-gray);
  font-size:15px;
  line-height:1.6;
  border-bottom:1px solid var(--emg-line);
}
.emg-compare tr:last-child td{border-bottom:0;}
.emg-compare td strong{
  display:block;
  font-family:var(--emg-display);
  font-size:17px;
  font-weight:600;
  letter-spacing:-0.01em;
  color:var(--emg-ink);
  margin-bottom:6px;
}
.emg-compare td.pick{
  font-family:var(--emg-mono);
  font-size:12.5px;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:var(--emg-green);
  white-space:nowrap;
}

/* --------------------------------------------------------------------------
   16. Learning Center: taxonomy filter and loop cards
   -------------------------------------------------------------------------- */

.emg-filter .e-filter{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.emg-filter .e-filter-item{
  font-family:var(--emg-mono);
  font-size:12px;
  font-weight:400;
  letter-spacing:0.06em;
  text-transform:uppercase;
  padding:11px 18px;
  border:1px solid var(--emg-line);
  border-radius:var(--emg-radius);
  background:var(--emg-paper);
  color:var(--emg-gray);
  cursor:pointer;
  transition:color .2s ease, border-color .2s ease, background-color .2s ease;
}
.emg-filter .e-filter-item:hover{
  border-color:var(--emg-gold);
  color:var(--emg-ink);
}
.emg-filter .e-filter-item[aria-pressed="true"]{
  background:var(--emg-green);
  border-color:var(--emg-green);
  color:var(--emg-paper);
}
/* keep All at the head of the row, and drop the default catch-all term */
.emg-filter .e-filter-item[data-filter="__all"]{order:-1;}
.emg-filter .e-filter-item[data-filter="uncategorized"]{display:none;}

.emg-loop-grid .elementor-grid{
  display:grid;
  gap:28px;
}

.emg-loop-card{overflow:hidden;}

.emg-loop-thumb{position:relative;}
/* three hairlines standing in for a page of notes, until real artwork lands */
.emg-loop-thumb::after{
  content:"";
  position:absolute;
  left:22px;
  right:22px;
  top:34px;
  height:1px;
  background:rgba(27,58,47,0.25);
  box-shadow:0 24px 0 rgba(27,58,47,0.18), 0 48px 0 rgba(27,58,47,0.12);
  pointer-events:none;
}
.emg-loop-thumb-img{position:absolute;inset:0;z-index:1;}
.emg-loop-thumb-img .elementor-widget-container,
.emg-loop-thumb-img figure,
.emg-loop-thumb-img a{height:100%;}
.emg-loop-thumb-img img{width:100%;height:100%;object-fit:cover;border-radius:0;}
/* a post with no featured image gets Elementor's grey placeholder; hide it so
   the gradient plate shows through instead */
.emg-loop-thumb-img img[src*="/assets/images/placeholder"]{display:none;}

.emg-loop-cat .elementor-icon-list-item,
.emg-loop-cat .elementor-icon-list-text,
.emg-loop-cat a{
  font-family:var(--emg-mono) !important;
  font-size:11px !important;
  letter-spacing:0.12em !important;
  text-transform:uppercase;
  color:var(--emg-gold) !important;
}
.emg-loop-cat .elementor-icon-list-icon{display:none;}

.emg-loop-meta{margin-top:auto;}
.emg-loop-meta .elementor-icon-list-items{
  border-top:1px solid var(--emg-line);
  padding-top:10px;
}
.emg-loop-meta .elementor-icon-list-item,
.emg-loop-meta .elementor-icon-list-text{
  font-family:var(--emg-mono) !important;
  font-size:11px !important;
  letter-spacing:0.06em !important;
  text-transform:uppercase;
  color:var(--emg-muted) !important;
}
.emg-loop-meta .elementor-icon-list-icon{display:none;}

/* --------------------------------------------------------------------------
   17. Motion and interaction

   .emg-reveal      scroll reveal (staggered with .emg-delay-1/2/3)
   .emg-hover-card  hover lift
   .emg-orbit       slow rotating accent ring
   .emg-tech-grid   faint gold graph-paper wash for dark sections
   .emg-progress-line  Plan - Govern - Execute - Measure rails

   The reveal only hides content once emg-design.js has added .emg-js to the
   root element, so a reader with no JavaScript still sees everything.
   -------------------------------------------------------------------------- */

.emg-js .emg-reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .7s ease, transform .7s cubic-bezier(.2,.75,.25,1);
  will-change:opacity, transform;
}
.emg-js .emg-reveal.is-visible{
  opacity:1;
  transform:none;
}
.emg-js .emg-delay-1{transition-delay:.08s;}
.emg-js .emg-delay-2{transition-delay:.16s;}
.emg-js .emg-delay-3{transition-delay:.24s;}

.emg-hover-card{
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.emg-hover-card:hover,
.emg-hover-card:focus-within{
  transform:translateY(-7px);
  border-color:rgba(184,149,74,0.75) !important;
  box-shadow:0 24px 60px rgba(16,39,32,0.11);
}

/* The orbit and the graph-paper wash both bleed past their section, so the
   section clips them rather than letting the page grow sideways. `isolation`
   makes the section a stacking context, which lets both decorations sit at
   z-index -1: above the section's own background, below every piece of content.
   Without it they paint over panels and text on some pages and not others. */
.elementor .e-con.emg-grid-bg{overflow:clip;isolation:isolate;}

/* The orbit is a quarter arc in the top-right corner: the ring's centre sits on
   the corner itself, so the visible 90 degrees runs from the bottom of the
   header round to the right edge of the page. The host section clips the rest. */
/* the host section becomes the containing block so the ring can start at the
   section's own top edge and hang off its right edge, rather than being pinned
   inside the padded 1140px content column */
.elementor .e-con.emg-orbit-anchor{position:relative;}
.elementor .e-con.emg-orbit-anchor > .e-con-inner{position:static;}
/* Elementor makes every widget wrapper position:relative, which would pin the
   ring to the widget's own box */
.elementor .elementor-widget.emg-orbit-host{position:static;}

.emg-orbit{
  position:absolute;
  top:-260px;
  right:-260px;
  width:520px;
  height:520px;
  border:1px solid rgba(184,149,74,0.30);
  border-radius:50%;
  pointer-events:none;
  /* above ordinary hero content and panels, so the arc reads the same on every
     page instead of being swallowed by whatever sits in that corner; still
     below deliberately raised elements such as the home hero's cards (z 3) */
  z-index:2;
  animation:emgSpin 32s linear infinite;
}
.emg-orbit::before{
  content:"";
  position:absolute;
  inset:74px;
  border:1px solid rgba(184,149,74,0.18);
  border-radius:50%;
}
.emg-orbit::after{
  content:"";
  position:absolute;
  left:50%;
  top:-6px;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--emg-gold);
  box-shadow:0 0 0 8px rgba(184,149,74,0.09);
}
@keyframes emgSpin{to{transform:rotate(360deg);}}

.emg-tech-grid{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.18;
  background-image:
    linear-gradient(rgba(184,149,74,0.18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(184,149,74,0.18) 1px, transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:linear-gradient(to bottom, black, transparent 88%);
  mask-image:linear-gradient(to bottom, black, transparent 88%);
}
/* section chrome sits behind the content */
.elementor .e-con > .e-con-inner{position:relative;z-index:1;}

/* the same graph-paper wash, applied to a section instead of a child element
   (Elementor already owns ::before on a container, so this uses ::after) */
.elementor .e-con.emg-grid-bg{position:relative;}
.elementor .e-con.emg-grid-bg::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.18;
  background-image:
    linear-gradient(rgba(184,149,74,0.18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(184,149,74,0.18) 1px, transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:linear-gradient(to bottom, black, transparent 88%);
  mask-image:linear-gradient(to bottom, black, transparent 88%);
}

.emg-progress-line{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  font-family:var(--emg-mono);
  font-size:11px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--emg-green);
}
.emg-progress-line i{
  display:block;
  width:34px;
  height:1px;
  background:var(--emg-gold);
  flex:0 0 auto;
}
.emg-on-dark .emg-progress-line{color:var(--emg-muted);}

.elementor-widget-text-editor p.emg-flow{
  font-family:var(--emg-mono) !important;
  font-size:11px !important;
  letter-spacing:0.08em !important;
  text-transform:uppercase;
  color:var(--emg-gray) !important;
}

.emg-num{
  font-family:var(--emg-mono);
  font-size:12px;
  letter-spacing:0.12em;
  color:var(--emg-gold);
}

/* the kicker gains the same leading hairline the eyebrow has */
.elementor-widget-text-editor .emg-kicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
}
.elementor-widget-text-editor .emg-kicker::before{
  content:"";
  flex:0 0 auto;
  width:28px;
  height:1px;
  background:currentColor;
}

@media (prefers-reduced-motion: reduce){
  .emg-js .emg-reveal{opacity:1 !important;transform:none !important;}
  .emg-orbit{animation:none !important;}
  .emg-hover-card:hover{transform:none;}
}

/* --------------------------------------------------------------------------
   18. Resource library (Learning Center) and post grid (Insights)
   -------------------------------------------------------------------------- */

.emg-filters{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.emg-filters .filter{
  font-family:var(--emg-mono);
  font-size:12px;
  font-weight:400;
  letter-spacing:0.06em;
  text-transform:uppercase;
  padding:11px 18px;
  border:1px solid var(--emg-line);
  border-radius:var(--emg-radius);
  background:var(--emg-paper);
  color:var(--emg-gray);
  cursor:pointer;
  transition:color .2s ease, border-color .2s ease, background-color .2s ease;
}
.emg-filters .filter:hover{border-color:var(--emg-gold);color:var(--emg-ink);}
.emg-filters .filter.active{
  background:var(--emg-green);
  border-color:var(--emg-green);
  color:var(--emg-paper);
}

.resource-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.resource-card{
  display:flex;
  flex-direction:column;
  background:var(--emg-paper);
  border:1px solid var(--emg-line);
  border-radius:var(--emg-radius);
  padding:28px;
  min-height:300px;
}
.resource-card .tag{
  font-family:var(--emg-mono);
  font-size:11px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--emg-gold);
}
.resource-card h3{
  font-family:var(--emg-display);
  font-size:20px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:-0.01em;
  color:var(--emg-ink);
  margin:18px 0 14px;
}
.resource-card p{
  font-family:var(--emg-body);
  font-size:15px;
  line-height:1.6;
  color:var(--emg-gray);
  margin:0;
}
.resource-card .meta{
  margin-top:auto;
  padding-top:20px;
  border-top:1px solid var(--emg-line);
  font-family:var(--emg-mono);
  font-size:11px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--emg-gray);
}
.resource-card.hide{display:none;}

.post-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.post-card{
  border:1px solid var(--emg-line);
  border-radius:var(--emg-radius);
  background:var(--emg-paper);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.post-card .post-img{
  height:210px;
  background:linear-gradient(135deg,#102720,#1B3A2F);
  overflow:hidden;
}
.post-card .post-img img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:0;
}
.post-card .post-body{padding:25px;}
.post-card .post-body h3{
  font-family:var(--emg-display);
  font-size:21px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:-0.01em;
  color:var(--emg-ink);
  margin:12px 0;
}
.post-card .post-body p{
  font-family:var(--emg-body);
  font-size:15px;
  line-height:1.6;
  color:var(--emg-gray);
  margin:0;
}
.post-card .emg-kicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-family:var(--emg-mono);
  font-size:11px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--emg-gold);
}
.post-card .emg-kicker::before{
  content:"";
  flex:0 0 auto;
  width:28px;
  height:1px;
  background:currentColor;
}

@media (max-width:1024px){
  .resource-grid,.post-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:767px){
  .resource-grid,.post-grid{grid-template-columns:1fr;}
  .emg-orbit{width:320px;height:320px;top:-160px;right:-160px;}
  .emg-map-visual::before{width:260px;height:260px;}
  .emg-map-visual::after{width:160px;height:160px;}
}

/* --------------------------------------------------------------------------
   19. Connect page chrome
   -------------------------------------------------------------------------- */

.emg-scheduler-panel{
  text-align:center;
  /* the panel carries a fixed 520px width for desktop; cap it so it cannot
     outgrow its column at tablet widths */
  width:100% !important;
  max-width:520px;
}
.emg-scheduler-panel .circle{
  width:70px;
  height:70px;
  margin:0 auto 22px;
  border:1px solid var(--emg-gold);
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:26px;
  color:var(--emg-gold);
}

.emg-map-visual{
  position:relative;
  overflow:hidden;
}
.emg-map-visual::before,
.emg-map-visual::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(184,149,74,0.28);
  border-radius:50%;
  pointer-events:none;
}
.emg-map-visual::before{width:380px;height:380px;}
.emg-map-visual::after{width:240px;height:240px;}
.emg-map-dot{
  position:absolute;
  left:50%;
  top:50%;
  width:16px;
  height:16px;
  border-radius:50%;
  background:var(--emg-gold);
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 16px rgba(184,149,74,0.11), 0 0 0 44px rgba(184,149,74,0.06);
  pointer-events:none;
}

/* --------------------------------------------------------------------------
   20. Home hero
   -------------------------------------------------------------------------- */

.emg-home-hero .elementor-heading-title .accent{
  color:var(--emg-green);
  position:relative;
  display:inline-block;
}
.emg-home-hero .elementor-heading-title .accent::after{
  content:"";
  position:absolute;
  left:2px;
  right:0;
  bottom:-7px;
  height:3px;
  background:linear-gradient(90deg, var(--emg-gold), rgba(184,149,74,0));
  transform-origin:left;
  animation:emgLineGrow 1.15s .55s both ease;
}
@keyframes emgLineGrow{from{transform:scaleX(0);}to{transform:scaleX(1);}}

.elementor-widget-text-editor .emg-proofline{
  display:flex;
  flex-wrap:wrap;
  gap:10px 20px;
  font-family:var(--emg-mono) !important;
  font-size:12px !important;
  letter-spacing:0.06em !important;
  text-transform:uppercase;
  color:var(--emg-green-deep) !important;
}
.elementor-widget-text-editor .emg-proofline span{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.elementor-widget-text-editor .emg-proofline span::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--emg-gold);
  flex:0 0 auto;
}

.elementor-widget-text-editor .emg-mini-line{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  font-family:var(--emg-mono) !important;
  font-size:11px !important;
  letter-spacing:0.1em !important;
  text-transform:uppercase;
  color:var(--emg-green) !important;
}
.elementor-widget-text-editor .emg-mini-line i{
  display:block;
  width:34px;
  height:1px;
  background:var(--emg-gold);
  flex:0 0 auto;
}

.emg-visual{position:relative;}

.emg-image-frame{
  position:absolute;
  inset:42px 0 0 74px;
  overflow:hidden;
  border-radius:var(--emg-radius);
  box-shadow:0 30px 70px rgba(16,39,32,0.14);
}
.emg-image-frame .elementor-widget-image,
.emg-image-frame figure,
.emg-image-frame .elementor-widget-container{height:100%;}
.emg-image-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:0;
  filter:saturate(.85) contrast(.98);
}
.emg-image-frame::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(to top, rgba(16,39,32,0.48), rgba(16,39,32,0.04) 50%);
}

.emg-card{
  position:absolute;
  z-index:3;
  backdrop-filter:blur(8px);
  box-shadow:0 18px 48px rgba(16,39,32,0.12);
}
.elementor-widget-text-editor .emg-card-label{
  font-family:var(--emg-mono) !important;
  font-size:10px !important;
  letter-spacing:0.14em !important;
  text-transform:uppercase;
  color:var(--emg-gold) !important;
}
.emg-card-top{top:0;left:0;width:min(310px,68%);}
.emg-card-bottom{right:-18px;bottom:24px;width:min(330px,72%);}

@media (max-width:1024px){
  .emg-image-frame{inset:34px 0 0 50px;}
}
@media (max-width:767px){
  .emg-image-frame{inset:34px 0 0 28px;}
  .emg-card-top{width:72%;}
  .emg-card-bottom{right:0;bottom:10px;width:76%;}
  .elementor-widget-text-editor .emg-mini-line i{width:22px;}
}

/* --------------------------------------------------------------------------
   21. Small screens
   -------------------------------------------------------------------------- */

@media (max-width:767px){
  .elementor-widget-divider + .elementor-widget-text-editor,
  .elementor-widget-divider + .elementor-widget-text-editor p{
    font-size:11px !important;
    letter-spacing:0.12em !important;
  }
  .elementor-button,
  .elementor-button-link{font-size:12px !important;}

  /* widgets set to "custom width: initial" are flex items that collapse to
     min-content once the row is narrow, which broke the hero headline into
     one word per line on phones */
  .elementor-widget-heading.elementor-widget__width-initial,
  .elementor-widget-text-editor.elementor-widget__width-initial{
    width:100% !important;
    max-width:100% !important;
  }
}
