/*
 * Yitron Solutions — Theme CSS
 * Bootstrap Studio: all styles live here. Never embed inline.
 *
 * BRAND TOKENS
 *  --forest       #0d1a10    Page background
 *  --forest-soft  #163829    Cards / alt sections
 *  --forest-mid   #1B4332    Pantone 627 C — Deep bottle green
 *  --copper       #B87333    Pantone 723 C — Copper Amber (accent)
 *  --copper-dim   #956030    Accent hover
 *  --agate        #B9AFA0    Pantone 7535 C — body text
 *  --platinum     #D9D9D6    Pantone Cool Gray 1 C — headings
 *
 * FONTS
 *  KoHo (headings/labels) + Ubuntu (body) via Google Fonts CDN.
 *  To self-host: drop TTF files in public/assets/fonts/KoHo/ and
 *  public/assets/fonts/Ubuntu/, uncomment @font-face blocks below,
 *  remove Google Fonts <link> tags from all HTML pages.
 */

/*
@font-face { font-family:'KoHo';   src:url('../fonts/KoHo/KoHo-Light.ttf')        format('truetype'); font-weight:300; font-style:normal;  font-display:swap; }
@font-face { font-family:'KoHo';   src:url('../fonts/KoHo/KoHo-LightItalic.ttf')  format('truetype'); font-weight:300; font-style:italic;  font-display:swap; }
@font-face { font-family:'KoHo';   src:url('../fonts/KoHo/KoHo-Regular.ttf')      format('truetype'); font-weight:400; font-style:normal;  font-display:swap; }
@font-face { font-family:'KoHo';   src:url('../fonts/KoHo/KoHo-Medium.ttf')       format('truetype'); font-weight:500; font-style:normal;  font-display:swap; }
@font-face { font-family:'KoHo';   src:url('../fonts/KoHo/KoHo-SemiBold.ttf')     format('truetype'); font-weight:600; font-style:normal;  font-display:swap; }
@font-face { font-family:'Ubuntu'; src:url('../fonts/Ubuntu/Ubuntu-Light.ttf')     format('truetype'); font-weight:300; font-style:normal;  font-display:swap; }
@font-face { font-family:'Ubuntu'; src:url('../fonts/Ubuntu/Ubuntu-LightItalic.ttf') format('truetype'); font-weight:300; font-style:italic; font-display:swap; }
@font-face { font-family:'Ubuntu'; src:url('../fonts/Ubuntu/Ubuntu-Regular.ttf')   format('truetype'); font-weight:400; font-style:normal;  font-display:swap; }
@font-face { font-family:'Ubuntu'; src:url('../fonts/Ubuntu/Ubuntu-Medium.ttf')    format('truetype'); font-weight:500; font-style:normal;  font-display:swap; }
*/

