/* ═══ LUNOMOTION — SHARED SITE STYLES ═══════════════════════════════════════
   Used by: index.html, agents.html, faq.html, about.html,
            process.html, results.html, resources.html
   ─────────────────────────────────────────────────────────────────────────── */

/* ─── TOKENS ─────────────────────────────────────────────────────────────── */
:root {
  --navy:       #0d1e35;
  --navy-deep:  #07111e;
  --navy-mid:   #14263d;
  --navy-light: #1f3657;
  --gold:       #C49A2A;
  --gold-2:     #d4a832;
  --gold-3:     #b8881e;
  --gold-light: #E9D8A9;
  --gold-pale:  #f8f0dc;
  --cream:      #FAF8F3;
  --cream-2:    #F3EFE6;
  --cream-3:    #EDE8DE;
  --ink:        #1C2733;
  --ink-soft:   #3A4E5A;
  --border:     #DDD5C4;
  --border-2:   #E6E0D4;
  --sand:       #E8E3DA;
  --green:      #15593a;
  --green-2:    #166534;
  --green-bg:   #edfaf3;
  --red:        #a31515;
  --red-bg:     #fef4f4;
  --white:      #ffffff;
}

/* ─── RESET ──────────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'DM Sans',system-ui,sans-serif;
  background:var(--sand);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}

/* ─── LAYOUT ─────────────────────────────────────────────────────────────── */
.wrap    {max-width:1120px;margin:0 auto;padding:0 40px}
.wrap-md {max-width:920px; margin:0 auto;padding:0 40px}
.wrap-sm {max-width:700px; margin:0 auto;padding:0 40px}

