/* ==========================================================================
   CAPYOL — Global premium design system
   Gold / Navy identity, scroll-reveal, shimmer, glass, motion
   ========================================================================== */

:root{
  /* Official Capyol brand palette */
  --cap-navy-2:       #0f4a37;   /* brighter green — gradient highlight */
  --cap-navy:         #0b3d2e;   /* Dark Green — primary brand green */
  --cap-navy-3:        #0a1a14;   /* Charcoal — page base background */
  --cap-navy-deep:    #071309;   /* deepest — footer */
  --cap-gold-1:       #c79200;   /* Gold — primary brand gold */
  --cap-gold-2:       #e6ba4f;   /* lighter gold highlight */
  --cap-gold-3:       #8f6a00;   /* darker gold shade */
  --cap-gold-glow:    rgba(199,146,0,0.32);
  --cap-white:        #f5f5e9;   /* Light — brand cream/off-white */
  --cap-text-muted:   #9fb0a2;
  --cap-border-gold:  rgba(199,146,0,0.3);
  --cap-ease:         cubic-bezier(.16,.84,.44,1);
}

html{ scroll-behavior:smooth; }

body{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:var(--cap-navy-3);
  color:#dde5da;
}

h1,h2,h3,h4, .elementor-heading-title{
  font-family:'Sora', 'Inter', sans-serif !important;
  letter-spacing:-0.01em;
}

/* ---- Selection ---- */
::selection{ background:var(--cap-gold-1); color:#0e2c21; }

/* ---- Scrollbar ---- */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--cap-navy-3); }
::-webkit-scrollbar-thumb{ background:linear-gradient(var(--cap-gold-3), var(--cap-gold-1)); border-radius:10px; }

/* ==========================================================================
   Gold gradient text utility — add class "cap-gold-text"
   ========================================================================== */
