/* ===================================================
   SB GROUP VENTURES — custom styles (on top of Tailwind)
   =================================================== */

:root{
  --ink:#0b0b0b;
  --ink-soft:#141414;
  --cream:#f4efe3;
  --cream-soft:#ede6d4;
  --gold:#c9a24b;
  --gold-light:#e9c46a;
  --gold-deep:#8a6b2d;
  --line-dark: rgba(201,162,75,0.35);
  --line-light: rgba(138,107,45,0.35);
}


.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-right: auto;
  margin-left: auto;
}

 
@media (min-width: 576px) {
  .container,
  .container-sm {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container,
  .container-md,
  .container-sm {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl {
    max-width: 1140px;
  }
}
@media (min-width: 1400px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1320px;
  }
}




html{ scroll-behavior:smooth; }

body{
  font-family:'Cormorant Garamond','Georgia',serif;
  background:var(--cream);
  color:var(--ink);
}

.font-display{ font-family:'Playfair Display', Georgia, serif; }
.font-sans{ font-family:'Jost','Helvetica Neue',Arial,sans-serif; }

.tracking-wide2{ letter-spacing:.18em; }
.tracking-wide3{ letter-spacing:.3em; }

/* -------- gold text gradient -------- */
.text-gold-grad{
  background:linear-gradient(100deg,var(--gold-light),var(--gold) 55%,var(--gold-deep));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* -------- header -------- */
header{
  transition:background-color .4s ease, box-shadow .4s ease, padding .3s ease;
}
header.scrolled{
  background-color:rgba(11,11,11,0.96);
  box-shadow:0 10px 30px rgba(0,0,0,.35);
  
    border-bottom: 2px solid #8e6e2f;
}
.nav-link{
  position:relative;
  padding-bottom:6px;
}
.nav-link::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:0%;
  height:1px;
  background:var(--gold);
  transition:width .35s ease;
}
.nav-link:hover::after,
.nav-link.active::after{ width:100%; }
.nav-link.active{ color:var(--gold-light); }

/* -------- buttons -------- */
.btn-gold{
  background:linear-gradient(120deg,var(--gold-light),var(--gold));
  color:#0b0b0b;
  transition:transform .3s ease, box-shadow .3s ease, background-position .5s ease;
  background-size:160% 100%;
  background-position:0% 0%;
}
.btn-gold:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(201,162,75,.35);
  background-position:100% 0%;
}
.btn-outline{
  border:1px solid rgba(255,255,255,0.5);
  transition:all .3s ease;
}
.btn-outline:hover{
  background:#fff;
  color:#0b0b0b;
  border-color:#fff;
  transform:translateY(-2px);
}
.btn-outline-dark{
  border:1px solid rgba(11,11,11,0.4);
  transition:all .3s ease;
}
.btn-outline-dark:hover{
  background:#0b0b0b;
  color:var(--cream);
  transform:translateY(-2px);
}
.arrow-shift{ display:inline-block; transition:transform .3s ease; }
a:hover .arrow-shift, button:hover .arrow-shift{ transform:translateX(6px); }

/* -------- hero -------- */
/* Drop a real photo in as images/hero-photo.jpg and it will automatically
   layer on top of the illustrated fallback (images/hero-bg.svg) below it.
   If hero-photo.jpg doesn't exist, browsers simply skip that layer. */
.hero-bg{
  background:
    url('../images/hero-photo.jpg') center/cover no-repeat,
    url('../images/hero-bg.svg') center/cover no-repeat,
    #0b0b0b;
}
.hero-kicker{
  letter-spacing:.35em;
}
@keyframes floatY{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-10px); }
}
.hero-fade-up{
  opacity:0;
  transform:translateY(26px);
  animation:heroUp .9s cubic-bezier(.2,.7,.3,1) forwards;
}
@keyframes heroUp{
  to{ opacity:1; transform:translateY(0); }
}

/* -------- section dividers / eyebrow -------- */
.eyebrow{
  letter-spacing:.28em;
  color:var(--gold-deep);
}
.divider-line{
  height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}

