:root{
  --sand-50:#f7fbff;
  --sand-100:#eef7f6;
  --sand-200:#d7ece8;
  --sand-300:#b9ddd7;
  --sand-400:#7fc6bd;
  --copper-500:#11a69a;
  --copper-600:#0f8f87;
  --copper-700:#0b6f69;
  --ink-900:#111827;
  --ink-700:#314155;
  --ink-500:#6b778c;
  --coral:#f26a5b;
  --sun:#f4b942;
  --blue:#2563eb;
  --white:#ffffff;
  --shadow-soft:0 16px 40px rgba(17, 24, 39, .08);
  --shadow-card:0 24px 58px rgba(17, 24, 39, .11);
  --radius-sm:14px;
  --radius-md:20px;
  --radius-lg:28px;
  --ring:rgba(17, 166, 154, .2);
  --bs-primary:var(--copper-500);
  --bs-primary-rgb:196,107,45;
  --bs-link-color:var(--copper-700);
  --bs-link-hover-color:var(--copper-500);
}

html{
  scroll-behavior:smooth;
}

*{
  font-family:"Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body{
  color:var(--ink-900);
  background:
    linear-gradient(135deg, rgba(17,166,154,.08) 0 25%, transparent 25% 50%, rgba(37,99,235,.055) 50% 75%, transparent 75%),
    linear-gradient(180deg, #f8fbff 0%, #f3faf8 48%, #ffffff 100%);
  background-size:44px 44px, auto;
}

h1,h2,h3,h4,h5,.display-1,.display-2,.display-3,.display-4,.display-5,.display-6,.section-title{
  font-family:"Space Grotesk", "Plus Jakarta Sans", system-ui, sans-serif;
  letter-spacing:-.01em;
  color:var(--ink-900);
}

.display-6{
  font-size:2rem;
}

a{
  transition:color .2s ease, opacity .2s ease, transform .2s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
}

.text-muted{
  color:var(--ink-500) !important;
}

.site-header{
  position:sticky;
  top:0;
  z-index:1030;
  background:#fff;
  border-bottom:1px solid rgba(17, 24, 39, .08) !important;
}

.topbar{
  background:linear-gradient(90deg, #0f766e 0%, #2563eb 58%, #f26a5b 100%);
  letter-spacing:.02em;
}

.navbar{
  background:#fff !important;
}

.navbar-brand{
  gap:14px !important;
  padding-top:.5rem;
  padding-bottom:.5rem;
}

.brand-lockup{
  display:flex;
  flex-direction:column;
  line-height:1;
}

.brand-name{
  font-family:"Space Grotesk", "Plus Jakarta Sans", system-ui, sans-serif;
  font-size:1.55rem;
  font-weight:700;
  letter-spacing:-.02em;
  color:var(--ink-900);
}

.brand-subtitle{
  margin-top:4px;
  font-size:.74rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-500);
}

.brand-mark{
  width:40px;
  height:40px;
  border-radius:13px;
  background:linear-gradient(135deg, var(--blue) 0%, var(--copper-500) 58%, var(--coral) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    0 12px 28px rgba(17, 24, 39, .18);
  position:relative;
  flex:0 0 auto;
}

.brand-mark::before{
  content:"GC";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:"Space Grotesk", "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight:700;
  font-size:1rem;
  letter-spacing:.02em;
  color:#fff8f1;
}

.navbar-nav .nav-link{
  font-weight:600;
  color:var(--ink-700);
  padding:.6rem .82rem !important;
  border-radius:999px;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus{
  color:var(--ink-900);
  background:rgba(17,166,154,.08);
  box-shadow:inset 0 0 0 1px rgba(17,166,154,.12);
}

.navbar-toggler{
  border:1px solid rgba(17, 24, 39, .12);
  border-radius:14px;
  padding:.55rem .8rem;
}

.navbar-toggler:focus{
  box-shadow:0 0 0 .25rem var(--ring);
}

.nav-pill-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:linear-gradient(180deg, #ffffff 0%, #eefdfa 100%);
  border:1px solid rgba(17,166,154,.16);
  box-shadow:0 14px 24px rgba(17, 24, 39, .07);
}

.nav-pill-link .badge{
  box-shadow:none;
}

.auth-dropdown:hover > .dropdown-menu,
.auth-dropdown:focus-within > .dropdown-menu{
  display:block;
}

.auth-dropdown .dropdown-menu{
  margin-top:0;
  border:1px solid rgba(17,166,154,.14);
  border-radius:14px;
  box-shadow:var(--shadow-soft);
}

.auth-dropdown .dropdown-item{
  font-weight:600;
  color:var(--ink-700);
  padding:.65rem 1rem;
}

.auth-dropdown .dropdown-item:hover,
.auth-dropdown .dropdown-item:focus{
  color:var(--ink-900);
  background:#eefdfa;
}

.btn{
  border-radius:999px;
  padding:.64rem 1.05rem;
  font-size:.94rem;
  font-weight:700;
  letter-spacing:.01em;
}

.btn-sm{
  padding:.42rem .75rem;
  font-size:.82rem;
  border-radius:999px;
}

.btn-lg{
  padding:.78rem 1.15rem;
  font-size:1rem;
}

.btn-primary{
  color:#fff;
  background:linear-gradient(135deg, #0f766e 0%, #2563eb 100%);
  border:0;
  box-shadow:0 16px 28px rgba(37, 99, 235, .18);
}

.btn-primary:hover,
.btn-primary:focus{
  color:#fff;
  transform:translateY(-1px);
  box-shadow:0 20px 36px rgba(37, 99, 235, .24);
}

.btn-outline-primary{
  color:var(--copper-700);
  border:1px solid rgba(17,166,154,.24);
  background:rgba(255,255,255,.74);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg, #0f766e 0%, #2563eb 100%);
}

.btn-light{
  color:var(--ink-900);
  background:rgba(255,255,255,.88);
  border:1px solid rgba(17, 24, 39, .08);
  box-shadow:0 12px 22px rgba(17, 24, 39, .07);
}

.btn-light:hover,
.btn-light:focus{
  background:#fff;
  color:var(--ink-900);
}

.badge{
  border-radius:999px;
  padding:.45rem .72rem;
  font-weight:700;
}

.badge-soft{
  background:rgba(17,166,154,.1);
  color:var(--copper-700);
  border:1px solid rgba(17,166,154,.16);
}

.kpi,
.mini-search,
.trust-strip,
.product-card,
.category-card,
.modal-content,
.alert,
.table-responsive,
.shop-filter-shell{
  box-shadow:var(--shadow-soft);
}

.kpi,
.mini-search,
.trust-strip{
  border:1px solid rgba(17, 24, 39, .08);
  border-color:rgba(17, 24, 39, .08);
  background:rgba(255,255,255,.82);
  border-radius:var(--radius-sm);
}

.hero{
  padding:26px 0 8px;
}

.hero-card{
  position:relative;
  background:
    linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(236,253,245,.96) 58%, rgba(239,246,255,.96) 100%);
  border:1px solid rgba(17,166,154,.12);
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-card);
}

.hero h1{
  font-size:clamp(2rem, 4.2vw, 3.45rem);
  line-height:1;
}

.hero .fs-5{
  font-size:1rem !important;
}

.hero-kicker{
  max-width:100%;
}

.hero-kicker .badge{
  display:block;
  max-width:100%;
  white-space:normal !important;
  overflow-wrap:anywhere;
  text-align:left;
  line-height:1.35;
}

.hero-kicker .small{
  line-height:1.45;
}

.mini-search{
  padding:18px;
  border-radius:28px;
  background:rgba(255,255,255,.8);
}

.chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:999px;
  padding:10px 14px;
  border:1px solid rgba(17, 24, 39, .08);
  background:rgba(255,255,255,.86);
  font-size:.92rem;
  color:var(--ink-700);
  text-decoration:none;
  box-shadow:0 10px 22px rgba(17, 24, 39, .05);
}

.chip:hover{
  color:var(--ink-900);
  transform:translateY(-1px);
  box-shadow:0 16px 28px rgba(17, 24, 39, .09);
}

.trust-strip{
  border-radius:24px;
  overflow:hidden;
}

.trust-item{
  padding:14px 16px;
}

.trust-item .t1{
  font-weight:700;
  color:var(--ink-900);
}

.trust-item .t2{
  font-size:.86rem;
  color:var(--ink-500);
}

.section-title{
  font-size:clamp(1.65rem, 2.6vw, 2.25rem);
  margin-bottom:0;
}

.section-title + .text-muted{
  max-width:640px;
}

.category-card{
  height:100%;
  padding:14px;
  border:1px solid rgba(17, 24, 39, .08);
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(238,253,250,.92) 100%);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.category-card:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 44px rgba(17, 24, 39, .11);
  border-color:rgba(17,166,154,.22);
}