:root {
  --forest:      #0d1a10;
  --forest-soft: #163829;
  --forest-mid:  #1B4332;
  --agate:       #B9AFA0;
  --platinum:    #D9D9D6;
  --white:       #ffffff;
  --copper:      #B87333;
  --copper-dim:  #956030;
  --rule:        rgba(184,115,51,0.22);
  --f-heading:   'KoHo', sans-serif;
  --f-body:      'Ubuntu', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  background-color: var(--forest);
  color: var(--agate);
  font-family: var(--f-body);
  font-weight: 300;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

/* Bootstrap overrides */
.bg-dark    { background-color: var(--forest)      !important; }
.bg-darker  { background-color: var(--forest-soft) !important; }
.text-muted { color: var(--agate)                  !important; }

/* Typography */
h1,h2,h3,h4,h5,h6 { font-family:var(--f-heading); color:var(--platinum); line-height:1.15; letter-spacing:-0.01em; }
h1 { font-size:clamp(2.8rem,5.5vw,5rem); font-weight:200; }
h2 { font-size:clamp(2rem,3.8vw,3.2rem); font-weight:300; }
h3 { font-size:1.55rem; font-weight:400; }
h4 { font-size:1rem;    font-weight:500; }
h1 em, h2 em { font-style:italic; color:var(--copper); }
p  { color:var(--agate); font-size:0.975rem; line-height:1.85; }
a  { color:var(--copper); text-decoration:none; transition:color 0.2s; }
a:hover { color:var(--copper-dim); }

/* Utilities */
.label {
  font-family:var(--f-heading); font-size:0.7rem; letter-spacing:0.2em;
  text-transform:uppercase; color:var(--copper); display:block;
  margin-bottom:1rem; font-weight:500;
}
.rule { width:3rem; height:1px; background:var(--copper); display:block; margin:2rem 0; }
.rule--center { margin:2rem auto; }
.section-alt { background-color:var(--forest-soft); }
section + section { border-top:1px solid rgba(184,115,51,0.08); }

/* Navigation */
.navbar {
  background:#0d1a10 !important;
  border-bottom:1px solid rgba(184,115,51,0.12);
  padding-top:1.3rem; padding-bottom:1.3rem;
  transition:padding 0.3s;
}
.navbar.scrolled { padding-top:0.75rem; padding-bottom:0.75rem; }
.navbar-brand { font-family:var(--f-heading); font-size:1.3rem; font-weight:300; letter-spacing:0.06em; color:var(--platinum) !important; }
.navbar-brand span { color:var(--copper); }
.navbar-nav .nav-link {
  font-family:var(--f-heading); font-size:0.72rem; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--agate) !important; font-weight:500;
  padding:0.4rem 0.9rem !important; transition:color 0.2s;
}
.navbar-nav .nav-link:hover  { color:var(--copper) !important; }
.navbar-nav .nav-link.active { color:var(--copper) !important; border-bottom:1px solid var(--copper); }
.navbar-toggler { border-color:rgba(184,115,51,0.35); }
.navbar-toggler-icon {
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(184,115,51,0.85)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.nav-cta-btn {
  font-family:var(--f-heading) !important; font-size:0.72rem !important;
  letter-spacing:0.14em !important; text-transform:uppercase !important;
  font-weight:500 !important; background:var(--copper) !important;
  color:var(--forest) !important; border:none !important;
  padding:0.5rem 1.4rem !important; border-radius:0 !important;
  transition:background 0.2s !important;
}
.nav-cta-btn:hover { background:var(--copper-dim) !important; color:var(--forest) !important; }

/* Buttons */
.btn-yitron-primary {
  display:inline-block; font-family:var(--f-heading); font-size:0.78rem;
  letter-spacing:0.15em; text-transform:uppercase; font-weight:500;
  color:var(--forest); background:var(--copper); padding:1rem 2.2rem;
  border:none; border-radius:0; text-decoration:none; transition:background 0.2s;
}
.btn-yitron-primary:hover { background:var(--copper-dim); color:var(--forest); }

.btn-yitron-ghost {
  display:inline-block; font-family:var(--f-heading); font-size:0.78rem;
  letter-spacing:0.15em; text-transform:uppercase; font-weight:500;
  color:var(--platinum); background:transparent; padding:1rem 2.2rem;
  border:1px solid rgba(184,115,51,0.4); border-radius:0;
  text-decoration:none; transition:all 0.2s;
}
.btn-yitron-ghost:hover { border-color:var(--copper); color:var(--copper); }

/* Sections */
section { padding:7rem 0; }

/* Hero */
#hero {
  min-height:100vh; display:flex; align-items:center;
  padding-top:8rem; padding-bottom:5rem; position:relative; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 80% 60% at 70% 40%, rgba(27,67,50,0.7) 0%, transparent 70%),
    radial-gradient(ellipse 40% 40% at 15% 80%, rgba(184,115,51,0.05) 0%, transparent 60%);
}
.hero-grid {
  position:absolute; inset:0; z-index:0;
  background-image:
    linear-gradient(rgba(184,115,51,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(184,115,51,0.04) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(ellipse 90% 80% at 60% 50%, black 30%, transparent 80%);
}
.hero-inner { position:relative; z-index:1; }
.hero-eyebrow {
  font-family:var(--f-heading); font-size:0.72rem; letter-spacing:0.22em;
  text-transform:uppercase; color:var(--copper); font-weight:500;
  margin-bottom:2rem; display:flex; align-items:center; gap:1rem;
}
.hero-eyebrow::before { content:''; display:block; width:2.5rem; height:1px; background:var(--copper); flex-shrink:0; }
.hero-sub { font-size:1.05rem; font-weight:300; color:var(--agate); max-width:560px; line-height:1.85; margin-bottom:3rem; }
.hero-stats { margin-top:5rem; padding-top:2.5rem; border-top:1px solid var(--rule); display:flex; gap:4rem; flex-wrap:wrap; }
.stat-num { font-family:var(--f-heading); font-size:2.6rem; font-weight:200; color:var(--copper); line-height:1; display:block; letter-spacing:-0.02em; }
.stat-label { font-family:var(--f-heading); font-size:0.65rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--agate); display:block; margin-top:0.4rem; font-weight:500; }

/* Problem items */
.problem-item {
  display:flex; gap:1.2rem; align-items:flex-start;
  padding:1.4rem 1.6rem; border:1px solid rgba(184,115,51,0.1);
  background:rgba(13,26,16,0.5); margin-bottom:0.9rem; transition:border-color 0.2s;
}
.problem-item:hover { border-color:rgba(184,115,51,0.3); }
.problem-icon { font-family:var(--f-heading); font-size:0.68rem; color:var(--copper); flex-shrink:0; padding-top:0.2rem; font-weight:500; }
.problem-text strong { display:block; font-weight:500; font-size:0.9rem; color:var(--platinum); margin-bottom:0.25rem; }
.problem-text p { font-size:0.85rem; line-height:1.6; margin:0; }

/* Approach steps */
.approach-steps { display:flex; flex-direction:column; }
.step { display:grid; grid-template-columns:3rem 1fr; gap:1.5rem; padding:2rem 0; border-bottom:1px solid rgba(184,115,51,0.08); }
.step:last-child { border-bottom:none; }
.step-num { font-family:var(--f-heading); font-size:2rem; font-weight:200; color:rgba(184,115,51,0.25); line-height:1; }
.step h4 { font-weight:500; font-size:0.95rem; color:var(--platinum); margin-bottom:0.4rem; }
.step p  { font-size:0.875rem; line-height:1.7; }

/* Service cards */
.services-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:1px;
  border:1px solid rgba(184,115,51,0.1); background:rgba(184,115,51,0.1); margin-top:4rem;
}
.service-card { background:var(--forest-soft); padding:2.5rem; transition:background 0.2s; }
.service-card:hover { background:rgba(22,56,41,0.85); }
.service-tag { font-family:var(--f-heading); font-size:0.65rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--copper-dim); display:block; margin-bottom:1.2rem; font-weight:500; }
.service-card h3 { font-size:1.35rem; margin-bottom:0.75rem; }
.service-card .situation { font-size:0.98rem; color:rgba(184,115,51,0.75); font-style:italic; font-family:var(--f-heading); font-weight:300; margin-bottom:1rem; display:block; }
.service-card p { font-size:0.875rem; }
.service-outcome { margin-top:1.5rem; padding:1rem 1.2rem; background:rgba(184,115,51,0.05); border-left:2px solid var(--copper); font-size:0.82rem; color:var(--agate); line-height:1.6; }
.service-outcome strong { color:var(--copper); font-weight:400; display:block; font-family:var(--f-heading); font-size:0.67rem; letter-spacing:0.12em; text-transform:uppercase; margin-bottom:0.3rem; }