/* -------- what we do -------- */
.process-card{
  transition:transform .4s ease;
}
.process-card:hover{ transform:translateY(-6px); }
.process-icon{
  width:56px;height:56px;
  color:var(--gold-deep);
  transition:transform .5s ease, color .4s ease;
}
.process-card:hover .process-icon{
  transform:rotate(-8deg) scale(1.08);
  color:var(--gold);
}
.process-num{
  font-family:'Playfair Display',serif;
  color:rgba(138,107,45,.35);
  transition:color .4s ease;
}
.process-card:hover .process-num{ color:var(--gold); }

/* reveal-on-scroll */
.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .8s ease, transform .8s ease;
}
.reveal.in-view{
  opacity:1;
  transform:translateY(0);
}
.reveal-stagger > *{ transition-delay: calc(var(--i,0) * 90ms); }

/* -------- products -------- */
.product-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(201,162,75,0.25);
  cursor:pointer;
}
.product-card img{
  transition:transform .6s cubic-bezier(.2,.7,.3,1), filter .5s ease;
  filter:grayscale(15%) brightness(.92);
}
.product-card:hover img{
  transform:scale(1.12);
  filter:grayscale(0%) brightness(1);
}
.product-card .label-bar{
  transition:background-color .35s ease;
}
.product-card:hover .label-bar{
  background-color:var(--gold);
  color:#0b0b0b;
}
.product-card::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 55%, rgba(0,0,0,.75) 100%);
  opacity:0; transition:opacity .4s ease;
  pointer-events:none;
}
.product-card:hover::before{ opacity:1; }

/* -------- global network map -------- */
.map-glow-dot{
  animation:pulseDot 2.6s ease-in-out infinite;
}
@keyframes pulseDot{
  0%,100%{ opacity:.55; }
  50%{ opacity:1; }
}
.landmark-icon{
  width:34px; height:34px;
  color:var(--gold);
  transition:transform .4s ease, color .4s ease;
}
.landmark-item:hover .landmark-icon{
  transform:translateY(-6px) scale(1.1);
  color:var(--gold-light);
}
.landmark-item{ transition:opacity .3s ease; }

/* -------- why choose -------- */
.value-item{ transition:transform .35s ease; }
.value-item:hover{ transform:translateY(-4px); }
.value-icon-wrap{
  width:60px;height:60px; 
  transition:background-color .35s ease, border-color .35s ease, transform .35s ease;
}
.value-item:hover .value-icon-wrap{ 
  transform:rotate(-6deg);
}
.value-item:hover .value-icon-wrap svg{ color:var(--gold-light); }
.value-icon-wrap svg{ width:26px;height:26px; color:var(--gold-deep); transition:color .35s ease; }

/* -------- CTA band -------- */
.cta-band{
  background:linear-gradient(120deg,#0b0b0b, #161513 60%, #0b0b0b);
}

/* -------- footer -------- */
.social-icon{
  width:38px;height:38px;
  border:1px solid rgba(201,162,75,.4);
  transition:all .3s ease;
}
.social-icon:hover{
  background:var(--gold);
  border-color:var(--gold);
  color:#0b0b0b;
  transform:translateY(-3px);
}
.footer-link{
  position:relative;
  transition:color .3s ease, padding-left .3s ease;
}
.footer-link:hover{
  color:var(--gold-light);
  padding-left:6px;
}

/* -------- mobile menu -------- */
#mobile-menu{
  max-height:0;
  overflow:hidden;
  transition:max-height .45s ease;
}
#mobile-menu.open{ max-height:520px; }

/* -------- back to top -------- */
#backToTop{
  opacity:0; pointer-events:none;
  transition:opacity .35s ease, transform .35s ease;
  transform:translateY(10px);
}
#backToTop.show{ opacity:1; pointer-events:auto; transform:translateY(0); }

/* scrollbar accent (optional, non-critical) */
::selection{ background:var(--gold-light); color:#0b0b0b; }

/* utility for gold hairline */
.hairline{ border-color: rgba(201,162,75,.35); }

/* respect reduced motion */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}