.category-card .ratio{
  border-radius:22px !important;
  background:linear-gradient(180deg, #ffffff 0%, #eefdfa 100%) !important;
  border:1px solid rgba(17,166,154,.08);
}

.category-card img{
  transition:transform .35s ease;
}

.category-card:hover img{
  transform:scale(1.04);
}

.product-card{
  background:linear-gradient(180deg, rgba(255,255,255,.99) 0%, rgba(248,251,255,.96) 100%);
  border:1px solid rgba(17, 24, 39, .08);
  border-radius:22px;
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  height:100%;
}

.product-card:hover{
  transform:translateY(-5px);
  box-shadow:0 26px 50px rgba(17, 24, 39, .13);
  border-color:rgba(37,99,235,.16);
}

.product-thumb{
  aspect-ratio:1 / 1;
  background:
    linear-gradient(135deg, rgba(236,253,245,.95), rgba(239,246,255,.95));
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  position:relative;
}

.product-thumb::after{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.5);
  pointer-events:none;
}

.product-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.product-card .fw-semibold{
  font-size:.96rem;
  line-height:1.35;
  color:var(--ink-900);
}

.footer{
  position:relative;
  background:
    linear-gradient(180deg, rgba(248,251,255,.98) 0%, rgba(238,247,246,.98) 100%);
  border-top:1px solid rgba(17, 24, 39, .08);
}

