#sm-brand-anim-section {
  position: relative;
  width: 100%;
  padding: 120px 24px 130px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;      
  background: transparent;
}

#sm-brand-anim-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60%;
  height: 1px;
  background: linear-gradient(90deg,
    transparent,
    rgba(219,255,73,0.25) 30%,
    rgba(219,255,73,0.40) 50%,
    rgba(219,255,73,0.25) 70%,
    transparent
  );
}

#sm-brand-anim-section::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60%;
  height: 1px;
  background: linear-gradient(90deg,
    transparent,
    rgba(219,255,73,0.25) 30%,
    rgba(219,255,73,0.40) 50%,
    rgba(219,255,73,0.25) 70%,
    transparent
  );
}

/* FIX TEXT CUTTING ON SMALL DEVICES */

@media (max-width: 768px){

  .sm-brand-base,
  .sm-brand-inv{

    font-size: clamp(32px, 12vw, 72px);

    letter-spacing: -1px;

  }

}

@media (max-width: 480px){

  .sm-brand-base,
  .sm-brand-inv{

    font-size: clamp(24px, 11vw, 52px);

    letter-spacing: 0px;

  }

}

.sm-brand-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
  max-width: 1600px;
}
.sm-brand-inner::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: radial-gradient(ellipse at center,
    rgba(219,255,73,0.05) 0%,
    transparent 65%
  );
  pointer-events: none;
}
.sm-brand-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 48px;
  padding: 7px 18px;
  border: 1px solid rgba(219,255,73,0.14);
  border-radius: 100px;
  background: rgba(219,255,73,0.04);
}

.sm-brand-label-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #DBFF49;
  animation: smDotPulse 2s ease-in-out infinite;
}


@keyframes smDotPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.4; transform: scale(0.7); }
}

.sm-brand-stage {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  width:100%;
  overflow:visible;
}

/* TEXT WRAPPER — relative container */
.sm-brand-text-wrap {
  position: relative;
  display: inline-block;
  width:100%;
  display:flex;
  justify-content:center;
  padding:0 10px;
}

/* BASE TEXT — white, normal */
.sm-brand-base {
  font-family: 'Bunken Tech Sans SC Wide W01Bd', sans-serif;
  font-size: clamp(42px, 8.5vw, 118px);
  font-weight: 700;
  color: #F8F6F5;
  letter-spacing: -3px;
  line-height: 1;
  white-space: nowrap;
  user-select: none;
  position: relative;
  z-index: 1;
}

.sm-brand-mask {
  position: absolute;
  top: -150px;                      
  left: -100px;                     
  width: calc(100% + 200px);        
  height: calc(100% + 300px);       
  background: #DBFF49;
  -webkit-clip-path: circle(0px at 100px 150px);
  clip-path: circle(0px at 100px 150px);   
  z-index: 2;
  pointer-events: none;
}

.sm-brand-inv {
  font-family: 'Bunken Tech Sans SC Wide W01Bd', sans-serif;  
  font-size: clamp(42px, 8.5vw, 118px);
  font-weight: 700;
  color: #111111;
  letter-spacing: -3px;
  line-height: 1;
  white-space: nowrap;
  user-select: none;
  position: absolute;
  top: 150px;   
  left: 100px;  
}


@media (max-width: 600px) {
  #sm-brand-anim-section {
    padding: 80px 16px 90px;
  }
  .sm-brand-base,
  .sm-brand-inv {
    letter-spacing: -1px;
  }
}

.sm-brand-tagline{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:-45px;
  margin-bottom:18px;
  overflow:visible;
  position:relative;
  z-index:5;
}

.loop-text{
  display:flex;
  align-items:center;
  justify-content:center;
  white-space:normal;
    text-align:center;
  font-family:'Bunken Tech Sans SC Wide W01Bd',sans-serif;
 font-size:clamp(13px,2.5vw,20px);
  line-height:1;
    padding:0 16px;
  text-transform:uppercase;
}

.loop-text span {
  display: inline-block;
  color: #ffffff;
}