/* ─── SCROLL REVEAL ──────────────────────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .55s ease,transform .55s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-22px);transition:opacity .55s ease,transform .55s ease}
.reveal-left.visible{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(22px);transition:opacity .55s ease,transform .55s ease}
.reveal-right.visible{opacity:1;transform:translateX(0)}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}.d4{transition-delay:.32s}

/* ─── NAV ────────────────────────────────────────────────────────────────── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(7,17,30,.9);
  backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid rgba(255,255,255,.06);
  transition:background .3s;
}
.nav.scrolled{background:rgba(7,17,30,.97)}
.nav-inner{
  max-width:1120px;margin:0 auto;padding:0 40px;
  height:64px;display:flex;align-items:center;justify-content:space-between;
}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.nav-logo img{height:28px;width:auto;display:block}
.nav-logo-text{font-size:17px;font-weight:800;color:#fff;letter-spacing:-0.04em;white-space:nowrap}
.nav-links{display:flex;align-items:center;gap:30px;list-style:none}
.nav-links a{
  font-size:14px;font-weight:600;color:rgba(255,255,255,.5);
  letter-spacing:.01em;transition:color .15s;
}
.nav-links a:hover,.nav-links a.active{color:#fff}
.nav-cta{
  background:var(--gold);color:var(--navy)!important;
  padding:9px 20px;border-radius:7px;
  font-weight:700!important;font-size:13px!important;
  transition:background .15s,transform .1s;
}
.nav-cta:hover{background:var(--gold-2)!important;transform:translateY(-1px)}

/* ─── HAMBURGER / MOBILE DRAWER ──────────────────────────────────────────── */
.nav-burger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  background:none;border:none;cursor:pointer;padding:10px 4px;z-index:101;
  flex-shrink:0;
}
.nav-burger span{
  display:block;width:22px;height:2px;
  background:#fff;border-radius:2px;
  transition:transform .22s,opacity .22s;
}
.nav.open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.open .nav-burger span:nth-child(2){opacity:0;transform:scaleX(0)}
.nav.open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:768px){
  .nav-burger{display:flex}
  .nav.open{background:rgba(7,17,30,.99)}
  .nav.open .nav-links{
    display:flex!important;flex-direction:column;gap:0;
    position:absolute;top:64px;left:0;right:0;
    background:rgba(7,17,30,.99);
    padding:8px 0 24px;
    border-bottom:1px solid rgba(255,255,255,.08);
    z-index:100;list-style:none;
  }
  .nav.open .nav-links li{border-bottom:1px solid rgba(255,255,255,.05)}
  .nav.open .nav-links a{
    display:block;padding:14px 28px;
    font-size:15px;font-weight:600;color:rgba(255,255,255,.7);
  }
  .nav.open .nav-links a:hover{color:#fff;background:rgba(255,255,255,.04)}
  .nav.open .nav-links .nav-cta,.nav.open .nav-links .nav-btn{
    display:block;margin:16px 24px 0;text-align:center;
    padding:13px 20px;border-radius:8px;
  }
}

/* ─── HERO SHARED ────────────────────────────────────────────────────────── */
.page-hero{
  background:var(--navy);
  padding:128px 0 80px;
  position:relative;overflow:hidden;
}
.page-hero::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 90% 60% at 50% -5%,rgba(196,154,42,.14) 0%,transparent 55%),
    radial-gradient(ellipse 50% 60% at 90% 85%,rgba(196,154,42,.04) 0%,transparent 50%);
}
.hero-grid-bg{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:52px 52px;
}
.hero-rule{
  position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent 0%,var(--gold) 35%,var(--gold) 65%,transparent 100%);
}
.hero-content{position:relative;z-index:2;text-align:center}
.page-hero-kicker{
  display:inline-flex;align-items:center;gap:9px;
  background:rgba(196,154,42,.1);border:1px solid rgba(196,154,42,.22);
  border-radius:100px;padding:6px 16px 7px;
  font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--gold-light);margin-bottom:28px;
}
.page-hero-kicker::before{
  content:'';width:6px;height:6px;border-radius:50%;
  background:var(--gold);flex-shrink:0;
  animation:pulse 2.4s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

.page-hero h1{
  font-size:clamp(40px,5vw,62px);
  font-weight:800;line-height:1.05;letter-spacing:-0.04em;
  color:#fff;max-width:1040px;margin:0 auto 22px;
}
.page-hero h1 em{
  font-style:italic;font-family:'Lora',Georgia,serif;
  font-weight:400;color:var(--gold-light);letter-spacing:-0.025em;
}
.page-hero-sub{
  font-size:18px;font-weight:400;line-height:1.68;
  color:rgba(255,255,255,.55);max-width:580px;margin:0 auto 40px;
}

/* ─── BUTTONS ────────────────────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-size:14px;font-weight:700;padding:13px 24px;border-radius:8px;
  transition:all .15s;cursor:pointer;white-space:nowrap;letter-spacing:.01em;
  font-family:inherit;border:none;
}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-gold:hover{background:var(--gold-2);transform:translateY(-1px);box-shadow:0 6px 24px rgba(196,154,42,.28)}
.btn-ghost{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.28);color:rgba(255,255,255,.85)}
.btn-ghost:hover{background:rgba(255,255,255,.1)}
.btn-outline{background:transparent;border:1.5px solid var(--border);color:var(--ink)}
.btn-outline:hover{border-color:var(--gold);color:var(--gold)}
.btn-sm{font-size:13px;padding:9px 18px}
.btn-lg{font-size:15px;padding:16px 30px}

/* ─── TYPOGRAPHY ─────────────────────────────────────────────────────────── */
.eyebrow{
  font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--gold);margin-bottom:14px;display:block;
}
.eyebrow-dark{
  font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:rgba(196,154,42,.75);margin-bottom:14px;display:block;
}
.eyebrow-muted{
  font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-soft);opacity:.5;margin-bottom:14px;display:block;
}
h2.st{
  font-size:clamp(28px,3.8vw,46px);
  font-weight:800;letter-spacing:-0.04em;color:var(--navy);line-height:1.1;margin-bottom:16px;
}
h2.st em{font-style:italic;font-family:'Lora',Georgia,serif;font-weight:400}
h2.st-light{color:#fff}
h3.sh{font-size:20px;font-weight:800;letter-spacing:-0.03em;color:var(--navy);margin-bottom:8px}
h3.sh-light{color:#fff}
.body-lg{font-size:16.5px;font-weight:400;line-height:1.68;color:var(--ink-soft);max-width:560px;margin:0 auto}
.body-lg-light{color:rgba(255,255,255,.5)}
.sec-hd{margin-bottom:52px;text-align:center}
.sec-hd-center{margin-bottom:52px;text-align:center}
.sec-hd-center .body-lg{margin:0 auto}

/* ─── SECTION BACKGROUNDS ────────────────────────────────────────────────── */
.bg-sand  {background:var(--sand)}
.bg-cream {background:var(--cream)}
.bg-cream2{background:var(--cream-2)}
.bg-navy  {background:var(--navy)}
.bg-white {background:#fff}
section{padding:88px 0}
section.tight{padding:60px 0}
section.loose{padding:112px 0}

/* ─── DIVIDER ────────────────────────────────────────────────────────────── */
.rule-gold{height:1px;background:linear-gradient(90deg,transparent,rgba(196,154,42,.3),transparent)}
.rule-light{height:1px;background:var(--border)}

/* ─── CARDS ──────────────────────────────────────────────────────────────── */
.card{background:var(--cream);border:1px solid var(--border);border-radius:12px;padding:28px;transition:box-shadow .2s,transform .2s}
.card:hover{box-shadow:0 4px 20px rgba(0,0,0,.08);transform:translateY(-2px)}
.card-navy{background:var(--navy);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:28px}
.card-highlight{background:var(--cream);border:2px solid var(--gold);border-radius:12px;padding:28px;position:relative}

/* ─── GRIDS ──────────────────────────────────────────────────────────────── */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.tile-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--border);border:1px solid var(--border);border-radius:14px;overflow:hidden}
.tile-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--border);border:1px solid var(--border);border-radius:14px;overflow:hidden}
.tile{background:var(--cream);padding:30px 32px;transition:background .12s}
.tile:hover{background:var(--cream-2)}
.tile-white{background:#fff}

/* ─── ICON BOX ───────────────────────────────────────────────────────────── */
.icon-box{
  width:38px;height:38px;background:var(--navy);border-radius:9px;
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;flex-shrink:0;
}
.icon-box svg{width:18px;height:18px;stroke:var(--gold);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.icon-box-lg{width:52px;height:52px;border-radius:12px}
.icon-box-lg svg{width:24px;height:24px}
.icon-box-gold{background:rgba(196,154,42,.1);border:1px solid rgba(196,154,42,.25)}
.icon-box-gold svg{stroke:var(--gold)}

/* ─── BADGE ──────────────────────────────────────────────────────────────── */
.badge{display:inline-flex;align-items:center;gap:5px;border-radius:100px;padding:4px 12px;font-size:11px;font-weight:700}
.badge-gold{background:var(--gold-pale);border:1px solid rgba(196,154,42,.25);color:var(--gold-3)}
.badge-green{background:var(--green-bg);border:1px solid rgba(21,89,58,.2);color:var(--green)}
.badge-navy{background:rgba(13,30,53,.08);border:1px solid rgba(13,30,53,.12);color:var(--navy)}
.badge-dark{background:rgba(196,154,42,.1);border:1px solid rgba(196,154,42,.2);color:var(--gold-light)}
.badge::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}

/* ─── STATS BAND ─────────────────────────────────────────────────────────── */
.stats-band{background:var(--cream);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.stat-item{padding:34px 28px;border-right:1px solid var(--border);text-align:center}
.stat-item:last-child{border-right:none}
.stat-num{font-size:44px;font-weight:800;letter-spacing:-0.05em;color:var(--navy);line-height:1;margin-bottom:8px}
.stat-num em{font-style:italic;font-family:'Lora',Georgia,serif;font-weight:400;color:var(--gold)}
.stat-lbl{font-size:12.5px;font-weight:700;color:var(--ink)}
.stat-dtl{font-size:11px;color:var(--ink-soft);opacity:.65;margin-top:3px}
/* stats inside dark hero (results page) */
.page-hero .stats-grid{border-top:1px solid rgba(255,255,255,.12);margin-top:52px;padding-top:0}
.page-hero .stat-item{border-right-color:rgba(255,255,255,.12)}
.page-hero .stat-num{color:#fff}
.page-hero .stat-lbl{color:rgba(255,255,255,.85)}
.page-hero .stat-dtl{color:rgba(255,255,255,.45);opacity:1}

/* ─── BEFORE/AFTER TABLE ─────────────────────────────────────────────────── */
.ba-table{background:var(--cream);border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.05)}
.ba-head{display:grid;grid-template-columns:1.7fr 190px 190px 110px;background:var(--navy);padding:14px 32px;gap:12px}
.ba-hcol{font-size:9.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.28)}
.ba-hcol.after-col{color:rgba(233,216,169,.6)}
.ba-row{display:grid;grid-template-columns:1.7fr 190px 190px 110px;padding:22px 32px;gap:12px;border-bottom:1px solid var(--border);align-items:center;transition:background .12s}
.ba-row:last-child{border-bottom:none}
.ba-row:hover{background:var(--cream-2)}
.ba-wf-name{font-size:16px;font-weight:800;color:var(--ink);letter-spacing:-0.02em;margin-bottom:3px}
.ba-wf-detail{font-size:12px;color:var(--ink-soft);opacity:.7}
.ba-before{font-size:17px;font-weight:600;color:var(--red);text-decoration:line-through;text-decoration-color:rgba(163,21,21,.3);text-underline-offset:3px}
.ba-after{display:inline-flex;align-items:center;gap:8px;font-size:17px;font-weight:800;color:var(--green-2)}
.ba-after::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.ba-saving{font-size:13px;font-weight:700;color:var(--gold);text-align:right}

/* ─── COMPARISON TABLE ───────────────────────────────────────────────────── */
.comp-table{background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.05)}
.comp-head{display:grid;grid-template-columns:2fr 1fr 1fr 1.15fr;background:var(--navy);padding:16px 32px;gap:12px;align-items:end}
.comp-hcol{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.3);text-align:center}
.comp-hcol.us{color:var(--gold-light);font-size:12px}
.comp-hcol.cap-col{text-align:left}
.comp-row{display:grid;grid-template-columns:2fr 1fr 1fr 1.15fr;padding:15px 32px;gap:12px;border-bottom:1px solid var(--border-2);align-items:center}
.comp-row:last-child{border-bottom:none}
.comp-row:hover{background:var(--cream)}
.comp-cap{font-size:13.5px;font-weight:600;color:var(--ink)}
.comp-cell{text-align:center;font-size:13px;font-weight:600;color:var(--ink-soft);opacity:.5}
.comp-cell.yes{color:var(--green-2);opacity:1;font-weight:700}
.comp-cell.no{color:var(--red);opacity:1}
.comp-cell.us-col{background:rgba(196,154,42,.05);border-left:2px solid rgba(196,154,42,.2);color:var(--green-2);opacity:1;font-weight:800}