/* Credibility grid */
.credibility-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.cred-item { padding:1.8rem; border:1px solid rgba(184,115,51,0.12); }
.cred-item .cred-icon { font-family:var(--f-heading); font-size:0.65rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--copper); display:block; margin-bottom:0.8rem; font-weight:500; }
.cred-item h4 { font-weight:500; font-size:0.9rem; color:var(--platinum); margin-bottom:0.5rem; }
.cred-item p  { font-size:0.82rem; line-height:1.65; }

/* Achievements aside */
.why-aside { background:rgba(184,115,51,0.04); border:1px solid rgba(184,115,51,0.15); padding:2.5rem; }
.why-aside .aside-label { font-family:var(--f-heading); font-size:0.65rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--copper); display:block; margin-bottom:1.5rem; font-weight:500; }
.achievement { padding:1rem 0; border-bottom:1px solid rgba(184,115,51,0.08); display:flex; gap:1rem; align-items:flex-start; }
.achievement:last-child { border-bottom:none; }
.achievement-num { font-family:var(--f-heading); font-size:1.8rem; font-weight:200; color:var(--copper); line-height:1; flex-shrink:0; width:4.5rem; text-align:right; letter-spacing:-0.02em; }
.achievement-text { font-size:0.85rem; color:var(--agate); line-height:1.6; padding-top:0.3rem; }
.achievement-text strong { color:var(--platinum); font-weight:400; }

