/* ============================================================
   G3 Merchandising — shared light "navy & gold" design system
   Used by every page. Pairs with js/tailwind-config.js (Tailwind
   theme extension) and js/site.js (shared interaction/animation
   init). Keep this file dependency-free (no @import of externals)
   so it works on Azure Static Web Apps with zero build step.
   ============================================================ */

html { scroll-behavior: smooth; }
body { background:#faf7f0; font-family:'Inter',sans-serif; }
::selection { background:#c9973f; color:#0f2547; }
::-webkit-scrollbar { width:10px; }
::-webkit-scrollbar-track { background:#f1ece0; }
::-webkit-scrollbar-thumb { background:linear-gradient(#0f2547,#c9973f); border-radius:99px; }

[x-cloak] { display:none !important; }

.font-display { font-family:'Playfair Display',serif; }

.text-gradient {
  background: linear-gradient(90deg,#a97b2c 0%,#c9973f 50%,#8a3b52 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.text-gradient-cool {
  background: linear-gradient(90deg,#4fae93 0%,#c9973f 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.glass {
  background: rgba(255,255,255,0.75);
  border: 1px solid rgba(15,37,71,0.09);
  backdrop-filter: blur(18px);
  box-shadow: 0 10px 30px -14px rgba(15,37,71,0.25);
}
.btn-gradient {
  background: linear-gradient(90deg,#c9973f,#a97b2c);
  box-shadow: 0 10px 26px -10px rgba(169,123,44,0.55);
}
.btn-gradient:hover { box-shadow: 0 14px 32px -8px rgba(169,123,44,0.6); }

.noise {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}

.reveal-up { opacity:0; transform:translateY(36px); }
.tab-underline { transition: transform .35s cubic-bezier(.22,1,.36,1), width .35s ease; }

.division-photo { position:relative; }
.division-photo::after {
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(15,37,71,0.10) 0%, rgba(15,37,71,0.90) 92%);
}

.weave-pattern {
  background-image: repeating-linear-gradient(45deg, rgba(255,255,255,0.10) 0 2px, transparent 2px 14px),
                     repeating-linear-gradient(-45deg, rgba(255,255,255,0.08) 0 2px, transparent 2px 14px);
}

[data-tilt] { transform-style: preserve-3d; }

.marquee-mask {
  -webkit-mask-image: linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
}

/* Vertical process/timeline (used on apparel-garments.html) */
.timeline-line {
  background: linear-gradient(180deg,#0f2547,#8a3b52,#c9973f,#0d7a5f);
}
.timeline-dot {
  box-shadow: 0 0 0 6px #faf7f0, 0 0 20px -4px rgba(201,151,63,0.6);
}

/* Pillar card hover lift */
.pillar-card { transition: transform .4s cubic-bezier(.22,1,.36,1), border-color .3s ease; }
.pillar-card:hover { transform: translateY(-6px); }

/* Capability grid icon tile */
.cap-icon {
  background: linear-gradient(135deg, rgba(15,37,71,0.10), rgba(201,151,63,0.16));
}