/* ─── TESTIMONIALS ───────────────────────────────────────────────────────── */
.testi-card{background:var(--cream);border:1px solid var(--border);border-radius:12px;padding:30px;box-shadow:0 1px 6px rgba(0,0,0,.05);transition:box-shadow .2s,transform .2s}
.testi-card:hover{box-shadow:0 4px 20px rgba(0,0,0,.09);transform:translateY(-2px)}
.stars{display:flex;gap:4px;margin-bottom:18px}
.star{width:13px;height:13px;fill:var(--gold)}
.testi-quote{font-size:14px;line-height:1.72;color:var(--ink-soft);margin-bottom:24px}
.testi-author{display:flex;align-items:center;gap:13px;padding-top:18px;border-top:1px solid var(--border)}
.testi-photo{width:42px;height:42px;border-radius:50%;object-fit:cover;flex-shrink:0}
.testi-name{font-size:13.5px;font-weight:800;color:var(--navy)}
.testi-title{font-size:11.5px;color:var(--ink-soft);margin-top:2px}

/* ─── PULL QUOTE ─────────────────────────────────────────────────────────── */
.pull-quote{
  border-left:3px solid var(--gold);
  padding:20px 28px;
  background:var(--gold-pale);
  border-radius:0 8px 8px 0;
}
.pull-quote p{font-size:17px;font-weight:600;color:var(--navy);line-height:1.6;font-style:italic;font-family:'Lora',Georgia,serif}
.pull-quote cite{display:block;margin-top:10px;font-size:12px;font-weight:700;color:var(--ink-soft);font-style:normal;letter-spacing:.05em}