/* LIME LETTERS */
.loop-text span:nth-child(1),
.loop-text span:nth-child(9),
.loop-text span:nth-child(15),
.loop-text span:nth-child(22),
.loop-text span:nth-child(31){
  color:#DBFF49;
}

@media (max-width: 480px) {
  .loop-text {
    font-size: 11px;
    white-space: normal;
    text-align: center;
    padding: 0 20px;
    line-height: 1.6;
  }
}
/* ==============================================
   SGD GYM DOCK SECTION
   css/style.css ke end mein paste karo
=============================================== */

#sgd-section {
  position: relative;
  background-color: #1a1a1a;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 200px 200px;
  padding: 110px 32px 100px;
  color: #F8F6F5;
  overflow: hidden;
}

#sgd-section::before {
  content: '';
  position: absolute;
  top: 0; left: 5%; right: 5%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(219,255,73,.15) 30%, rgba(219,255,73,.15) 70%, transparent);
  pointer-events: none;
}

.sgd-inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}

/* HEADER — exact sheo-about style */
.sgd-header {
  width: 100%;
  max-width: 980px;
  margin: 0 auto 42px;
  padding: 0 0 0 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.sgd-header-label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}

.sgd-header-line {
  width: 34px;
  height: 2px;
  border-radius: 20px;
  background: #DBFF49;
  flex-shrink: 0;
}

.sgd-header-tag {
  font-family: 'Urbanist', sans-serif;
  font-size: 45px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #DBFF49;
}

.sgd-header-sub {
  max-width: 620px;
  font-family: 'Urbanist', sans-serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.8;
  color: rgba(255,255,255,.58);
  margin: 0;
}

@media (max-width: 768px) {
  .sgd-header { margin-bottom: 28px; }
  .sgd-header-sub { font-size: 14px; line-height: 1.7; }
}

/* ============================================
   DESKTOP FIELD — fixed rows, honeycomb
============================================ */
.sgd-field {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  overflow: visible;
  padding: 8px 0;
  margin-bottom: 52px;
}

.sgd-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 22px;
  flex-wrap: nowrap; /* desktop: fixed row */
}

/* CHIP */
.sgd-chip {
  position: relative;
  flex-shrink: 0;
  width: 110px;
  height: 110px;
  border-radius: 26px;
  background: #161616;
  border: 1px solid rgba(219,255,73,.10);
  overflow: hidden;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    transform .22s cubic-bezier(0.34, 1.56, 0.64, 1),
    border-color .2s ease,
    box-shadow .2s ease;
  transform-origin: center center;
  will-change: transform;
}
.sgd-chip img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: grayscale(100%) brightness(.8);
  transition: filter .25s ease;
  position: relative; z-index: 2;
  display: block;
}
.sgd-chip__fb {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Poppins', sans-serif;
  font-size: 14px; font-weight: 600;
  color: rgba(219,255,73,.6);
  letter-spacing: .04em; z-index: 1;
}
.sgd-chip--active {
  border-color: #DBFF49 !important;
  box-shadow: 0 0 26px rgba(219,255,73,.22) !important;
}
.sgd-chip--active img {
  filter: grayscale(0%) brightness(1) !important;
}

/* TOOLTIP */
.sgd-tooltip {
  position: fixed; pointer-events: none; z-index: 9999;
  padding: 5px 13px;
  background: rgba(219,255,73,.92); color: #111;
  font-family: 'Urbanist', sans-serif;
  font-size: 11px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  border-radius: 999px; white-space: nowrap;
  opacity: 0; transform: translateY(6px);
  transition: opacity .16s ease, transform .16s ease;
}
.sgd-tooltip--visible { opacity: 1; transform: translateY(0); }

/* CTA */
.sgd-cta { display: flex; justify-content: center; }
.sgd-cta__btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 13px 30px; background: #DBFF49; color: #111;
  border-radius: 999px; font-family: 'Urbanist', sans-serif;
  font-size: 14px; font-weight: 700; letter-spacing: .05em;
  text-decoration: none;
  transition: transform .22s ease, box-shadow .22s ease;
}
.sgd-cta__btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 34px rgba(219,255,73,.24);
}