/* Process */
.process-track { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid rgba(184,115,51,0.1); margin-top:4rem; }
.process-step { padding:2.5rem 2rem; border-right:1px solid rgba(184,115,51,0.1); }
.process-step:last-child { border-right:none; }
.process-step::before { content:attr(data-n); font-family:var(--f-heading); font-size:4rem; font-weight:200; color:rgba(184,115,51,0.08); display:block; line-height:1; margin-bottom:1rem; letter-spacing:-0.04em; }
.process-step h4 { font-weight:500; font-size:0.95rem; color:var(--platinum); margin-bottom:0.6rem; }
.process-step p  { font-size:0.83rem; line-height:1.7; }

/* CTA */
#cta { text-align:center; padding:8rem 0; position:relative; overflow:hidden; }
.cta-bg { position:absolute; inset:0; background:radial-gradient(ellipse 70% 100% at 50% 50%, rgba(184,115,51,0.05) 0%, transparent 70%); }
#cta .container { position:relative; z-index:1; }
#cta h2 { max-width:680px; margin:0 auto 1.5rem; }
#cta > .container > p { max-width:520px; margin:0 auto 3rem; font-size:1rem; }
.contact-detail { font-family:var(--f-heading); font-size:0.78rem; letter-spacing:0.1em; color:var(--agate); margin-top:2.5rem; }
.contact-detail a { color:var(--copper); }
.contact-detail a:hover { text-decoration:underline; }

/* Footer */
footer { border-top:1px solid rgba(184,115,51,0.08); padding:2.5rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.footer-brand { font-family:var(--f-heading); font-size:1.1rem; font-weight:300; color:var(--agate); }
.footer-brand span { color:var(--copper); }
.footer-note { font-family:var(--f-heading); font-size:0.65rem; letter-spacing:0.1em; color:rgba(185,175,160,0.3); text-transform:uppercase; }

/* Scroll reveal */
.reveal { opacity:0; transform:translateY(24px); transition:opacity 0.7s ease, transform 0.7s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:0.1s; }
.reveal-delay-2 { transition-delay:0.2s; }
.reveal-delay-3 { transition-delay:0.3s; }
.reveal-delay-4 { transition-delay:0.4s; }

/* Responsive */
@media (max-width:991px) {
  .services-grid    { grid-template-columns:1fr; }
  .process-track    { grid-template-columns:1fr 1fr; }
  .process-step     { border-right:none; border-bottom:1px solid rgba(184,115,51,0.08); }
  .credibility-grid { grid-template-columns:1fr; }
}
@media (max-width:767px) {
  section        { padding:5rem 0; }
  .process-track { grid-template-columns:1fr; }
  .hero-stats    { gap:2rem; }
  footer         { flex-direction:column; text-align:center; }
}