.footer::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(17,166,154,.24), transparent);
}

.footer-link{
  color:var(--ink-700);
  text-decoration:none;
}

.footer-link:hover{
  color:var(--copper-700);
}

.footer .fw-bold{
  font-family:"Space Grotesk", "Plus Jakarta Sans", system-ui, sans-serif;
  font-size:1.35rem;
}

.form-control,
.form-select{
  border-radius:14px;
  border:1px solid rgba(17, 24, 39, .1);
  background:rgba(255,255,255,.92);
  padding:.68rem .85rem;
  font-size:.94rem;
  color:var(--ink-900);
}

.form-control::placeholder{
  color:#8b97aa;
}

.form-control:focus,
.form-select:focus{
  border-color:rgba(17, 166, 154, .45);
  box-shadow:0 0 0 .25rem var(--ring);
}

.modal-content{
  border:1px solid rgba(17, 24, 39, .08);
  border-radius:20px;
  overflow:hidden;
}

.modal-header,
.modal-footer{
  border-color:rgba(17, 24, 39, .08);
}

.alert{
  border:1px solid rgba(17, 24, 39, .08);
  border-radius:16px;
  background:rgba(255,255,255,.78);
}

.hp-field{
  display:none !important;
}

#leadModalForm{
  display:grid;
  gap:12px;
}

.position-sticky.shop-filter-shell,
.shop-filter-shell{
  border-radius:20px !important;
  border:1px solid rgba(17, 24, 39, .08) !important;
  background:rgba(255,255,255,.82) !important;
  backdrop-filter:blur(10px);
}

#shopMeta{
  color:var(--ink-500) !important;
}

@media (max-width:991.98px){
  .site-header{
    position:static;
  }

  .navbar-collapse{
    margin-top:12px;
    padding:14px;
    border-radius:22px;
    background:rgba(255,255,255,.88);
    border:1px solid rgba(17, 24, 39, .08);
    box-shadow:var(--shadow-soft);
  }

  .navbar-nav{
    align-items:stretch !important;
  }

  .navbar-nav .nav-link{
    border-radius:16px;
  }

  .hero{
    padding-top:20px;
  }

  .hero-card{
    border-radius:26px;
  }

  .section-title{
    font-size:1.7rem;
  }

  .product-card,
  .category-card{
    border-radius:18px;
  }

  .table-responsive{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .table-responsive table{
    min-width:680px;
  }

  .card-header,
  .d-flex.justify-content-between{
    flex-wrap:wrap;
    gap:.75rem;
  }
}

@media (max-width:575.98px){
  .brand-name{
    font-size:1.3rem;
  }

  .brand-subtitle{
    font-size:.66rem;
    letter-spacing:.12em;
  }

  .hero h1{
    font-size:2rem;
  }

  .hero-kicker{
    align-items:flex-start !important;
  }

  .hero-kicker .badge,
  .hero-kicker .small{
    width:100%;
  }

  .hero-kicker .badge{
    padding:.55rem .75rem !important;
    font-size:.78rem;
    line-height:1.4;
  }

  .display-6{
    font-size:1.65rem;
  }

  .container{
    padding-left:14px;
    padding-right:14px;
  }

  .product-card .p-3,
  .category-card{
    padding:12px !important;
  }

  .row.g-3{
    --bs-gutter-x:.75rem;
    --bs-gutter-y:.75rem;
  }

  .btn-lg{
    width:100%;
    justify-content:center;
  }

  .d-flex.flex-wrap.gap-2 .btn-lg{
    flex:1 1 100%;
  }
}
