/* ============================================================
   COMPONENTS — nav, buttons, cards, stats, forms, footer, toast
   ============================================================ */

/* ---- NAV ---- */
.nav{
  position:fixed; top:0; left:0; right:0; height:var(--nav-height); z-index:1000;
  display:flex; align-items:center; padding:0 var(--container-pad);
  transition:background var(--dur-mid) var(--ease-out), box-shadow var(--dur-mid) var(--ease-out);
}
.nav.scrolled{ background:rgba(10,13,17,0.94); backdrop-filter:blur(14px); box-shadow:0 1px 0 var(--black-border); }
.nav__inner{ max-width:var(--max-width); width:100%; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:var(--space-lg); }
.nav__brand{ display:flex; align-items:center; gap:12px; flex-shrink:0; }
.nav__logo-mark{ width:38px; height:38px; flex-shrink:0; }
.nav__brand-text{ display:flex; flex-direction:column; line-height:1.3; }
.nav__brand-name{ font-family:var(--font-display); font-size:1.05rem; font-weight:700; color:var(--gold); letter-spacing:0.01em; white-space:nowrap; }
.nav__brand-sub{ font-family:var(--font-mono); font-size:0.58rem; font-weight:500; letter-spacing:0.15em; text-transform:uppercase; color:var(--gray); margin-top:3px; }
.nav__links{ display:flex; align-items:center; gap:var(--space-lg); flex-wrap:nowrap; }
.nav__link{ font-size:0.8rem; font-weight:500; letter-spacing:0.06em; text-transform:uppercase; color:var(--white-soft); cursor:pointer; white-space:nowrap; }
.nav__link:hover{ color:var(--gold); }
.nav__cta{ display:flex; align-items:center; gap:var(--space-sm); flex-shrink:0; }
.nav__toggle{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
.nav__toggle span{ width:22px; height:2px; background:var(--white); border-radius:2px; }
.nav__mobile{ display:none; position:fixed; top:var(--nav-height); left:0; right:0; background:var(--black-soft); border-bottom:1px solid var(--black-border); z-index:999; padding:8px var(--container-pad) 20px; }
.nav__mobile.open{ display:flex; flex-direction:column; }
.nav__mobile a{ padding:12px 0; border-bottom:1px solid var(--black-border); color:var(--white-soft); font-size:0.9rem; }

/* ---- BUTTONS ---- */
.btn{ display:inline-flex; align-items:center; gap:8px; font-size:0.8rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; padding:13px 26px; border-radius:var(--radius-sm); border:none; cursor:pointer; transition:all var(--dur-mid) var(--ease-out); white-space:nowrap; }
.btn--primary{ background:linear-gradient(135deg,var(--gold),var(--gold-dim)); color:var(--black); }
.btn--primary:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(197,151,58,0.25); }
.btn--teal{ background:linear-gradient(135deg,var(--teal),var(--teal-dark)); color:var(--white); }
.btn--teal:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(26,148,133,0.25); }
.btn--ghost{ background:transparent; color:var(--gold); border:1px solid var(--gold-dim); padding:11px 24px; }
.btn--ghost:hover{ background:rgba(197,151,58,0.06); border-color:var(--gold); }
.btn--outline{ background:transparent; color:var(--white-soft); border:1px solid var(--black-border); padding:11px 24px; }
.btn--outline:hover{ border-color:var(--teal); color:var(--teal-light); }
.btn--block{ width:100%; justify-content:center; }
.btn--sm{ padding:9px 18px; font-size:0.72rem; }

/* ---- CARDS ---- */
.card{ background:var(--black-card); border:1px solid var(--black-border); border-radius:var(--radius-md); padding:var(--space-lg); transition:border-color var(--dur-mid); display:flex; flex-direction:column; gap:12px; min-width:0; }
.card:hover{ border-color:var(--gold-dim); }
.card--teal:hover{ border-color:var(--teal-dark); }
.card__icon{ width:44px; height:44px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; }
.card__icon--gold{ background:rgba(197,151,58,0.08); border:1px solid var(--gold-dim); }
.card__icon--teal{ background:rgba(26,148,133,0.08); border:1px solid var(--teal-dark); }
.card__title{ font-family:var(--font-display); font-size:1.3rem; font-weight:500; color:var(--white); }
.card__body{ font-size:0.9rem; line-height:1.7; color:var(--gray-light); }
.card__list{ margin-top:auto; padding-top:4px; }
.card__list li{ font-size:0.83rem; color:var(--gray-light); padding-left:15px; position:relative; margin-bottom:6px; }
.card__list li::before{ content:'—'; position:absolute; left:0; color:var(--teal-light); }
.card__partner{ font-family:var(--font-mono); font-size:0.68rem; color:var(--gold); background:rgba(197,151,58,0.07); padding:4px 10px; border-radius:4px; display:inline-block; width:fit-content; }