/* ─── CALLOUT BOX ────────────────────────────────────────────────────────── */
.callout{border-radius:10px;padding:22px 26px}
.callout-gold{background:var(--gold-pale);border:1px solid rgba(196,154,42,.25)}
.callout-navy{background:rgba(13,30,53,.05);border:1px solid rgba(13,30,53,.1)}
.callout-green{background:var(--green-bg);border:1px solid rgba(21,89,58,.2)}
.callout-title{font-size:13.5px;font-weight:800;color:var(--navy);margin-bottom:6px}
.callout-body{font-size:13px;line-height:1.65;color:var(--ink-soft)}

/* ─── NUMBER LIST ────────────────────────────────────────────────────────── */
.n-list{list-style:none;display:flex;flex-direction:column;gap:20px}
.n-list li{display:flex;gap:18px;align-items:flex-start}
.n-list-num{
  font-size:12px;font-weight:800;color:var(--gold);
  background:var(--gold-pale);border:1px solid rgba(196,154,42,.25);
  width:26px;height:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;margin-top:1px;letter-spacing:0;
}
.n-list-content{}
.n-list-title{font-size:14.5px;font-weight:800;color:var(--navy);margin-bottom:4px;letter-spacing:-0.02em}
.n-list-body{font-size:13px;color:var(--ink-soft);line-height:1.6}