.cap-gold-text{
  background:linear-gradient(90deg, var(--cap-gold-3) 0%, var(--cap-gold-2) 35%, #fff6d8 50%, var(--cap-gold-2) 65%, var(--cap-gold-3) 100%);
  background-size:200% auto;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:capShimmerText 6s linear infinite;
}
@keyframes capShimmerText{
  0%{ background-position:0% 50%; }
  100%{ background-position:200% 50%; }
}

/* ==========================================================================
   Shimmer accent line — <div class="cap-shimmer-line"></div>
   ========================================================================== */
.cap-shimmer-line{
  width:120px; height:2px; margin:0 auto;
  background:linear-gradient(90deg, transparent, var(--cap-gold-3) 15%, var(--cap-gold-2) 50%, #fff6d8 55%, var(--cap-gold-2) 60%, var(--cap-gold-3) 85%, transparent);
  background-size:200% 100%;
  animation:capShimmerLine 3.5s linear infinite;
}
@keyframes capShimmerLine{
  0%{ background-position:200% 0; }
  100%{ background-position:-200% 0; }
}

/* ==========================================================================
   Scroll reveal — data-cap-reveal="up|fade|left|right" on any element
   ========================================================================== */
.cap-reveal-up, .cap-reveal-fade, .cap-reveal-left, .cap-reveal-right, .cap-reveal-scale{
  opacity:0;
  will-change:transform, opacity;
  transition:opacity .9s var(--cap-ease), transform .9s var(--cap-ease);
}
.cap-reveal-up{ transform:translateY(36px); }
.cap-reveal-fade{ transform:none; }
.cap-reveal-left{ transform:translateX(-40px); }
.cap-reveal-right{ transform:translateX(40px); }
.cap-reveal-scale{ transform:scale(.94); }
.cap-reveal-up.cap-visible, .cap-reveal-fade.cap-visible, .cap-reveal-left.cap-visible, .cap-reveal-right.cap-visible, .cap-reveal-scale.cap-visible{
  opacity:1;
  transform:translate(0,0) scale(1);
}
/* CSS-only safety net: guarantee everything is visible/selectable inside the Elementor
   editor even if premium.js's JS-based editor detection doesn't fire in time (e.g. after
   Elementor re-renders a panel). Elementor puts this class on the preview iframe's own body. */
body.elementor-editor-active .cap-reveal-up,
body.elementor-editor-active .cap-reveal-fade,
body.elementor-editor-active .cap-reveal-left,
body.elementor-editor-active .cap-reveal-right,
body.elementor-editor-active .cap-reveal-scale{
  opacity:1 !important;
  transform:none !important;
}
.cap-delay-0{ transition-delay:0s; }
.cap-delay-1{ transition-delay:.08s; }
.cap-delay-2{ transition-delay:.16s; }
.cap-delay-3{ transition-delay:.24s; }
.cap-delay-4{ transition-delay:.32s; }

/* ==========================================================================
   Glass card
   ========================================================================== */
.cap-glass{
  background:linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.015));
  border:1px solid var(--cap-border-gold);
  border-radius:16px;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  transition:transform .45s var(--cap-ease), border-color .45s ease, box-shadow .45s ease;
  position:relative;
  overflow:hidden;
}
.cap-glass::before{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(120deg, transparent 30%, rgba(199,146,0,0.08) 45%, transparent 60%);
  background-size:200% 200%;
  background-position:200% 0;
  transition:background-position .8s ease;
  pointer-events:none;
}
.cap-glass:hover{
  transform:translateY(-6px);
  border-color:rgba(199,146,0,0.6);
  box-shadow:0 20px 50px -20px rgba(0,0,0,0.5), 0 0 0 1px rgba(199,146,0,0.15);
}
.cap-glass:hover::before{ background-position:0% 0; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.cap-btn-gold, a.cap-btn-gold{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:15px 34px;
  font-weight:700; font-size:15px; letter-spacing:.01em;
  color:#191104 !important;
  background:linear-gradient(90deg, var(--cap-gold-3), var(--cap-gold-1) 50%, var(--cap-gold-2));
  background-size:200% auto;
  border:none; border-radius:10px;
  cursor:pointer;
  text-decoration:none !important;
  transition:background-position .5s ease, transform .35s var(--cap-ease), box-shadow .35s ease;
  box-shadow:0 8px 24px -8px rgba(199,146,0,0.45);
}
.cap-btn-gold:hover{
  background-position:100% 0;
  transform:translateY(-2px);
  box-shadow:0 14px 32px -10px rgba(199,146,0,0.6);
  color:#191104 !important;
}

.cap-btn-ghost, a.cap-btn-ghost{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 32px;
  font-weight:600; font-size:15px;
  color:#e6ba4f !important;
  background:transparent;
  border:1px solid rgba(199,146,0,0.45);
  border-radius:10px;
  text-decoration:none !important;
  transition:all .35s var(--cap-ease);
}
.cap-btn-ghost:hover{
  background:rgba(199,146,0,0.1);
  border-color:var(--cap-gold-2);
  transform:translateY(-2px);
}

/* Elementor's "CSS Classes" field lands the class on the outer .elementor-widget wrapper,
   not on the real <a class="elementor-button"> tag inside — so re-target the real button
   for Button widgets specifically, and neutralize the wrapper so it doesn't double-box it. */
.elementor-widget.cap-btn-gold, .elementor-widget.cap-btn-ghost{
  display:inline-block; background:none; padding:0; border:none; box-shadow:none;
}
.elementor-widget.cap-btn-gold .elementor-button{
  display:inline-flex !important; align-items:center; justify-content:center; gap:8px;
  padding:15px 34px !important;
  font-weight:700; font-size:15px !important; letter-spacing:.01em;
  color:#191104 !important;
  background:linear-gradient(90deg, var(--cap-gold-3), var(--cap-gold-1) 50%, var(--cap-gold-2)) !important;
  background-size:200% auto;
  border:none !important; border-radius:10px !important;
  box-shadow:0 8px 24px -8px rgba(199,146,0,0.45);
  transition:background-position .5s ease, transform .35s var(--cap-ease), box-shadow .35s ease;
}
.elementor-widget.cap-btn-gold .elementor-button:hover{
  background-position:100% 0; transform:translateY(-2px);
  box-shadow:0 14px 32px -10px rgba(199,146,0,0.6); color:#191104 !important;
}
.elementor-widget.cap-btn-ghost .elementor-button{
  display:inline-flex !important; align-items:center; justify-content:center; gap:8px;
  padding:14px 32px !important;
  font-weight:600; font-size:15px !important;
  color:#e6ba4f !important;
  background:transparent !important;
  border:1px solid rgba(199,146,0,0.45) !important; border-radius:10px !important;
  transition:all .35s var(--cap-ease);
}
.elementor-widget.cap-btn-ghost .elementor-button:hover{
  background:rgba(199,146,0,0.1) !important; border-color:var(--cap-gold-2) !important; transform:translateY(-2px);
}

/* ==========================================================================
   Animated counter number
   ========================================================================== */
.cap-counter{
  font-family:'Sora', sans-serif;
  font-weight:800;
  font-variant-numeric:tabular-nums;
}

/* ==========================================================================
   Section dark navy background helper
   ========================================================================== */
.cap-section-navy{
  background:radial-gradient(circle at 50% 0%, var(--cap-navy-2) 0%, var(--cap-navy) 55%, var(--cap-navy-3) 100%);
  position:relative;
}

/* Subtle grid overlay */
.cap-grid-overlay{
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(199,146,0,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(199,146,0,0.05) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(circle at 50% 30%, black, transparent 75%);
  pointer-events:none;
}

/* Floating glow blobs */
.cap-glow-blob{
  position:absolute;
  width:600px; height:600px;
  border-radius:50%;
  background:radial-gradient(circle, var(--cap-gold-glow) 0%, transparent 70%);
  filter:blur(10px);
  pointer-events:none;
  animation:capFloat 12s ease-in-out infinite;
}
@keyframes capFloat{
  0%,100%{ transform:translate(0,0); }
  50%{ transform:translate(30px,-30px); }
}

/* ==========================================================================
   Sticky header shrink
   ========================================================================== */
.cap-header{
  transition:padding .35s var(--cap-ease), background-color .35s ease, box-shadow .35s ease;
}
.cap-header.cap-scrolled{
  box-shadow:0 8px 30px -12px rgba(0,0,0,0.5);
}

/* ==========================================================================
   Responsive niceties
   ========================================================================== */
@media (max-width:768px){
  .cap-glow-blob{ width:340px; height:340px; }
}

/* ==========================================================================
   Site header
   ========================================================================== */
.cap-header{
  position:fixed; top:0; left:0; right:0; z-index:999;
  background:rgba(8,20,15,0.55);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(199,146,0,0.12);
}
.cap-header.cap-scrolled{ background:rgba(7,17,13,0.92); }
.cap-header-inner{
  max-width:1240px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px;
}
.cap-header-logo img{ display:block; }
.cap-header-nav{ display:flex; gap:30px; }
.cap-header-nav a{
  color:#cfd6e4; text-decoration:none; font-size:14.5px; font-weight:500;
  position:relative; padding:4px 0; transition:color .25s ease;
}
.cap-header-nav a::after{
  content:''; position:absolute; left:0; bottom:-2px; width:0; height:1.5px;
  background:linear-gradient(90deg, var(--cap-gold-3), var(--cap-gold-2));
  transition:width .3s var(--cap-ease);
}
.cap-header-nav a:hover{ color:var(--cap-white); }
.cap-header-nav a:hover::after{ width:100%; }
.cap-header-actions{ display:flex; align-items:center; gap:14px; }
.cap-header-actions .cap-btn-ghost, .cap-header-actions .cap-btn-gold{ padding:10px 22px; font-size:13.5px; }
.cap-header-burger{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; }
.cap-header-burger span{ width:22px; height:2px; background:#e6ba4f; border-radius:2px; }

body{ padding-top:76px; }

@media (max-width:900px){
  .cap-header-nav{
    position:fixed; top:70px; left:0; right:0;
    flex-direction:column; gap:0;
    background:rgba(7,17,13,0.98);
    border-bottom:1px solid rgba(199,146,0,0.15);
    max-height:0; overflow:hidden;
    transition:max-height .4s var(--cap-ease);
  }
  .cap-header-nav.cap-open{ max-height:420px; }
  .cap-header-nav a{ padding:16px 28px; border-bottom:1px solid rgba(255,255,255,0.05); }
  .cap-header-actions .cap-btn-ghost.cap-header-login{ display:none; }
  .cap-header-burger{ display:flex; }
  body{ padding-top:66px; }
}

/* ==========================================================================
   Site footer
   ========================================================================== */
.cap-footer{
  background:var(--cap-navy-deep);
  border-top:1px solid rgba(199,146,0,0.15);
  padding:64px 28px 28px;
}
.cap-footer-inner{ max-width:1240px; margin:0 auto; }
.cap-footer-top{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:48px;
  padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,0.06);
}
.cap-footer-brand p{ color:var(--cap-text-muted); font-size:13px; margin-top:12px; letter-spacing:.04em; text-transform:uppercase; }
.cap-footer-cols{ display:flex; gap:64px; flex-wrap:wrap; }
.cap-footer-col h4{ color:var(--cap-white); font-size:14px; margin:0 0 16px; letter-spacing:.03em; }
.cap-footer-col a{
  display:block; color:var(--cap-text-muted); text-decoration:none; font-size:14px;
  margin-bottom:10px; transition:color .25s ease;
}
.cap-footer-col a:hover{ color:var(--cap-gold-2); }
.cap-footer-bottom{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  padding-top:24px; color:#5b6478; font-size:12.5px;
}
.cap-footer-risk{ max-width:520px; text-align:right; }
@media (max-width:700px){
  .cap-footer-bottom{ flex-direction:column; }
  .cap-footer-risk{ text-align:left; }
}

/* fix: prevent nav links wrapping to multiple lines */
.cap-header-nav a{ white-space:nowrap; }
.cap-header-nav{ gap:22px; }
@media (max-width:1100px){
  .cap-header-nav{ gap:16px; }
  .cap-header-nav a{ font-size:13.5px; }
}

/* fix: theme reset CSS (height:auto) was overriding the logo's intended size */
.cap-header-logo img{ height:26px !important; width:auto !important; max-width:none !important; }
.cap-footer-brand img{ height:24px !important; width:auto !important; max-width:none !important; }

/* fix: mobile header overflow — tighten spacing so logo + CTA + burger always fit */
html, body{ overflow-x:hidden; max-width:100%; }
@media (max-width:900px){
  .cap-header-inner{ padding:14px 16px; }
  .cap-header-actions{ gap:8px; }
  .cap-header-actions .cap-btn-gold.cap-header-cta{
    padding:9px 14px; font-size:12.5px; white-space:nowrap;
  }
  .cap-header-burger{ padding:4px; }
}
@media (max-width:400px){
  .cap-header-logo img{ height:22px !important; }
  .cap-header-actions .cap-btn-gold.cap-header-cta{ padding:8px 11px; font-size:11.5px; }
}

/* fix: WordPress admin bar (visible only to logged-in admins) was covering our fixed header */
body.admin-bar .cap-header{ top:32px; }
@media (max-width:782px){
  body.admin-bar .cap-header{ top:46px; }
}

/* ==========================================================================
   CAPYOL — shared inner-page section system (2026-09-14)
   Promoted from home-content.html's page-scoped style block so every new
   page can reuse the SAME id vocabulary without re-injecting a duplicate
   <style> HTML widget per page. Since only one page is ever in the DOM at
   once, reusing these exact ids across pages is safe (no real collision).
   Home page itself is untouched — it still carries its own copy inline;
   this is for every page built AFTER Home.
   ========================================================================== */

#cap-hero-sec, #cap-final-sec, [id^="cap-sec-"]{
  background:radial-gradient(circle at 50% 0%, var(--cap-navy-2) 0%, var(--cap-navy) 55%, var(--cap-navy-3) 100%);
  position:relative;
}
[id^="cap-sec-"]{ padding:100px 24px; }
[id^="cap-sec-"].cap-sec-tight{ padding:60px 24px; }

/* ---- Inner-page hero (shorter than Home's 80vh splash) ---- */
#cap-hero-sec{
  min-height:46vh; display:flex; align-items:center; justify-content:center;
  text-align:center; padding:150px 24px 70px; overflow:hidden;
}
#cap-hero-sec .cap-glow-blob:nth-child(1){ top:-220px; left:-120px; }
#cap-hero-sec .cap-glow-blob:nth-child(2){ bottom:-260px; right:-160px; width:600px; height:600px; animation-delay:-6s; }
#cap-hero-inner-col{ position:relative; z-index:2; max-width:760px; margin:0 auto; }

