/* ============================================================
   ContentGem — motion system
   Derived from the two explicit Brandkit 3.0 motion rules:
     10.6  "Motion must respect reduced-motion preferences."
     13.5  "No decorative hover movement on dense operational
            cards when it could imply clickability."
   plus the calm/non-theatrical personality standard (3.1).
   Consequences applied here:
     - Reveals are short, single-direction and run once.
     - Dense operational surfaces change border and shadow on
       hover, never position.
     - Nothing loops except the evidence rail, which encodes
       the reasoning loop itself.
     - Without JavaScript, all content is visible immediately.
   ============================================================ */

/* Reveal targets stay visible unless JS confirms it can reveal them. */
.cg-js .cg-reveal{opacity:0;transform:translateY(14px);
  transition:opacity .62s cubic-bezier(.22,.61,.36,1),transform .62s cubic-bezier(.22,.61,.36,1);
  transition-delay:var(--cg-delay,0ms);will-change:opacity,transform;}
.cg-js .cg-reveal.cg-in{opacity:1;transform:none;}

/* Hairline rules draw themselves in rather than fading. */
.cg-js .cg-rule-gold{transform:scaleX(.12);transform-origin:left center;
  transition:transform .9s cubic-bezier(.22,.61,.36,1);}
.cg-js .cg-rule-gold.cg-in{transform:scaleX(1);}

/* The evidence grid on marine sections resolves once, like a completed scan. */
.cg-js .cg-dark::before,.cg-js .cg-on-dark::before{opacity:0;
  transition:opacity 1.15s ease .12s;}
.cg-js .cg-dark.cg-in::before,.cg-js .cg-on-dark.cg-in::before{opacity:1;}

/* ---------- hover: state change, not movement ---------- */
.cg-card,.cg-glass,.cg-surface,.cg-faq details{
  transition:border-color .22s ease,box-shadow .22s ease,background-color .22s ease;}
.cg-card:hover{border-color:#D8CDB6;
  box-shadow:0 1px 2px rgba(6,26,48,.07),0 22px 46px -28px rgba(6,26,48,.45);}
.cg-glass:hover{border-color:rgba(226,196,133,.42);background:rgba(247,242,232,.085);}
.cg-faq summary{transition:background-color .18s ease,color .18s ease;}
.cg-faq summary:hover{background:#FBF9F5;}
.cg-faq details[open] summary{background:#FBF9F5;}
.cg-faq details > div{animation:cg-open .32s ease both;}
@keyframes cg-open{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* Text links may nudge: a link is not a dense operational card. */
.cg-card__meta a{display:inline-block;transition:transform .18s ease,color .18s ease;}
.cg-card__meta a:hover{transform:translateX(3px);}

/* Table rows highlight on hover to keep long comparisons readable. */
.cg-table tbody tr{transition:background-color .18s ease;}
.cg-table tbody tr:hover td,.cg-table tbody tr:hover th{background:#F6F1E7;}

/* ---------- metric count-up ---------- */
.cg-metric b{transition:color .3s ease;}
.cg-metric b[data-cg-counting]{color:var(--cg-marine-2);}

/* ---------- sticky header condense (Elementor Pro sticky) ---------- */
.cg-header{transition:padding .26s ease,background-color .26s ease,border-color .26s ease;}
.cg-header.elementor-sticky--effects{background-color:rgba(6,26,48,.94)!important;
  backdrop-filter:blur(12px);border-bottom-color:rgba(226,196,133,.34)!important;}
.cg-header.elementor-sticky--effects .cg-headmark{transform:scale(.9);}
.cg-headmark{transition:transform .26s ease;}

/* nav: gold hairline sweeps under the active or hovered item */
.cg-header .elementor-nav-menu a{position:relative;}
.cg-header .elementor-nav-menu a::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:1px;
  background:linear-gradient(90deg,var(--cg-gold),var(--cg-champagne));
  transform:scaleX(0);transform-origin:left center;transition:transform .24s cubic-bezier(.22,.61,.36,1);}
.cg-header .elementor-nav-menu a:hover::after,
.cg-header .elementor-nav-menu .current-menu-item > a::after{transform:scaleX(1);}

/* ---------- reduced motion: nothing moves, nothing stays hidden ---------- */
@media (prefers-reduced-motion:reduce){
  .cg-js .cg-reveal{opacity:1!important;transform:none!important;transition:none!important;}
  .cg-js .cg-rule-gold{transform:none!important;}
  .cg-js .cg-dark::before,.cg-js .cg-on-dark::before{opacity:1!important;}
  .cg-rail::after{animation:none;}
  .cg-faq details > div{animation:none;}
  .cg-card:hover,.cg-glass:hover{box-shadow:var(--cg-shadow);}
}