/* ============================================
   RESPONSIVE

   Desktop (>900px):
     Fixed 7-6-7-6-5-4 rows, chip=110px, gap=22px

   Jaise screen chota hota hai:
     - .sgd-row => display:contents (rows dissolve)
     - .sgd-field => flex-wrap:wrap (chips auto-wrap)
     - Chip size chota hota jaata hai
     - Jitne fit ho utne ek row mein, baki niche
     - justify-content:center se centered rehte hain
     - gap se collapse nahi hoga
============================================ */

/* Tablet landscape — rows still fixed but smaller */
@media (max-width: 1000px) {
  .sgd-chip { width: 90px; height: 90px; border-radius: 22px; }
  .sgd-chip__fb { font-size: 12px; }
  .sgd-row { gap: 18px; }
  .sgd-field { gap: 18px; }
  #sgd-section { padding: 90px 24px; }
}

/* Tablet portrait */
@media (max-width: 780px) {
  #sgd-section { padding: 80px 20px; }
  .sgd-header { margin-bottom: 40px; }
  .sgd-row { gap: 13px; flex-wrap: wrap; }
  .sgd-field { gap: 13px; }
  .sgd-chip { width: 78px; height: 78px; border-radius: 20px; }
  .sgd-chip__fb { font-size: 11px; }
}

/* Mobile */
@media (max-width: 560px) {
  #sgd-section { padding: 70px 16px; }
  .sgd-row { gap: 10px; }
  .sgd-field { gap: 10px; }
  .sgd-chip { width: 62px; height: 62px; border-radius: 16px; }
  .sgd-chip__fb { font-size: 10px; }
}

/* Mobile small */
@media (max-width: 420px) {
  #sgd-section { padding: 64px 14px; }
  .sgd-row { gap: 8px; }
  .sgd-field { gap: 8px; }
  .sgd-chip { width: 52px; height: 52px; border-radius: 14px; }
  .sgd-chip__fb { font-size: 9px; }
}

/* Tiny */
@media (max-width: 360px) {
  #sgd-section { padding: 56px 12px; }
  .sgd-row { gap: 7px; }
  .sgd-field { gap: 7px; }
  .sgd-chip { width: 44px; height: 44px; border-radius: 12px; }
}

/* ════════ ENTERPRISE SECTION: PREMIUM GLASSY LOOK ════════ */

#enterprise-section {
    padding: 100px 20px;
    text-align: center;
    position: relative;
    /* Piche ka wahi background maintain rahega jo tera existing site ka hai */
}

.ent-container { 
    max-width: 600px; 
    margin: 0 auto; 
}

.ent-tag { 
    font-size: 10px; 
    letter-spacing: 3px; 
    text-transform: uppercase; 
    color: #DBFF49; 
    margin-bottom: 20px; 
    display: block; 
}

.ent-title { 
    font-family: 'Poppins', sans-serif; 
    font-size: clamp(28px, 5vw, 42px); 
    color: #fff; 
    margin-bottom: 20px; 
    line-height: 1.2; 
}

.ent-desc { 
    font-size: 15px; 
    color: #a0aab2; 
    margin-bottom: 35px; 
    line-height: 1.6; 
}

/* ════════ GLASSY HOVER BUTTON ════════ */
.ent-cta-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 16px 35px;
    background: #DBFF49; /* Original Color */
    color: #000;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    border-radius: 12px;
    border: 1px solid transparent;
    transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
    overflow: hidden;
}

/* Hover effect: Transparent + Blur + Border */
.ent-cta-btn:hover {
    background: transparent !important; 
    backdrop-filter: blur(12px);         /* Piche ka background blur */
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.2); /* Glassy border */
    color: #fff !important;             /* Text white ho jayega */
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    transform: translateY(-4px);
}