.cap-eyebrow, .cap-eyebrow *{
  display:inline-block; padding:8px 18px; margin-bottom:24px;
  border:1px solid rgba(199,146,0,0.35); border-radius:100px;
  font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:#e6ba4f !important; background:rgba(199,146,0,0.06);
}
#cap-hero-inner-col h1, #cap-hero-inner-col h1 *{
  font-size:clamp(32px, 5vw, 54px); line-height:1.1; font-weight:800;
  margin:0 0 20px !important; color:var(--cap-white) !important;
}
#cap-hero-inner-col p, #cap-hero-inner-col p *{
  font-size:clamp(15px, 1.6vw, 18px); line-height:1.7; color:var(--cap-text-muted,#98a2b8) !important;
  max-width:620px; margin:0 auto !important;
}

/* ---- Generic section head (eyebrow + h2 + intro paragraph, centered) ---- */
.cap-section-eyebrow, .cap-section-eyebrow *{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:#8f6a00 !important; font-weight:700; margin-bottom:14px; }
[id^="cap-head-"]{ text-align:center; max-width:680px; margin:0 auto 60px; }
[id^="cap-head-"] h2, [id^="cap-head-"] h2 *{ font-size:clamp(26px,3.4vw,40px); color:var(--cap-white) !important; margin:0 0 16px !important; font-weight:800; }
[id^="cap-head-"] p, [id^="cap-head-"] p *{ color:var(--cap-text-muted,#98a2b8) !important; font-size:16px; line-height:1.7; margin:0 !important; }
[id^="cap-headl-"]{ text-align:left; max-width:680px; margin:0 0 44px; }
[id^="cap-headl-"] h2, [id^="cap-headl-"] h2 *{ font-size:clamp(26px,3.4vw,40px); color:var(--cap-white) !important; margin:0 0 16px !important; font-weight:800; }
[id^="cap-headl-"] p, [id^="cap-headl-"] p *{ color:var(--cap-text-muted,#98a2b8) !important; font-size:16px; line-height:1.7; margin:0 !important; }

/* ---- Generic icon/feature card grid (reused for values, features, comparisons) ---- */
[id^="cap-row-"]{ max-width:1180px; margin:0 auto; }
.cap-card-pad{ padding:34px 26px; }
.cap-card-pad .elementor-icon-box-wrapper{ text-align:left; }
.cap-card-pad .elementor-icon-box-icon{
  width:52px; height:52px; border-radius:14px; margin-bottom:22px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(199,146,0,0.18), rgba(199,146,0,0.04));
  border:1px solid rgba(199,146,0,0.3);
}
/* Icons in this Elementor install render as inline <svg> (not <i> font-icon tags), so color has
   to land on the wrapper and rely on the svg's own fill:currentColor -- targeting "i" here (the
   naive guess) silently matches nothing and the icon falls back to Elementor's default tint. */
body .cap-card-pad .elementor-icon-box-icon{ color:#e6ba4f !important; }
body .cap-card-pad .elementor-icon-box-icon svg{ width:22px; height:22px; fill:currentColor !important; }
.cap-card-pad .elementor-icon-box-title, .cap-card-pad .elementor-icon-box-title *{ font-size:18px; color:var(--cap-white) !important; margin:0 0 10px !important; font-weight:700; }
.cap-card-pad .elementor-icon-box-description, .cap-card-pad .elementor-icon-box-description *{ font-size:14.5px; color:var(--cap-text-muted,#98a2b8) !important; line-height:1.7; margin:0 !important; }

/* ---- Media + copy row (image/mock on one side, text on the other) ---- */
[id^="cap-row-"] .elementor-container{ align-items:center; }
[id^="cap-copy-"]{ min-width:0; }
[id^="cap-copy-"] .cap-section-eyebrow{ text-align:left; }
[id^="cap-copy-"] h2, [id^="cap-copy-"] h2 *{ text-align:left; font-size:clamp(24px,3vw,36px); color:var(--cap-white) !important; margin:0 0 18px !important; font-weight:800; }
[id^="cap-copy-"] p, [id^="cap-copy-"] p *{ text-align:left; color:var(--cap-text-muted,#98a2b8) !important; font-size:15.5px; line-height:1.8; margin:0 0 26px !important; }
/* Icon + text color for these lists comes from the widget's own native icon_color/text_color
   settings (see cap_icon_list() in cap-dsl.php) -- NOT custom CSS. A broad `.item *{color}` rule
   here would repaint the icon's svg too (color is inherited by fill:currentColor), silently
   fighting the native control -- found live 2026-09-14 on this exact list. Only layout below. */
.cap-copy-list .elementor-icon-list-items{ margin:0 0 30px; }
.cap-copy-list .elementor-icon-list-item{ display:flex; align-items:center; gap:12px; font-size:14.5px; margin-bottom:14px !important; }
@media (max-width:900px){
  [id^="cap-copy-"] h2, [id^="cap-copy-"] p, [id^="cap-copy-"] .cap-section-eyebrow{ text-align:center; }
  .cap-copy-list .elementor-icon-list-items{ max-width:360px; margin-left:auto; margin-right:auto; }
}

/* ---- Stat row (Counter widgets) ---- */
[id^="cap-stat-"] .elementor-counter-number-wrapper, [id^="cap-stat-"] .elementor-counter-number-wrapper *{ font-family:'Sora',sans-serif; font-weight:800; font-size:clamp(28px,3.6vw,40px); color:var(--cap-white) !important; }
[id^="cap-stat-"] .elementor-counter-title, [id^="cap-stat-"] .elementor-counter-title *{ font-size:13px; color:var(--cap-text-muted,#98a2b8) !important; margin-top:8px; text-transform:uppercase; letter-spacing:.06em; }

/* ---- Final CTA (reused shape site-wide) ---- */
#cap-final-cta-col{ text-align:center; max-width:640px; margin:0 auto; }
#cap-final-cta-col h2, #cap-final-cta-col h2 *{ font-size:clamp(26px,3.6vw,40px); color:var(--cap-white) !important; margin:0 0 18px !important; font-weight:800; }
#cap-final-cta-col p, #cap-final-cta-col p *{ color:var(--cap-text-muted,#98a2b8) !important; font-size:16px; margin:0 0 36px !important; }

/* ==========================================================================
   New components for the inner pages
   ========================================================================== */

/* ---- Pricing / account-tier comparison card (extends .cap-glass) ---- */
/* Price-tier card is a COLUMN (holds several separate widgets: badge/name/figure/list/button),
   so it needs the [id^="..."] pattern like every other container in this system -- .cap-price-card
   as a class would silently not render (Section/Column _css_classes bug). Self-contained glass
   styling here (not layered on .cap-glass, which is also a class and wouldn't render on a column
   either). */
[id^="cap-price-"]{
  padding:36px 30px; text-align:center; border-radius:16px;
  background:linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.015));
  border:1px solid var(--cap-border-gold);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  transition:transform .35s var(--cap-ease), border-color .35s ease, box-shadow .35s ease;
}
[id^="cap-price-"]:hover{ transform:translateY(-4px); }
[id^="cap-price-featured-"]{ border-color:rgba(199,146,0,0.6); box-shadow:0 0 0 1px rgba(199,146,0,0.35), 0 24px 60px -24px rgba(199,146,0,0.35); transform:scale(1.03); }
[id^="cap-price-featured-"]:hover{ transform:scale(1.03) translateY(-4px); }
.cap-price-badge, .cap-price-badge *{
  display:inline-block; padding:5px 14px; margin-bottom:16px; border-radius:100px;
  font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:#191104 !important; background:linear-gradient(90deg,var(--cap-gold-3),var(--cap-gold-2)) !important;
}
.cap-price-name, .cap-price-name *{ font-size:20px; font-weight:800; color:var(--cap-white) !important; margin:0 0 6px !important; }
.cap-price-figure, .cap-price-figure *{ font-family:'Sora',sans-serif; font-size:34px; font-weight:800; color:var(--cap-gold-2) !important; margin:0 0 18px !important; }
/* Icon + text color come from cap_icon_list()'s native icon_color/text_color settings; only
   layout here (see the .cap-copy-list comment above for why not a broad `.item *{color}` rule). */
.cap-price-list .elementor-icon-list-items{ text-align:left; margin:0 0 26px; }
.cap-price-list .elementor-icon-list-item{ display:flex; align-items:flex-start; gap:10px; font-size:13.5px; margin-bottom:12px !important; }

/* ---- Spec / data table (spreads, commissions) ---- */
.cap-spec-wrap{
  max-width:900px; margin:0 auto; overflow-x:auto; border-radius:16px;
  border:1px solid rgba(199,146,0,0.18); background:rgba(255,255,255,0.02); padding:8px 20px;
}
.cap-spec-table{ width:100%; border-collapse:collapse; min-width:480px; }
.cap-spec-table th, .cap-spec-table td{ padding:16px 18px; text-align:left; font-size:14px; border-bottom:1px solid rgba(255,255,255,0.07); }
.cap-spec-table th{ color:#e6ba4f; font-weight:700; text-transform:uppercase; font-size:11.5px; letter-spacing:.06em; }
.cap-spec-table td{ color:#cfd6e4; }
.cap-spec-table tr:last-child td{ border-bottom:none; }
.cap-spec-table td:first-child, .cap-spec-table th:first-child{ color:var(--cap-white); font-weight:600; }

/* ---- FAQ Accordion (Elementor's native accordion widget) ---- */
.cap-faq .elementor-accordion-item{
  background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border:1px solid rgba(199,146,0,0.18) !important; border-radius:12px !important;
  margin-bottom:14px; overflow:hidden;
}
.cap-faq .elementor-tab-title{ padding:20px 22px !important; }
.cap-faq .elementor-tab-title a, .cap-faq .elementor-tab-title .elementor-accordion-title{ color:var(--cap-white) !important; font-weight:700 !important; font-size:15.5px !important; }
body .cap-faq .elementor-tab-title .elementor-accordion-icon{ color:#e6ba4f !important; }
body .cap-faq .elementor-tab-title .elementor-accordion-icon i{ color:#e6ba4f !important; }
body .cap-faq .elementor-tab-title .elementor-accordion-icon svg{ fill:#e6ba4f !important; }
.cap-faq .elementor-tab-content{ padding:0 22px 22px !important; color:var(--cap-text-muted,#98a2b8) !important; font-size:14.5px !important; line-height:1.75 !important; border-top:none !important; }

/* ---- Contact info card ---- */
.cap-contact-card{ padding:30px 26px; }
.cap-contact-card .elementor-icon-box-icon{
  width:48px; height:48px; border-radius:12px; margin-bottom:18px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(199,146,0,0.18), rgba(199,146,0,0.04));
  border:1px solid rgba(199,146,0,0.3);
}
body .cap-contact-card .elementor-icon-box-icon{ color:#e6ba4f !important; }
body .cap-contact-card .elementor-icon-box-icon svg{ width:19px; height:19px; fill:currentColor !important; }
.cap-contact-card .elementor-icon-box-title, .cap-contact-card .elementor-icon-box-title *{ font-size:15px; color:#8f6a00 !important; text-transform:uppercase; letter-spacing:.05em; margin:0 0 8px !important; font-weight:700; }
.cap-contact-card .elementor-icon-box-description, .cap-contact-card .elementor-icon-box-description *{ font-size:16px; color:var(--cap-white) !important; line-height:1.6; margin:0 !important; }

/* ---- Simple contact form (visual only until a backend is wired) ---- */
.cap-form{ display:flex; flex-direction:column; gap:16px; }
.cap-form-row{ display:flex; gap:16px; flex-wrap:wrap; }
.cap-form-row .cap-field{ flex:1 1 200px; }
.cap-field label{ display:block; font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:#9fb0a2; margin-bottom:8px; }
.cap-field input, .cap-field textarea{
  width:100%; box-sizing:border-box; padding:13px 15px; font-family:'Inter',sans-serif; font-size:14.5px;
  background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.1); border-radius:9px; color:#f5f5e9;
}
.cap-field input:focus, .cap-field textarea:focus{ outline:none; border-color:var(--cap-gold-2); box-shadow:0 0 0 3px rgba(199,146,0,0.14); }
.cap-field textarea{ resize:vertical; min-height:120px; }
.cap-form-note{ font-size:12.5px; color:#5b6478; margin-top:4px; }

/* ---- Legal / long-form text body ---- */
#cap-legal-col{ max-width:820px; margin:0 auto; }
#cap-legal-col h2, #cap-legal-col h2 *{ color:var(--cap-white) !important; font-size:22px; font-weight:800; margin:38px 0 14px !important; }
#cap-legal-col > .elementor-element:first-child h2{ margin-top:0 !important; }
#cap-legal-col p, #cap-legal-col p *{ color:var(--cap-text-muted,#98a2b8) !important; font-size:15px; line-height:1.85; margin:0 0 16px !important; }
#cap-legal-col ul, #cap-legal-col ul *{ color:var(--cap-text-muted,#98a2b8) !important; font-size:15px; line-height:1.85; }
#cap-legal-col em{ color:#e6ba4f; font-style:italic; }
.cap-legal-updated{ display:block; font-size:12.5px; color:#5b6478; margin-bottom:30px; text-transform:uppercase; letter-spacing:.05em; }

/* ---- Simple 2-col info list (used on About / Accounts) ---- */
/* Icon + text color come from cap_icon_list()'s native icon_color/text_color settings; only
   layout here (see the .cap-copy-list comment above for why not a broad `.item *{color}` rule). */
.cap-info-list .elementor-icon-list-item{ font-size:14.5px; margin-bottom:16px !important; display:flex; align-items:flex-start; gap:12px; }

/* ==========================================================================
   Terminal device mockup (promoted from home-content.html — reused verbatim
   on Platform & Tools; Home's own copy stays inline, untouched)
   ========================================================================== */
.cap-platform-mock{ position:relative; padding:40px 20px 60px; }
.cap-mock-ambient-glow{
  position:absolute; inset:-10% -5%; z-index:0;
  background:radial-gradient(ellipse at 50% 45%, rgba(199,146,0,0.22) 0%, transparent 68%);
  filter:blur(20px); pointer-events:none;
}
.cap-platform-mock-3d{ position:relative; z-index:1; perspective:1600px; }
.cap-platform-mock-3d-inner{
  border-radius:18px; padding:1.5px;
  background:linear-gradient(135deg, rgba(245,224,163,0.7), rgba(199,146,0,0.25) 40%, rgba(199,146,0,0.05) 75%);
  transform:rotateY(-7deg) rotateX(3deg) scale(0.98);
  transition:transform .7s cubic-bezier(.16,.84,.44,1);
  box-shadow:0 50px 90px -30px rgba(0,0,0,0.65), 0 15px 35px -15px rgba(0,0,0,0.5);
  transform-style:preserve-3d;
}
.cap-platform-mock:hover .cap-platform-mock-3d-inner{ transform:rotateY(-2deg) rotateX(1deg) scale(1); }
.cap-platform-mock-inner{ border-radius:16.5px; background:#0a120e; overflow:hidden; }
.cap-mock-browser-bar{ display:flex; align-items:center; gap:10px; padding:11px 14px; background:#0d1712; border-bottom:1px solid rgba(255,255,255,0.05); }
.cap-mock-dot{ width:9px; height:9px; border-radius:50%; flex-shrink:0; }
.cap-mock-dot--red{ background:#ec6a5e; }
.cap-mock-dot--yellow{ background:#f4bf4f; }
.cap-mock-dot--green{ background:#61c454; }
.cap-mock-url{ margin:0 auto; padding:4px 22px; border-radius:100px; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.06); font-size:11.5px; color:#7d8a80; letter-spacing:.02em; font-family:'Inter',sans-serif; }
.cap-mock-chart{ aspect-ratio:1600/816; position:relative; overflow:hidden; }
.cap-mock-real-chart{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top center; }
.cap-mock-live-badge{ position:absolute; top:12px; right:12px; z-index:2; display:flex; align-items:center; gap:6px; padding:5px 10px; border-radius:100px; background:rgba(10,26,20,0.75); border:1px solid rgba(199,146,0,0.35); font-size:10.5px; letter-spacing:.06em; color:#e6ba4f; font-weight:700; backdrop-filter:blur(4px); }
.cap-mock-live-badge i{ width:6px; height:6px; border-radius:50%; background:#34c77b; display:inline-block; animation:capPulse 1.6s ease-in-out infinite; }
@keyframes capPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }
.cap-mock-float-card{
  position:absolute; left:-8px; bottom:14px; z-index:3;
  display:flex; flex-direction:column; gap:2px; padding:14px 20px; border-radius:14px;
  background:linear-gradient(165deg, rgba(20,38,29,0.92), rgba(10,20,15,0.92));
  border:1px solid rgba(199,146,0,0.35); box-shadow:0 20px 40px -15px rgba(0,0,0,0.6);
  backdrop-filter:blur(10px); animation:capFloatCard 5s ease-in-out infinite;
}
.cap-mock-float-card .lbl{ font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:#9fb0a2; }
.cap-mock-float-card .val{ font-size:19px; font-weight:800; color:#3ecf7a; font-family:'Sora',sans-serif; }
@keyframes capFloatCard{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-8px); } }
@media (max-width:900px){
  .cap-platform-mock-3d-inner{ transform:none; }
  .cap-platform-mock:hover .cap-platform-mock-3d-inner{ transform:none; }
  .cap-mock-float-card{ left:8px; bottom:-16px; padding:10px 16px; }
  .cap-mock-float-card .val{ font-size:16px; }
}

/* ==========================================================================
   Block B (2026-10-19) — components for the new IA pages
   Glass-card COLUMNS use the id prefix cap-gc-* (classes don't render on columns)
   ========================================================================== */
[id^="cap-gc-"]{
  position:relative; padding:8px 8px; border-radius:18px; text-align:left;
  background:linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.015));
  border:1px solid var(--cap-border-gold);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  transition:transform .4s var(--cap-ease), border-color .4s ease, box-shadow .4s ease;
  overflow:hidden;
}
[id^="cap-gc-"]::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg, transparent 30%, rgba(199,146,0,0.09) 46%, transparent 62%);
  background-size:220% 220%; background-position:200% 0; transition:background-position .9s ease;
}
[id^="cap-gc-"]:hover{ transform:translateY(-6px); border-color:rgba(199,146,0,0.6); box-shadow:0 26px 60px -28px rgba(0,0,0,.7); }
[id^="cap-gc-"]:hover::before{ background-position:0 0; }
[id^="cap-gc-"] > .elementor-widget-wrap{ padding:22px 22px 18px !important; }
[id^="cap-row-"] .elementor-container{ gap:24px; }
.cap-gc-title, .cap-gc-title *{ font-size:20px; font-weight:800; color:var(--cap-white) !important; margin:6px 0 12px !important; }
.cap-gc-text, .cap-gc-text *{ font-size:14.5px; line-height:1.75; color:var(--cap-text-muted,#98a2b8) !important; margin:0 !important; }
.cap-badge-live, .cap-badge-live *{ color:#3ecf7a !important; border-color:rgba(62,207,122,.4) !important; background:rgba(62,207,122,.08) !important; }
.cap-badge-soon, .cap-badge-soon *{ color:#9fb0a2 !important; border-color:rgba(159,176,162,.35) !important; background:rgba(159,176,162,.07) !important; }
.cap-anchor{ display:block; position:relative; top:-96px; visibility:hidden; height:0; }

/* instrument chips (markets) */
.cap-chips-label, .cap-chips-label *{ font-size:11px !important; letter-spacing:.22em; text-transform:uppercase; color:#8f6a00 !important; font-weight:800; margin:6px 0 14px !important; }
.cap-chips{ list-style:none !important; margin:0 !important; padding:0 !important; display:flex; flex-wrap:wrap; gap:10px; }
.cap-chips li{
  margin:0 !important; padding:9px 16px; border-radius:100px; font-size:14px; font-weight:700; color:#f5f5e9 !important;
  background:rgba(199,146,0,.09); border:1px solid rgba(199,146,0,.32); transition:all .25s var(--cap-ease);
}
.cap-chips li:hover{ background:rgba(199,146,0,.2); border-color:#e6ba4f; transform:translateY(-2px); }

/* ---- calculators ---- */
#cap-calc-col{ max-width:880px; margin:0 auto; }
.cap-calc{
  border-radius:22px; padding:6px; border:1px solid rgba(199,146,0,.3);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.7);
}
.cap-calc-tabs{ display:flex; gap:6px; padding:8px; flex-wrap:wrap; }
.cap-calc-tabs button{
  flex:1 1 120px; padding:12px 14px; border-radius:14px; cursor:pointer; font:700 14px 'Inter',sans-serif;
  color:#b6c5bb; background:rgba(255,255,255,.03); border:1px solid transparent; transition:all .25s var(--cap-ease);
}
.cap-calc-tabs button:hover{ color:#fff; border-color:rgba(199,146,0,.35); }
.cap-calc-tabs button.is-active{ color:#1a1203; background:linear-gradient(135deg,#f0cf7a,#c79200); box-shadow:0 10px 24px -10px rgba(199,146,0,.7); }
.cap-calc-body{ padding:20px 22px 22px; display:grid; gap:16px; }
.cap-calc-common{ display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:14px; padding-bottom:18px; border-bottom:1px solid rgba(255,255,255,.06); }
.cap-calc-pane{ display:none; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:14px; align-items:end; }
.cap-calc-pane.is-active{ display:grid; }
.cap-calc label{ display:grid; gap:7px; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:#8fa196; font-weight:700; }
.cap-calc input, .cap-calc select{
  width:100%; padding:13px 14px; border-radius:12px; font:600 15px 'Inter',sans-serif; color:#f5f5e9;
  background:rgba(6,16,11,.7); border:1px solid rgba(255,255,255,.1); outline:none; transition:border-color .2s, box-shadow .2s;
}
.cap-calc input:focus, .cap-calc select:focus{ border-color:#e6ba4f; box-shadow:0 0 0 3px rgba(199,146,0,.2); }
.cap-calc select option{ background:#0a1a14; color:#f5f5e9; }
.cap-calc-out{
  grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding:18px 22px; border-radius:16px; margin-top:4px;
  background:linear-gradient(90deg, rgba(199,146,0,.18), rgba(199,146,0,.04)); border:1px solid rgba(199,146,0,.4);
}
.cap-calc-out span{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#cdbd8a; font-weight:800; }
.cap-calc-out b{ font:800 clamp(24px,4vw,34px) 'Sora',sans-serif; color:#f5f5e9; }
.cap-calc-out b.is-neg{ color:#ff6b7a; } .cap-calc-out b.is-pos{ color:#3ecf7a; }
.cap-calc-note{ grid-column:1/-1; margin:0; font-size:13px; line-height:1.6; color:#8fa196; }
.cap-calc-disclaimer{ margin:4px 0 0; font-size:12px; line-height:1.6; color:#5d7366; }

/* when the sidebar layout is active the hero doesn't need the classic-header clearance */
body.cap-layout-sidebar #cap-hero-sec{ padding-top:96px; }

/* ---- eyebrow pill: style ONLY the heading text element (the wrapper/container used to get the pill too → triple border, full-width bar) ---- */
.elementor-widget.cap-eyebrow, .elementor-widget.cap-eyebrow .elementor-widget-container{
  display:block !important; border:0 !important; background:none !important; padding:0 !important; margin:0 0 24px !important; text-align:center;
}
.elementor-widget.cap-eyebrow .elementor-heading-title{
  display:inline-block !important; padding:8px 18px !important; margin:0 !important;
  border:1px solid rgba(199,146,0,0.35) !important; border-radius:100px !important;
  background:rgba(199,146,0,0.06) !important; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:#e6ba4f !important;
}

/* ---- Home: icons fell back to Elementor's default pale-blue accent (#6EC1E4) → force brand gold,
        and centre the four feature icons above their centred titles (2026-10-20, Ahmed) ---- */
body [id^="cap-feat-"] .elementor-icon-box-wrapper{ align-items:center !important; text-align:center; }
body [id^="cap-feat-"] .elementor-icon-box-icon{ margin-left:auto !important; margin-right:auto !important; }
body [id^="cap-feat-"] .elementor-icon-box-icon,
body [id^="cap-feat-"] .elementor-icon{ color:#e6ba4f !important; }
body [id^="cap-feat-"] .elementor-icon svg,
body [id^="cap-feat-"] .elementor-icon svg path{ fill:#e6ba4f !important; }
body #cap-badge-sec svg, body #cap-badge-sec svg path,
body #cap-platform-copy-col .elementor-icon-list-icon svg,
body #cap-platform-copy-col .elementor-icon-list-icon svg path{ fill:#e6ba4f !important; color:#e6ba4f !important; }

/* ==========================================================================
   Block C (2026-10-20) — Home v2 flagship sections
   ========================================================================== */
/* ---- hero ---- */
#cap-home-hero{
  position:relative; overflow:hidden; display:flex; align-items:center;
  min-height:calc(100vh - 64px); padding:56px 40px 64px;
  background:
    radial-gradient(55% 70% at 80% 42%, rgba(199,146,0,.10), transparent 62%),
    radial-gradient(circle at 50% 0%, var(--cap-navy-2) 0%, var(--cap-navy) 55%, var(--cap-navy-3) 100%);
}
#cap-home-hero > .elementor-container{ max-width:1340px; margin:0 auto; width:100%; align-items:center; position:relative; z-index:2; }
#cap-home-hero .cap-glow-blob:nth-child(2){ top:-220px; left:-120px; }
#cap-home-hero .cap-glow-blob:nth-child(3){ bottom:-260px; right:-160px; width:700px; height:700px; animation-delay:-6s; }
#cap-home-hero .cap-hero-arrow{ position:absolute; top:-6%; right:-8%; width:min(64vw,860px); height:auto; opacity:.11; pointer-events:none; z-index:1; animation:capArrowFloatH 9s ease-in-out infinite; }
@keyframes capArrowFloatH{ 0%,100%{ transform:translate(0,0) rotate(0deg); } 50%{ transform:translate(-14px,14px) rotate(-1.5deg); } }
#cap-hh-copy{ text-align:left; min-width:0; padding-right:20px; }
#cap-hh-mock{ min-width:0; }
#cap-hh-copy .elementor-widget.cap-eyebrow{ text-align:left; }
#cap-hh-copy h1, #cap-hh-copy h1 *{ font-size:clamp(40px,5.2vw,76px); line-height:1.03; font-weight:800; color:var(--cap-white) !important; margin:0 0 16px !important; text-align:left; }
.cap-hero-tagline, .cap-hero-tagline *{ font-size:13px; font-weight:700; letter-spacing:.32em; text-transform:uppercase; color:#e6ba4f !important; margin:0 0 22px !important; }
.cap-hh-sub, .cap-hh-sub p, .cap-hh-sub *{ font-size:clamp(15px,1.45vw,18.5px); line-height:1.75; color:var(--cap-text-muted,#98a2b8) !important; text-align:left; }
.cap-hh-sub p{ max-width:560px; margin:0 0 30px !important; }
#cap-hh-btnrow, #cap-pt-btnrow{ max-width:none; margin:0 !important; }
#cap-hh-btnrow .elementor-container, #cap-pt-btnrow .elementor-container{ gap:14px; flex-wrap:wrap; justify-content:flex-start; }
#cap-hh-btnrow .elementor-column, #cap-pt-btnrow .elementor-column{ width:auto !important; flex:0 0 auto; }
.cap-chips-mini{ list-style:none !important; display:flex; flex-wrap:wrap; gap:10px 22px; margin:28px 0 0 !important; padding:0 !important; }
.cap-chips-mini li{ position:relative; padding-left:22px; margin:0 !important; font-size:13px; font-weight:600; color:#aebfb4 !important; }
.cap-chips-mini li::before{ content:'\2713'; position:absolute; left:0; top:0; color:#e6ba4f; font-weight:800; }
.cap-mock-float-card .val--txt{ font-size:15px; color:#f5f5e9; }
.cap-mock-float-card--b{ left:auto; right:-6px; bottom:auto; top:4px; animation-delay:-2.5s; }

/* ---- marquee ---- */
#cap-marq-sec{ padding:0 !important; background:linear-gradient(180deg,#07150f,#050f0a) !important; border-top:1px solid rgba(199,146,0,.2); border-bottom:1px solid rgba(199,146,0,.2); overflow:hidden; }
.cap-marquee{ overflow:hidden; padding:18px 0; -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
.cap-marquee-track{ display:flex; gap:46px; width:max-content; animation:capMarquee 60s linear infinite; }
.cap-marquee:hover .cap-marquee-track{ animation-play-state:paused; }
.cap-marquee-track span{ position:relative; padding-left:24px; font:700 14px 'Sora',sans-serif; letter-spacing:.14em; color:#8fa196; white-space:nowrap; }
.cap-marquee-track span::before{ content:''; position:absolute; left:0; top:50%; width:6px; height:6px; border-radius:50%; background:#e6ba4f; transform:translateY(-50%); box-shadow:0 0 10px rgba(230,186,79,.7); }
@keyframes capMarquee{ to{ transform:translateX(-50%); } }

/* ---- stats ---- */
#cap-sec-stats{ padding:58px 24px !important; }
#cap-row-stats .elementor-column{ border-right:1px solid rgba(255,255,255,.07); }
#cap-row-stats .elementor-column:last-child{ border-right:0; }
#cap-row-stats .elementor-counter{ text-align:center; }

/* ---- bento ---- */
body #cap-row-bn1 .elementor-container, body #cap-row-bn2 .elementor-container, body #cap-row-mk .elementor-container, body #cap-row-sc .elementor-container{ align-items:stretch; }
#cap-row-bn1, #cap-row-bn2{ margin-bottom:24px; }
[id^="cap-gc-bn-"] > .elementor-widget-wrap, [id^="cap-gc-mt-"] > .elementor-widget-wrap, [id^="cap-gc-sc-"] > .elementor-widget-wrap{ height:100%; align-content:flex-start; }
[id^="cap-gc-bn-"] .cap-card-pad{ padding:30px 26px 10px; }
.cap-bento-img{ padding:0 26px 26px; }
.cap-bento-img img{ width:100%; border-radius:14px; border:1px solid rgba(199,146,0,.28); box-shadow:0 30px 60px -30px #000; display:block; }
/* market tiles */
[id^="cap-gc-mt-"]{ text-align:center; }
[id^="cap-gc-mt-"] .elementor-icon-box-wrapper{ text-align:center !important; align-items:center; }
[id^="cap-gc-mt-"] .elementor-icon-box-icon{ margin-left:auto !important; margin-right:auto !important; }
[id^="cap-gc-mt-"] .cap-card-pad{ padding:30px 14px; }
[id^="cap-gc-mt-"]:hover{ border-color:rgba(230,186,79,.75); box-shadow:0 26px 60px -24px rgba(199,146,0,.35); }
/* steps */
#cap-row-steps{ position:relative; }
#cap-row-steps::before{ content:''; position:absolute; top:74px; left:14%; right:14%; height:1px; z-index:0; background:linear-gradient(90deg,transparent,rgba(199,146,0,.55),transparent); }
[id^="cap-gc-st-"] > .elementor-widget-wrap{ padding:30px 28px 26px !important; }
.cap-step-num, .cap-step-num *{
  font:800 68px/1 'Sora',sans-serif !important; margin:0 0 12px !important;
  background:linear-gradient(135deg,#f5e0a3,#c79200); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent !important;
}
/* analysis library */
.cap-chips--center{ justify-content:center; margin-bottom:34px !important; }
#cap-lib-col{ text-align:center; max-width:880px; margin:0 auto; }
#cap-lib-col .elementor-widget-button .elementor-button-wrapper, #cap-final-cta-col .elementor-widget-button .elementor-button-wrapper{ text-align:center; }
/* partners panel */
#cap-gc-partner{ padding:0; border-radius:26px; border-color:rgba(199,146,0,.45);
  background:radial-gradient(70% 120% at 100% 100%, rgba(199,146,0,.22), transparent 60%), linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.015)); }
#cap-gc-partner > .elementor-widget-wrap{ padding:56px 56px 50px !important; }
#cap-gc-partner h2, #cap-gc-partner h2 *{ font-size:clamp(28px,3.4vw,44px); color:var(--cap-white) !important; margin:0 0 16px !important; font-weight:800; text-align:left; }
#cap-gc-partner p, #cap-gc-partner p *{ color:var(--cap-text-muted,#98a2b8) !important; font-size:16px; line-height:1.75; max-width:640px; margin:0 0 30px !important; text-align:left; }
#cap-gc-partner:hover{ transform:none; }
#cap-sec-plat, #cap-sec-part{ padding:90px 24px; }

@media (max-width:1000px){
  #cap-home-hero{ min-height:auto; padding:44px 20px 56px; }
  #cap-hh-copy, #cap-hh-copy h1, #cap-hh-copy h1 *, .cap-hh-sub, .cap-hh-sub *{ text-align:center !important; }
  #cap-hh-copy .elementor-widget.cap-eyebrow{ text-align:center; }
  .cap-hh-sub p{ margin-left:auto !important; margin-right:auto !important; }
  #cap-hh-btnrow .elementor-container{ justify-content:center; }
  .cap-chips-mini{ justify-content:center; }
  #cap-gc-partner > .elementor-widget-wrap{ padding:40px 26px 36px !important; }
}
@media (max-width:767px){
  #cap-row-stats .elementor-column{ width:50% !important; border-right:0; margin-bottom:22px; }
  #cap-row-mk .elementor-column, #cap-row-sc .elementor-column{ width:50% !important; }
  #cap-row-steps::before{ display:none; }
}

/* ---- Home v2 polish (2026-10-20) ---- */
[id^="cap-stat-"] .elementor-counter-title, [id^="cap-stat-"] .elementor-counter-title *{ font-family:'Inter',sans-serif !important; letter-spacing:.14em; font-weight:600; line-height:1.4 !important; }
[id^="cap-gc-bn-"] .elementor-icon-box-wrapper{ align-items:flex-start !important; text-align:left !important; }
[id^="cap-gc-bn-"] .elementor-icon-box-content, [id^="cap-gc-bn-"] .elementor-icon-box-content *{ text-align:left !important; }
[id^="cap-gc-sc-"] .elementor-icon-box-wrapper{ align-items:center !important; text-align:center !important; }
[id^="cap-gc-sc-"] .elementor-icon-box-icon{ margin:0 auto 20px !important; }
[id^="cap-gc-sc-"] .elementor-icon-box-content, [id^="cap-gc-sc-"] .elementor-icon-box-content *{ text-align:center !important; }
@media (max-width:1000px){
  #cap-hh-copy .cap-hero-tagline, #cap-hh-copy .cap-hero-tagline *{ text-align:center !important; letter-spacing:.24em; }
  #cap-hh-copy .elementor-widget{ margin-bottom:0; }
}

/* ==========================================================================
   Home hero v5 "lux" (2026-10-20): no platform screenshot. Right side = a gold orbit emblem (rings + rising candles + arrow) with four
   glass stat tiles floating around it. Markup lives in builders/hero-lux-markup.php (patched into Home by builders/patch-home-hero-lux.php).
   Revert = delete this block (+ run build-home-v2.php to restore the old mockup markup).
   ========================================================================== */
#cap-home-hero{ background:
  radial-gradient(60% 75% at 78% 45%, rgba(199,146,0,.17), transparent 64%),
  radial-gradient(40% 50% at 12% 100%, rgba(199,146,0,.07), transparent 70%),
  radial-gradient(circle at 50% 0%, var(--cap-navy-2) 0%, var(--cap-navy) 55%, var(--cap-navy-3) 100%); }
.cap-lux{ position:relative; width:100%; max-width:600px; aspect-ratio:1/1; margin:0 auto; }
.cap-lux-rings{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.cap-lux-orbit{ transform-origin:260px 260px; animation:capLuxSpin 70s linear infinite; }
.cap-lux-orbit.rev{ animation-duration:110s; animation-direction:reverse; }
@keyframes capLuxSpin{ to{ transform:rotate(360deg); } }
.cap-lux-core{
  position:absolute; left:50%; top:50%; width:44%; aspect-ratio:1/1; transform:translate(-50%,-50%); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 35% 28%, rgba(245,224,163,.22), rgba(199,146,0,.08) 45%, rgba(8,14,11,.92) 78%);
  border:1.5px solid rgba(233,196,106,.6);
  box-shadow:0 0 0 14px rgba(199,146,0,.05), 0 0 0 15px rgba(233,196,106,.16), 0 40px 90px -20px rgba(0,0,0,.8), 0 0 120px -10px rgba(199,146,0,.45), inset 0 1px 0 rgba(255,255,255,.15);
}
.cap-lux-core svg{ width:78%; height:auto; filter:drop-shadow(0 10px 22px rgba(199,146,0,.35)); }
.cap-lux-tile{
  position:absolute; z-index:3; display:flex; flex-direction:column; gap:3px; padding:15px 22px; border-radius:16px; min-width:150px;
  background:linear-gradient(165deg, rgba(24,42,33,.72), rgba(8,16,12,.72)); backdrop-filter:blur(14px);
  border:1px solid rgba(233,196,106,.38); box-shadow:0 26px 50px -20px rgba(0,0,0,.75), inset 0 1px 0 rgba(255,255,255,.09);
  animation:capFloatCard 6s ease-in-out infinite;
}
.cap-lux-tile .k{ font-size:10.5px; text-transform:uppercase; letter-spacing:.14em; color:#9fb0a2; font-weight:600; }
.cap-lux-tile .v{ font-family:'Sora',sans-serif; font-size:26px; font-weight:800; color:#f5e7bd; line-height:1.1; }
.cap-lux-tile .v i{ font-style:normal; font-size:13px; font-weight:700; color:#e6ba4f; margin-left:4px; letter-spacing:.04em; }
.cap-lux-tile.t1{ left:0; top:9%; }
.cap-lux-tile.t2{ right:-2%; top:21%; animation-delay:-1.5s; }
.cap-lux-tile.t3{ left:-3%; bottom:18%; animation-delay:-3s; }
.cap-lux-tile.t4{ right:3%; bottom:7%; animation-delay:-4.5s; }
#cap-hh-mock{ display:flex; align-items:center; }
@media (max-width:1000px){
  .cap-lux{ max-width:440px; margin-top:34px; }
  .cap-lux-tile{ padding:11px 16px; min-width:0; }
  .cap-lux-tile .v{ font-size:20px; }
  .cap-lux-tile.t1{ left:-2%; } .cap-lux-tile.t2{ right:-2%; } .cap-lux-tile.t3{ left:-2%; } .cap-lux-tile.t4{ right:0; }
}
@media (prefers-reduced-motion:reduce){ .cap-lux-orbit, .cap-lux-tile{ animation:none; } }

/* ==========================================================================
   Block D (2026-10-20, Ahmed): HOME = ONE SCREEN — hero + slim footer, nothing to scroll.
   Everything else is reached from the sidebar menu. Desktop only; phones/tablets scroll normally.
   ========================================================================== */
.cap-footer-links{ display:none; }
body.cap-onescreen #cap-home-hero{
  height:calc(100vh - var(--cap-top-h,64px) - var(--cap-adminbar,0px) - 56px);
  height:calc(100dvh - var(--cap-top-h,64px) - var(--cap-adminbar,0px) - 56px);
  min-height:0; padding:14px 40px;
}
body.cap-onescreen #cap-hh-copy h1, body.cap-onescreen #cap-hh-copy h1 *{ font-size:clamp(34px, min(4.3vw, 8.2vh), 68px); line-height:1.04; margin:0 0 min(14px,1.6vh) !important; }
body.cap-onescreen #cap-hh-copy .elementor-widget.cap-eyebrow{ margin-bottom:min(18px,2.4vh) !important; }
body.cap-onescreen .cap-hero-tagline, body.cap-onescreen .cap-hero-tagline *{ margin:0 0 min(18px,2.2vh) !important; font-size:min(13px,1.7vh); }
body.cap-onescreen .cap-hh-sub p{ font-size:clamp(14px, min(1.2vw,2.35vh), 17.5px); line-height:1.65; margin:0 0 min(26px,3.2vh) !important; }
body.cap-onescreen .cap-chips-mini{ margin-top:min(24px,3vh) !important; }
body.cap-onescreen .cap-lux{ max-width:min(600px, calc(100vh - var(--cap-top-h,64px) - var(--cap-adminbar,0px) - 56px - 56px)); }
body.cap-onescreen .cap-footer{ height:56px; box-sizing:border-box; padding:0 30px; display:flex; align-items:center; border-top:1px solid rgba(199,146,0,.18); }
body.cap-onescreen .cap-footer-inner{ width:100%; max-width:none; }
body.cap-onescreen .cap-footer-top{ display:none; }
body.cap-onescreen .cap-footer-bottom{ padding:0; border:0; display:flex; flex-wrap:nowrap; align-items:center; justify-content:space-between; gap:22px; font-size:12px; }
body.cap-onescreen .cap-footer-bottom p{ margin:0; white-space:nowrap; }
body.cap-onescreen .cap-footer-links{ display:flex; gap:20px; }
body.cap-onescreen .cap-footer-links a{ color:#8fa196; text-decoration:none; font-size:12px; transition:color .2s; }
body.cap-onescreen .cap-footer-links a:hover{ color:#e6ba4f; }
body.cap-onescreen .cap-footer-risk{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; text-align:right; font-size:11px; color:#5d7366; }
@media (max-width:1000px){
  body.cap-onescreen #cap-home-hero{ height:auto; min-height:calc(100vh - var(--cap-top-h,64px) - 56px); padding:36px 20px 48px; }
  body.cap-onescreen .cap-lux{ max-width:440px; }
  body.cap-onescreen .cap-footer{ height:auto; padding:18px 20px; }
  body.cap-onescreen .cap-footer-bottom{ flex-wrap:wrap; justify-content:center; text-align:center; }
  body.cap-onescreen .cap-footer-bottom p{ white-space:normal; }
  body.cap-onescreen .cap-footer-risk{ text-align:center; }
}