/* ---- STAT ---- */
.stat{ text-align:center; padding:var(--space-sm); }
.stat__number{ font-family:var(--font-display); font-size:clamp(1.9rem,3.6vw,3rem); font-weight:400; color:var(--gold); line-height:1; display:block; }
.stat__label{ font-size:0.74rem; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--gray); margin-top:0.4rem; }

/* ---- EMPTY STATE ---- */
.empty-state{ border:1px dashed var(--black-border); border-radius:var(--radius-md); background:var(--black-card); padding:44px 32px; text-align:center; max-width:560px; margin:0 auto; }
.empty-state h3{ margin-bottom:8px; }
.empty-state p{ font-size:0.92rem; }

/* ---- PROJECT / STAT ROW ---- */
.project-card__stats{ display:flex; gap:20px; flex-wrap:wrap; margin-top:6px; padding-top:14px; border-top:1px solid var(--black-border); }
.project-card__stats div strong{ display:block; font-family:var(--font-mono); color:var(--gold); font-size:1.05rem; }
.project-card__stats div span{ font-size:0.7rem; color:var(--gray); }

/* ---- TESTIMONIALS ---- */
.testimonial__stars{ color:var(--gold); font-size:0.9rem; letter-spacing:2px; }
.testimonial__quote{ color:var(--white-soft); font-size:0.95rem; line-height:1.65; font-style:italic; }
.testimonial__who{ display:flex; align-items:center; gap:10px; margin-top:auto; padding-top:12px; border-top:1px solid var(--black-border); }
.testimonial__avatar{ width:36px; height:36px; border-radius:50%; background:rgba(26,148,133,0.1); border:1px solid var(--teal-dark); color:var(--teal-light); display:flex; align-items:center; justify-content:center; font-weight:600; font-size:0.82rem; flex-shrink:0; font-family:var(--font-mono); }
.testimonial__who strong{ display:block; font-size:0.86rem; color:var(--white); font-family:var(--font-body); font-weight:500; }
.testimonial__who span{ font-size:0.75rem; color:var(--gray); }