/* ─── CHECK LIST ─────────────────────────────────────────────────────────── */
.check-list{list-style:none;display:flex;flex-direction:column;gap:9px}
.check-list li{display:flex;gap:10px;align-items:baseline;font-size:13.5px;color:var(--ink-soft);line-height:1.5}
.check-list li::before{content:'✓';color:var(--green-2);font-weight:800;font-size:12px;flex-shrink:0}
.check-list-dark li{color:rgba(255,255,255,.55)}
.check-list-dark li::before{color:var(--gold-light)}

/* ─── FEATURE PAIR (icon + text) ─────────────────────────────────────────── */
.feature-pair{display:flex;gap:16px;align-items:flex-start}
.feature-pair-body{}
.fp-title{font-size:15px;font-weight:800;color:var(--navy);margin-bottom:5px;letter-spacing:-0.02em}
.fp-body{font-size:13px;color:var(--ink-soft);line-height:1.6}

/* ─── CTA SECTION ────────────────────────────────────────────────────────── */
.cta-dark{
  background:var(--navy);
  padding:96px 0;text-align:center;
  position:relative;overflow:hidden;
}
.cta-dark::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 80% 70% at 50% 50%,rgba(196,154,42,.12) 0%,transparent 55%);
}
.cta-dark .inner{position:relative;z-index:1}
.cta-dark h2{font-size:clamp(34px,4.5vw,58px);font-weight:800;letter-spacing:-0.045em;color:#fff;line-height:1.02;margin-bottom:18px}
.cta-dark h2 em{font-style:italic;font-family:'Lora',Georgia,serif;font-weight:400;color:var(--gold-light)}
.cta-dark p{font-size:17px;color:rgba(255,255,255,.45);line-height:1.65;margin-bottom:36px}
.cta-actions{display:flex;align-items:center;justify-content:center;gap:13px;flex-wrap:wrap}
.cta-note{margin-top:20px;font-size:11.5px;color:rgba(255,255,255,.2);letter-spacing:.02em}

/* ─── GUARANTEE BAND ─────────────────────────────────────────────────────── */
.guarantee-band{
  background:var(--navy);padding:64px 0;
  position:relative;overflow:hidden;
}
.guarantee-band::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 80% at 50% 50%,rgba(196,154,42,.09) 0%,transparent 60%)}
.guarantee-inner{max-width:860px;margin:0 auto;padding:0 40px;display:grid;grid-template-columns:auto 1fr;gap:44px;align-items:center;position:relative;z-index:1}
.guarantee-icon{width:76px;height:76px;background:rgba(196,154,42,.1);border:1px solid rgba(196,154,42,.25);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.guarantee-icon svg{width:34px;height:34px;stroke:var(--gold);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.guarantee-title{font-size:26px;font-weight:800;color:#fff;letter-spacing:-0.035em;margin-bottom:10px}
.guarantee-title em{font-style:italic;font-family:'Lora',Georgia,serif;font-weight:400;color:var(--gold-light)}
.guarantee-body{font-size:15px;line-height:1.65;color:rgba(255,255,255,.48)}
.guarantee-body strong{color:rgba(255,255,255,.8);font-weight:700}

/* ─── INTEGRATIONS SCROLL ────────────────────────────────────────────────── */
.int-strip{background:var(--cream);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:24px 0;overflow:hidden}
.int-track{display:flex;align-items:center;gap:52px;animation:scroll-l 28s linear infinite;width:max-content}
@keyframes scroll-l{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.int-item{font-size:15px;font-weight:800;color:var(--ink);opacity:.28;letter-spacing:-0.02em;white-space:nowrap;transition:opacity .2s}
.int-item:hover{opacity:.55}
.int-sep{width:4px;height:4px;border-radius:50%;background:var(--border);flex-shrink:0}
.int-label{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);opacity:.5;text-align:center;margin-bottom:16px}

/* ─── OUTPUT PREVIEW CARD ────────────────────────────────────────────────── */
.output-card{background:#0b1928;border:1px solid rgba(255,255,255,.08);border-radius:12px;overflow:hidden}
.output-topbar{background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.07);padding:10px 18px;display:flex;align-items:center;gap:9px}
.output-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);animation:pulse 2.4s ease-in-out infinite}
.output-label{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.28);font-family:monospace}
.output-body{padding:18px}
.output-field{margin-bottom:12px}
.output-field-label{font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.25);font-family:monospace;margin-bottom:4px}
.output-field-value{font-size:13.5px;font-weight:700;color:#fff}
.output-field-sub{font-size:11px;color:rgba(255,255,255,.35);margin-top:2px}
.output-metric{font-size:26px;font-weight:800;color:var(--gold);letter-spacing:-0.04em;line-height:1}
.output-status-advance{background:rgba(21,89,58,.25);border:1px solid rgba(21,89,58,.45);border-radius:7px;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;margin-top:4px}
.output-status-text{font-size:12.5px;font-weight:800;color:#4ade80}
.output-status-sub{font-size:10px;color:rgba(255,255,255,.2);font-family:monospace;letter-spacing:.08em;text-transform:uppercase}

/* ─── FOOTER ─────────────────────────────────────────────────────────────── */
footer{background:var(--navy-deep);border-top:1px solid rgba(255,255,255,.05);padding:40px 0}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px;margin-bottom:36px;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.06)}
.footer-brand-name{font-size:16px;font-weight:800;color:rgba(255,255,255,.4);letter-spacing:-0.03em;margin-bottom:10px}
.footer-brand-name em{font-style:normal;color:rgba(196,154,42,.5)}
.footer-brand-desc{font-size:12px;color:rgba(255,255,255,.18);line-height:1.65}
.footer-col-title{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.25);margin-bottom:14px}
.footer-links-list{list-style:none;display:flex;flex-direction:column;gap:9px}
.footer-links-list a{font-size:12.5px;font-weight:500;color:rgba(255,255,255,.3);transition:color .15s}
.footer-links-list a:hover{color:rgba(255,255,255,.65)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between}
.footer-copy{font-size:11px;color:rgba(255,255,255,.15)}
.footer-copy-links{display:flex;gap:20px}
.footer-copy-links a{font-size:11px;color:rgba(255,255,255,.15);transition:color .15s}
.footer-copy-links a:hover{color:rgba(255,255,255,.4)}