/* ---- FORMS ---- */
.form-group{ display:flex; flex-direction:column; gap:6px; margin-bottom:var(--space-sm); min-width:0; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-sm); }
.form-label{ font-size:0.72rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--gray-light); }
.form-input,.form-textarea,.form-select{ background:var(--black-soft); border:1px solid var(--black-border); border-radius:var(--radius-sm); color:var(--white); font-family:var(--font-body); font-size:0.92rem; padding:12px 15px; outline:none; width:100%; transition:border-color var(--dur-fast); }
.form-input:focus,.form-textarea:focus,.form-select:focus{ border-color:var(--teal); }
.form-textarea{ resize:vertical; min-height:110px; }
.form-select{ appearance:none; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2383868C' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 15px center; padding-right:38px; }
.form-select option{ background:var(--black-soft); }
.star-select{ display:flex; gap:6px; }
.star-select button{ background:none; border:1px solid var(--black-border); border-radius:4px; width:36px; height:36px; font-size:1rem; color:var(--black-border); cursor:pointer; }
.star-select button.active{ color:var(--gold); border-color:var(--gold-dim); }
.form-note{ font-size:0.76rem; color:var(--gray); margin-top:10px; }

/* ---- TOAST ---- */
.toast{ position:fixed; bottom:24px; right:24px; left:24px; max-width:360px; margin-left:auto; background:var(--black-card); border:1px solid var(--teal-dark); border-radius:var(--radius-md); padding:15px 22px; font-size:0.88rem; color:var(--white); z-index:9999; transform:translateY(30px); opacity:0; transition:all var(--dur-mid) var(--ease-out); }
.toast.show{ transform:translateY(0); opacity:1; }

/* ---- PARTNER STRIP ---- */
.partners{ padding:26px 0; border-top:1px solid var(--black-border); border-bottom:1px solid var(--black-border); background:var(--black-soft); }
.partners__row{ display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; }

/* ---- CONTACT DETAIL ROW ---- */
.contact-detail{ display:flex; gap:14px; margin-bottom:22px; }
.contact-detail__icon{ width:38px; height:38px; border-radius:8px; background:rgba(197,151,58,0.08); border:1px solid var(--gold-dim); color:var(--gold); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.contact-detail strong{ display:block; color:var(--white); font-size:0.9rem; font-weight:500; }
.contact-detail span,.contact-detail a{ font-size:0.88rem; color:var(--gray-light); word-break:break-word; }

/* ---- NEWS ---- */
.news-refresh{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:var(--space-lg); flex-wrap:wrap; gap:12px; }
.news-refresh > div:last-child{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.news-status{ grid-column:1/-1; font-family:var(--font-mono); font-size:0.82rem; color:var(--gray); text-align:center; padding:36px 0; }

.news-card{
  display:flex; flex-direction:column; background:var(--black-card); border:1px solid var(--black-border);
  border-radius:var(--radius-md); overflow:hidden; transition:border-color var(--dur-mid), transform var(--dur-mid);
  text-decoration:none;
}
.news-card:hover{ border-color:var(--gold-dim); transform:translateY(-2px); }
.news-card__img{ height:150px; background-size:cover; background-position:center; background-color:var(--black-soft); flex-shrink:0; }
.news-card__body{ padding:18px; display:flex; flex-direction:column; gap:8px; flex:1; }
.news-card__meta{ display:flex; justify-content:space-between; font-family:var(--font-mono); font-size:0.68rem; color:var(--gray); text-transform:uppercase; letter-spacing:0.04em; }
.news-card__tag{ width:fit-content; }
.news-card h4{ font-size:0.96rem; line-height:1.35; font-weight:500; color:var(--white); }
.news-card .news-link{ font-size:0.8rem; font-weight:600; color:var(--teal-light); margin-top:auto; }
.news-card:hover .news-link{ color:var(--gold); }
.news-updated{ font-family:var(--font-mono); font-size:0.68rem; color:var(--gray); }

.news-dots{ display:flex; justify-content:center; gap:8px; margin-top:28px; }
.news-dot{ width:8px; height:8px; border-radius:50%; border:none; background:var(--black-border); cursor:pointer; padding:0; transition:background var(--dur-fast); }
.news-dot.active{ background:var(--gold); }
.news-dot:hover{ background:var(--gold-dim); }



/* ---- PROCESS ---- */
.process{ display:grid; grid-template-columns:repeat(5,1fr); gap:var(--space-md); }
.process__step{ position:relative; padding-right:16px; min-width:0; }
.process__step::after{ content:''; position:absolute; top:18px; right:-2px; width:22px; height:1px; background:var(--black-border); }
.process__num{ font-family:var(--font-mono); font-size:0.76rem; color:var(--teal-light); font-weight:500; margin-bottom:10px; }
.process__step h4{ color:var(--white); margin-bottom:6px; }
.process__step p{ font-size:0.84rem; }

/* ---- FOOTER ---- */
.footer{ background:var(--black-soft); padding:var(--space-2xl) 0 var(--space-xl); }
.footer__grid{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:var(--space-xl); margin-bottom:var(--space-xl); }
.footer__brand-name{ font-family:var(--font-display); font-size:1.3rem; font-weight:500; color:var(--gold); margin-bottom:0.5rem; }
.footer__brand-tag{ font-size:0.8rem; color:var(--teal-light); font-style:italic; margin-bottom:var(--space-sm); display:block; }
.footer__desc{ font-size:0.85rem; color:var(--gray); line-height:1.7; }
.footer__col h5{ font-size:0.72rem; font-weight:600; letter-spacing:0.15em; text-transform:uppercase; color:var(--white-soft); margin-bottom:var(--space-sm); }
.footer__links{ display:flex; flex-direction:column; gap:10px; }
.footer__links a{ font-size:0.85rem; color:var(--gray); word-break:break-word; }
.footer__links a:hover{ color:var(--gold); }
.footer__bottom{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; padding-top:var(--space-lg); border-top:1px solid var(--black-border); font-size:0.78rem; color:var(--gray); }