/** Shopify CDN: Minification failed

Line 64:0 Unexpected "}"
Line 92:7 Expected identifier but found "10px"
Line 1243:10 Expected identifier but found whitespace
Line 1243:12 Unexpected "{"
Line 1243:21 Expected ":"
Line 1243:63 Expected ":"

**/

/* Container */
.product-filter-card-containerwrapper {
  background-color:rgb(255, 255, 255);
}
.product-filter-card-container {
  max-width: 1300px;
  margin: 0 auto;
  padding: 20px;
  font-family: sans-serif;
  background-color:rgb(255, 255, 255);
  padding-top:3rem;
}

/* Filters */
.product-filter-card-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin-bottom: 20px;
}
.product-filter-card-filter-group {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content:end;
}
.product-filter-card-filter-group label {
    font-size: 15px;
    margin-bottom: 5px;
    color: #000000c9;
    font-weight: bold;
}
.product-filter-card-filter-group select,
.product-filter-card-filter-group button {
  padding: 8px 12px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
}
.product-filter-card-filter-group button:hover {
  background-color: #e0e0e0;
}

/* Grid */
.product-filter-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(260px, 1fr));
  gap: 20px;
      max-width: 1264px;
    margin: 0 auto;
}
}

.line-clamp-1 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* Chips */
.flex {
  display: flex;
}

.flex-wrap {
  flex-wrap: wrap;
}

.gap-1 {
  gap: 0.25rem;
}

.font-bold{
  font-weight: bold;
}
.text-foreground {
  color: #111827;
}

.text-[10px] {
  font-size: 10px;
}

.py-0 { padding-top: 0; padding-bottom: 0; }
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }

/* Rating */
.gap-2 { gap: 0.5rem; }
.text-yellow-400 { color: #facc15; fill:#facc15 !important }

/* Price */
.text-2xl {
  font-size: 1.5rem;
}

.line-through {
  text-decoration: line-through;
}

.text-sm {
  font-size: 0.875rem;
}

/* Buttons (generic) */
button {
  cursor: pointer;
  border-radius: 0.375rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  transition: background-color 0.2s ease;
}

button:disabled {
  pointer-events: none;
  opacity: 0.5;
}

.bg-primary {
  background-color: #f97a1f;
  color: #fff;
}

.bg-primary:hover {
  background-color:rgb(212, 101, 22);
}

.border {
  border-width: 1px;
  border-style: solid;
}

.border-primary {
  border-color: #f97a1f;
}

.bg-background {
  background-color: #f9fafb;
}
.hoverprimary:hover{
    background-color: #f97a1f;
    color:white;
}
.text-primary {
  color: #f97a1f;
}

.text-primary-foreground {
  color: #fff;
}

.w-full {
  width: 100%;
}

.h-10 {
  height: 2.5rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.pale-bold {
    color: #00000096;
    font-weight: 700;
}
.text-card-foreground{
  background-color: white;
  border: 2px solid white;
}

.bgcertifed{
    background-color: #22c55e;
    padding-top: 2px;
    gap: 3px;
    padding-bottom: 2px;
}
    
.bgcertifed svg{
    fill:none;
}
.bgcertifed:hover{
  background-color:#f97a1f
}

.maincard-gemtone:hover{
  transform:translateY(-4px);
  transition:all 300ms ease;
  box-shadow: 0px 0px 13px 15px #ececec !important;
}
.hoverimg , 
.maincard-gemtone{
  transition:all 300ms ease;
}
.maincard-gemtone:hover .hoverimg{
  scale:1.2;
  transition:all 300ms ease;
}

/* CARD DESIGN */
.gemstone-collection-page-card {
  background: #fff;
  border: 2px solid #eee;
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.3s ease;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  position: relative;
  padding:1rem;
}
.gemstone-collection-page-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
  border-color: #f97a1f;
}
.mt-3x{
  margin-top:10px;
}

/* Image */
.gemstone-collection-page-image-wrapper {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}
.gemstone-collection-page-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.gemstone-collection-page-card:hover .gemstone-collection-page-image {
  transform: scale(1.1);
}

/* Badges */
.gemstone-collection-page-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 9999px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  gap: 4px;
}
.gemstone-collection-page-badge-red {
  background: #ef4444;
  animation: gemstone-pulse 1.5s infinite;
}
.gemstone-collection-page-badge-green {
  background: #22c55e;
}
.gemstone-collection-page-badge-top-left {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 10;
}
.gemstone-collection-page-badge-top-right {
  position: absolute;
  top: 12px;
  right: 12px;
}
.gemstone-collection-page-badge-bottom-left {
  position: absolute;
  bottom: 12px;
  left: 12px;
  background: #f97a1f;
  color: #fff;
  font-weight: bold;
  border-radius: 9999px;
  font-size: 11px;
  padding: 4px 10px;
}

@keyframes gemstone-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.6;
    transform: scale(1.1);
  }
}

/* Content */
.gemstone-collection-page-content {
  padding: 16px;
}
.gemstone-collection-page-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 6px;
  transition: color 0.3s ease;
}
.gemstone-collection-page-card:hover .gemstone-collection-page-title {
  color: #f97a1f;
}
.gemstone-collection-page-subinfo {
  color: #777;
  font-size: 13px;
  margin-bottom: 8px;
  display: flex;
  gap: 6px;
}

/* Rating */
.gemstone-collection-page-rating {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
}
.gemstone-collection-page-star {
  color:rgb(220, 108, 28);
}
.gemstone-collection-page-muted {
  color: #888;
}

/* Pricing */
.gemstone-collection-page-pricing {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 2px;
}
.gemstone-collection-page-price {
  font-size: 22px;
  color: #f97a1f;
  font-weight: 700;
}
.gemstone-collection-page-oldprice {
  font-size: 13px;
  text-decoration: line-through;
  color: #999;
}
.gemstone-collection-page-save {
  font-size: 11px;
  color: #16a34a;
  border: 1px solid #16a34a;
  border-radius: 9999px;
  padding: 2px 6px;
}

/* EMI */
.gemstone-collection-page-emi {
  font-size: 11px;
  color: #555;
  margin-top: 4px;
}

/* Buttons inside card */
.gemstone-collection-page-btn-primary,
.gemstone-collection-page-btn-secondary {
  width: 100%;
  border: none;
  border-radius: 8px;
  padding: 10px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}
.gemstone-collection-page-btn-primary {
  background: #f97a1f;
  color: white;
  margin-top: 10px;
  display:block;
  text-align:center;
}
.gemstone-collection-page-btn-primary:hover {
  background: rgb(220, 108, 28);
  transform: scale(1.03);
}
.gemstone-collection-page-btn-secondary {
  background: #fff;
  border: 1px solid #ddd;
  color: #333;
  margin-top: 8px;
  display:block;
  text-align:center;
}
.gemstone-collection-page-btn-secondary:hover {
  background: #f5f5f5;
}

/* Footer */
.gemstone-collection-page-footer {
  border-top: 1px solid #eee;
  margin-top: 10px;
  padding-top: 8px;
  font-size: 11px;
  color: #555;
  text-align: center;
}

/* Hide filters for now */
.product-filter-card-filters{
  display:none;
}

#mobile-navigation{
  display:none;
}

@media only screen and (max-width: 600px) {
  #mobile-navigation{
    display:block;
  }
  .product-filter-card-container{
    padding-top:0px !important;
  }
}

/* Optional: loading indicator */
#infinite-scroll-loading {
  text-align: center;
  font-size: 13px;
  color: #666;
  padding: 12px 0 24px;
}

.fnfgrid {
grid-template-columns:1fr 1fr 1fr 1fr !important;
}

@media (max-width:500px){

.fnfgrid {
grid-template-columns:1fr !important;
}
}

/* Component: as-offer-strip */

  html {
    scroll-behavior: smooth;
  }
.as-offer-strip{
  /* replaces bg-gradient-to-r from-orange-600 via-red-500 to-orange-600 */
  background: linear-gradient(90deg,
    hsl(18 85% 45%),
    hsl(0 78% 55%),
    hsl(18 85% 45%)
  );
  color: hsl(var(--primary-foreground));
  padding: 10px 16px; /* py-2.5 px-4 */
}

.as-offer-strip__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  display: flex;
  flex-direction: column; /* flex-col */
  align-items: center;
  justify-content: center;
  gap: 8px; /* gap-2 */
  font-size: 14px; /* text-sm */
}

@media (min-width: 640px){
  .as-offer-strip__container{
    flex-direction: row; /* sm:flex-row */
    gap: 24px; /* sm:gap-6 */
  }
}

.as-offer-strip__left,
.as-offer-strip__right{
  display: flex;
  align-items: center;
}

.as-offer-strip__left{ gap: 8px; }  /* gap-2 */
.as-offer-strip__right{ gap: 16px; } /* gap-4 */

.as-offer-strip__title{
  font-weight: 800; /* font-bold */
  letter-spacing: .02em;
}

.as-offer-strip__badge{
  display: inline-flex;
  align-items: center;
  gap: 4px; /* gap-1 */
  background: hsl(0 0% 0% / .20); /* bg-black/20 */
  border: 1px solid hsl(0 0% 100% / .18);
  border-radius: calc(var(--radius) * 1.5); /* rounded */
  padding: 4px 8px; /* px-2 py-1 */
  backdrop-filter: blur(6px);
}

.as-offer-strip__time{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* font-mono */
  font-weight: 800; /* font-bold */
  letter-spacing: .02em;
}

/* Icons */
.as-offer-strip__ic{
  display: inline-flex;
  width: 16px;
  height: 16px;
}
.as-offer-strip__ic svg{
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Sizes matching w-4 h-4 and w-3 h-3 */
.as-offer-strip__ic--sm{ width: 12px; height: 12px; }

/* Animate pulse (animate-pulse) */
@keyframes as-pulse{
  0%, 100%{ opacity: 1; transform: scale(1); }
  50%{ opacity: .6; transform: scale(1.06); }
}
.as-offer-strip__pulse{
  animation: as-pulse 1.2s ease-in-out infinite;
}

/* Better tap area for mobile */
.as-offer-strip a, .as-offer-strip button{
  color: inherit;
}


/* Component: as-certified-strip */
.as-certified-strip{
  background: hsl(var(--muted) / .50); /* bg-muted/50 */
  border-bottom: 1px solid hsl(var(--border)); /* border-b */
  padding: 8px 0; /* py-2 */
}

.as-certified-strip__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 16px; /* px-4 */
}

.as-certified-strip__row{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px; /* gap-1 */
  font-size: 12px; /* text-xs */
  color: hsl(var(--muted-foreground)); /* text-muted-foreground */
}

/* Icon */
.as-certified-strip__ic{
  width: 12px;  /* w-3 */
  height: 12px; /* h-3 */
  display: inline-flex;
  color: hsl(142 70% 35%); /* text-green-500 equivalent */
}
.as-certified-strip__ic svg{
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* Component: as-breadcrumb */
.as-breadcrumb{
  background: hsl(var(--muted) / .30); /* bg-muted/30 */
  border-bottom: 1px solid hsl(var(--border)); /* border-b */
}

.as-breadcrumb__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 12px 16px; /* px-4 py-3 */
}

.as-breadcrumb__row{
  display: flex;
  align-items: center;
  gap: 8px; /* gap-2 */
  font-size: 14px; /* text-sm */
  color: hsl(var(--muted-foreground));
  flex-wrap: wrap;
}

/* Buttons / links */
.as-breadcrumb__link{
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  transition: color .2s ease;
}
.as-breadcrumb__link:hover{
  color: hsl(var(--foreground)); /* hover:text-foreground */
}

/* Current item */
.as-breadcrumb__current{
  color: hsl(var(--foreground));
  font-weight: 500; /* font-medium */
}

/* Chevron icon */
.as-breadcrumb__ic{
  width: 16px; /* w-4 */
  height: 16px; /* h-4 */
  display: inline-flex;
  opacity: .7;
}
.as-breadcrumb__ic svg{
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Component: as-gem-hero */
.as-gem-hero{
  background:
    linear-gradient(135deg,
      hsl(30 80% 96%),
      hsl(42 90% 97% / .6),
      hsl(50 90% 96%)
    );
  border-bottom: 1px solid hsl(var(--border));
}

/* Container */
.as-gem-hero__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 40px 16px;
}
@media (min-width: 768px){
  .as-gem-hero__container{ padding: 56px 16px; }
}

/* Center wrapper */
.as-gem-hero__center{
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}

/* Trust pill */
.as-gem-hero__pill{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: hsl(var(--background) / .8);
  border: 1px solid hsl(var(--border));
  border-radius: 999px;
  box-shadow: var(--shadow-soft);
  margin-bottom: 24px;
  backdrop-filter: blur(6px);
}
.as-gem-hero__pill span{
  font-size: 14px;
  font-weight: 500;
}

/* Icons */
.as-gem-hero__ic{
  width: 16px;
  height: 16px;
  display: inline-flex;
}
.as-gem-hero__ic svg{
  width: 100%;
  height: 100%;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.as-gem-hero__ic--green{ color: hsl(142 70% 35%); }
.as-gem-hero__ic--amber{ color: hsl(42 85% 50%); }

/* Heading */
.as-gem-hero__title{
  margin: 0 0 16px;
  font-size: clamp(32px, 6vw, 56px);
  font-weight: 800;
  line-height: 1.1;
  background: linear-gradient(90deg,
    hsl(18 85% 45%),
    hsl(0 78% 55%),
    hsl(38 90% 50%)
  );
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Subtitle */
.as-gem-hero__desc{
  max-width: 720px;
  margin: 0 auto 24px;
  font-size: 18px;
  color: hsl(var(--muted-foreground));
}
.as-gem-hero__desc strong{
  color: hsl(var(--foreground));
  font-weight: 700;
}

/* Stats row */
.as-gem-hero__stats{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-bottom: 32px;
}
@media (min-width: 768px){
  .as-gem-hero__stats{ gap: 40px; }
}
.as-gem-hero__stat{
  text-align: center;
}
.as-gem-hero__stat-value{
  font-size: clamp(22px, 4vw, 30px);
  font-weight: 800;
  color: hsl(var(--primary));
}
.as-gem-hero__stat-label{
  font-size: 14px;
  color: hsl(var(--muted-foreground));
}

/* Feature icons */
.as-gem-hero__features{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 32px;
}
@media (min-width: 768px){
  .as-gem-hero__features{ gap: 48px; }
}

.as-gem-hero__feature{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.as-gem-hero__feature-ic-wrap{
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background: hsl(var(--primary) / .10);
  display: flex;
  align-items: center;
  justify-content: center;
}
.as-gem-hero__feature-ic{
  width: 24px;
  height: 24px;
  color: hsl(var(--primary));
}
.as-gem-hero__feature-ic svg{
  width: 100%;
  height: 100%;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.as-gem-hero__feature-label{
  font-size: 14px;
  font-weight: 500;
}

/* Component: as-sticky-tabs */
.as-sticky-tabs{
  position: sticky;        /* sticky */
  top: 0;                  /* top-0 */
  z-index: 50;             /* z-50 */
  background: hsl(var(--background) / .95); /* bg-background/95 */
  backdrop-filter: blur(16px);             /* backdrop-blur-lg */
  border-bottom: 1px solid hsl(var(--border)); /* border-b */
  box-shadow: 0 1px 0 hsl(var(--border) / .55), var(--shadow-soft); /* shadow-sm-ish */
  margin-top: 2rem;
    border-top: 1px solid #80808033;
    
}

.as-sticky-tabs__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 16px; /* px-4 */
}

/* Horizontal scroll row */
.as-sticky-tabs__row{
  display: flex;
  align-items: center;
  gap: 4px;          /* gap-1 */
  padding: 8px 0;    /* py-2 */
  overflow-x: auto;  /* overflow-x-auto */
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scrollbar-width: none; /* firefox hide */
}
.as-sticky-tabs__row::-webkit-scrollbar{ display: none; } /* chrome/safari hide */

/* Tab button base */
.as-sticky-tabs__tab{
  scroll-snap-align: start;
  display: inline-flex;
  align-items: center;
  gap: 6px;                 /* gap-1.5 */
  padding: 8px 16px;        /* px-4 py-2 */
  border-radius: 999px;     /* rounded-full */
  border: 1px solid transparent;
  background: transparent;
  color: hsl(var(--muted-foreground)); /* text-muted-foreground */
  font-size: 14px;          /* text-sm */
  font-weight: 600;         /* font-medium */
  white-space: nowrap;      /* whitespace-nowrap */
  cursor: pointer;
  transition: transform .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
}

.as-sticky-tabs__tab:hover{
  color: hsl(var(--foreground));           /* hover:text-foreground */
  background: hsl(var(--muted));           /* hover:bg-muted */
}

.as-sticky-tabs__tab:active{
  transform: translateY(0.5px);
}

/* Active state */
.as-sticky-tabs__tab.is-active,
.as-sticky-tabs__tab[aria-selected="true"]{
  background: hsl(var(--primary));         /* bg-primary */
  color: hsl(var(--primary-foreground));   /* text-primary-foreground */
  border-color: hsl(var(--primary) / .28);
  box-shadow: var(--shadow-primary);
}

/* Icons */
.as-sticky-tabs__ic{
  width: 16px; /* w-4 */
  height: 16px; /* h-4 */
  display: inline-flex;
}
.as-sticky-tabs__ic svg{
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Component: as-about-gems */
.as-about-gems{
  padding: 40px 0; /* py-10 */
  background: hsl(var(--muted) / .20); /* bg-muted/20 */
  border-bottom: 1px solid hsl(var(--border)); /* border-b */
}

.as-about-gems__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 16px; /* px-4 */
}

.as-about-gems__wrap{
  max-width: 896px; /* max-w-4xl */
  margin: 0 auto;
}

.as-about-gems__title{
  margin: 0 0 16px;
  font-size: 24px; /* text-2xl */
  font-weight: 800;
  letter-spacing: -0.01em;
}
@media (min-width: 768px){
  .as-about-gems__title{ font-size: 30px; } /* md:text-3xl */
}

.as-about-gems__desc{
  margin: 0 0 16px; /* mb-4 */
  color: hsl(var(--muted-foreground));
  line-height: 1.75; /* leading-relaxed */
  font-size: 16px;
}

/* Grid */
.as-about-gems__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px; /* gap-6 */
  margin-top: 24px; /* mt-6 */
}
@media (min-width: 768px){
  .as-about-gems__grid{
    grid-template-columns: 1fr 1fr; /* md:grid-cols-2 */
  }
}

/* Cards */
.as-about-gems__card{
  background: hsl(var(--background)); /* bg-background */
  border: 1px solid hsl(var(--border)); /* border */
  border-radius: 16px; /* rounded-xl */
  padding: 20px; /* p-5 */
  box-shadow: var(--shadow-soft);
}

.as-about-gems__card-title{
  margin: 0 0 8px; /* mb-2 */
  display: flex;
  align-items: center;
  gap: 8px; /* gap-2 */
  font-weight: 700; /* font-semibold */
  font-size: 18px; /* text-lg */
  color: hsl(var(--foreground));
}

.as-about-gems__card-text{
  margin: 0;
  font-size: 14px; /* text-sm */
  color: hsl(var(--muted-foreground));
  line-height: 1.6;
}

/* Icons */
.as-about-gems__ic{
  width: 20px; /* w-5 */
  height: 20px; /* h-5 */
  display: inline-flex;
  color: hsl(var(--primary)); /* text-primary */
}
.as-about-gems__ic svg{
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Component: as-gems-table */
.as-gems-table{
  padding: 40px 0; /* py-10 */
  border-bottom: 1px solid hsl(var(--border)); /* border-b */
  background: hsl(var(--background));
}

.as-gems-table__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 16px; /* px-4 */
}

.as-gems-table__title{
  margin: 0 0 24px; /* mb-6 */
  text-align: center;
  font-size: 24px; /* text-2xl */
  font-weight: 800;
  letter-spacing: -0.01em;
  color: hsl(var(--foreground));
}
@media (min-width: 768px){
  .as-gems-table__title{ font-size: 30px; } /* md:text-3xl */
}

.as-gems-table__subtitle{
  margin: 0 auto 32px; /* mb-8 */
  max-width: 672px; /* max-w-2xl */
  text-align: center;
  color: hsl(var(--muted-foreground));
  line-height: 1.7;
}

/* Horizontal scroll wrapper */
.as-gems-table__scroll{
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 14px;
  box-shadow: var(--shadow-soft);
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
}

/* Table */
.as-gems-table__table{
  width: 100%;
  border-collapse: collapse;
  min-width: 780px; /* gives room on mobile to scroll */
}

.as-gems-table__thead tr{
  background: hsl(var(--primary) / .10); /* bg-primary/10 */
}

.as-gems-table__th,
.as-gems-table__td{
  border: 1px solid hsl(var(--border));
  padding: 12px; /* p-3 */
  text-align: left;
  vertical-align: middle;
}

.as-gems-table__th{
  font-weight: 700; /* font-semibold */
  color: hsl(var(--foreground));
  white-space: nowrap;
}

.as-gems-table__td{
  color: hsl(var(--foreground));
  background: transparent;
}

.as-gems-table__tr--alt{
  background: hsl(var(--muted) / .30); /* bg-muted/30 */
}

/* Gemstone button (acts like a link) */
.as-gems-table__gem-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px; /* gap-2 */
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  cursor: pointer;
  color: hsl(var(--primary)); /* text-primary */
  font-weight: 600; /* font-medium */
  transition: opacity .2s ease;
}
.as-gems-table__gem-btn:hover{
  text-decoration: underline; /* hover:underline */
}
.as-gems-table__gem-img{
  width: 32px;  /* w-8 */
  height: 32px; /* h-8 */
  border-radius: 999px; /* rounded-full */
  object-fit: cover;
  border: 1px solid hsl(var(--border));
}

/* Color cell */
.as-gems-table__color{
  display: inline-flex;
  align-items: center;
  gap: 8px; /* gap-2 */
  color: hsl(var(--foreground));
}
.as-gems-table__swatch{
  width: 16px; /* w-4 */
  height: 16px; /* h-4 */
  border-radius: 999px; /* rounded-full */
  border: 1px solid hsl(var(--border));
  box-shadow: inset 0 0 0 1px hsl(0 0% 100% / .25);
}

/* Benefits (text-sm) */
.as-gems-table__benefit{
  font-size: 14px; /* text-sm */
  color: hsl(var(--muted-foreground));
  line-height: 1.6;
}

/* Planet cell - use SVG icons instead of emoji */
.as-gems-table__planet{
  display: inline-flex;
  align-items: center;
  gap: 6px; /* gap-1-ish */
  color: hsl(var(--foreground));
  white-space: nowrap;
}
.as-gems-table__planet-ic{
  width: 18px;
  height: 18px;
  display: inline-flex;
  color: hsl(var(--foreground));
  opacity: .9;
}
.as-gems-table__planet-ic svg{
  width: 100%;
  height: 100%;
  fill: currentColor;
}


/* Component: as-cert */
.as-cert{
  padding: 40px 0;               /* py-10 */
  border-bottom: 1px solid hsl(var(--border)); /* border-b */
  background: hsl(142 60% 96%);  /* like bg-green-50 */
}

/* Optional dark mode support if you use [data-theme="dark"] or .dark on html/body */
.dark .as-cert{
  background: hsl(142 35% 12% / .20); /* dark:bg-green-950/20 vibe */
}

.as-cert__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 16px; /* px-4 */
}

.as-cert__inner{
  max-width: 896px; /* max-w-4xl */
  margin: 0 auto;
  text-align: center;
}

.as-cert__title{
  margin: 0 0 16px; /* mb-4 */
  font-size: 24px;  /* text-2xl */
  font-weight: 800;
  letter-spacing: -0.01em;
  color: hsl(var(--foreground));
}
@media (min-width: 768px){
  .as-cert__title{ font-size: 30px; } /* md:text-3xl */
}

.as-cert__desc{
  margin: 0 auto 32px; /* mb-8 */
  max-width: 720px;
  color: hsl(var(--muted-foreground));
  line-height: 1.7;
}

.as-cert__grid{
  display: grid;
  gap: 16px; /* gap-6-ish */
}
@media (min-width: 768px){
  .as-cert__grid{
    grid-template-columns: repeat(3, minmax(0, 1fr)); /* md:grid-cols-3 */
    gap: 24px; /* gap-6 */
  }
}

.as-cert__card{
  background: hsl(var(--background));
  border: 1px solid hsl(var(--border));
  border-radius: 14px; /* rounded-xl */
  padding: 20px; /* p-5 */
  text-align: center;
  box-shadow: var(--shadow-soft);
}

.as-cert__icon{
  width: 40px;  /* w-10 */
  height: 40px; /* h-10 */
  margin: 0 auto 12px; /* mx-auto mb-3 */
  display: grid;
  place-items: center;
  color: hsl(142 72% 38%); /* text-green-500 */
}
.as-cert__icon svg{
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.as-cert__card-title{
  margin: 0 0 8px; /* mb-2 */
  font-weight: 700; /* font-semibold */
  color: hsl(var(--foreground));
}

.as-cert__card-text{
  margin: 0;
  font-size: 14px; /* text-sm */
  color: hsl(var(--muted-foreground));
  line-height: 1.6;
}
  /* ---------- Base helpers (safe defaults) ---------- */
    .as-gem-filter { --as-radius: 14px; --as-border: rgba(0,0,0,.10); --as-bg: var(--as-surface, #fff); --as-text: var(--as-text, #111); --as-muted: rgba(0,0,0,.55); --as-soft: rgba(0,0,0,.04); --as-soft-2: rgba(0,0,0,.06); --as-primary: var(--as-primary, #e78fb3); --as-primary-2: var(--as-primary-2, #d96c9c); --as-shadow: 0 10px 28px rgba(0,0,0,.08); --as-shadow-2: 0 18px 40px rgba(0,0,0,.12); color: var(--as-text); }
    .as-gem-filter * { box-sizing: border-box; }
    .as-gem-filter__container { width: min(1200px, calc(100% - 32px)); margin: 0 auto; padding: 0 16px; }
    .as-gem-filter__sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

    /* ---------- Sticky filter bar ---------- */
    .as-gem-filter__bar {
      position: sticky;
      top: {{ section.settings.sticky_offset | default: 48 }}px;
      z-index: 40;
      border-bottom: 1px solid var(--as-border);
      background: color-mix(in srgb, var(--as-bg) 92%, transparent);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      box-shadow: 0 1px 0 rgba(0,0,0,.04);
    }
    .as-gem-filter__bar-inner { padding: 16px 0; }

    .as-gem-filter__row { display:flex; align-items:center; gap: 12px; flex-wrap: wrap; justify-content: space-between; }
    .as-gem-filter__row + .as-gem-filter__row { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--as-border); }

    .as-gem-filter__group { display:flex; align-items:center; gap: 10px; flex-wrap: wrap; }
    .as-gem-filter__label { font-size: 13px; font-weight: 650; color: var(--as-muted); white-space: nowrap; }
    .as-gem-filter__chips { display:flex; gap: 8px; flex-wrap: wrap; }

    .as-gem-filter__chip {
      appearance:none;
      border: 1px solid var(--as-border);
      background: var(--as-soft);
      color: var(--as-muted);
      border-radius: 999px;
      padding: 6px 10px;
      font-size: 13px;
      line-height: 1;
      cursor: pointer;
      transition: transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
      user-select:none;
      display:inline-flex;
      align-items:center;
      gap: 8px;
    }
    .as-gem-filter__chip:hover { background: var(--as-soft-2); color: var(--as-text); transform: translateY(-1px); }
    .as-gem-filter__chip[aria-pressed="true"]{
      background: color-mix(in srgb, var(--as-primary) 18%, white);
      border-color: color-mix(in srgb, var(--as-primary) 50%, var(--as-border));
      color: var(--as-text);
      box-shadow: 0 10px 22px rgba(0,0,0,.06);
    }

    /* A–Z compact chips */
    .as-gem-filter__az .as-gem-filter__chip{
      width: 34px; height: 34px; justify-content:center; padding: 0; border-radius: 10px;
      font-weight: 700;
    }
    .as-gem-filter__az-wrap { display:flex; gap: 8px; overflow-x:auto; padding-bottom: 6px; }
    .as-gem-filter__az-wrap::-webkit-scrollbar { height: 6px; }
    .as-gem-filter__az-wrap::-webkit-scrollbar-thumb { background: rgba(0,0,0,.14); border-radius: 999px; }

    /* Color dots */
    .as-gem-filter__color {
      width: 28px; height: 28px;
      border-radius: 999px;
      padding: 0;
      justify-content:center;
    }
    .as-gem-filter__color[aria-pressed="true"]{ box-shadow: 0 0 0 3px color-mix(in srgb, var(--as-primary) 35%, transparent); }
    .as-gem-filter__color-dot { width: 100%; height: 100%; border-radius: 999px; border: 2px solid rgba(0,0,0,.10); }

    /* Viewing now pill */
    .as-gem-filter__viewing{
      display:flex; align-items:center; gap: 8px;
      background: rgba(220, 38, 38, .08);
      color: rgb(185, 28, 28);
      padding: 8px 12px;
      border-radius: 999px;
      font-size: 13px;
      font-weight: 650;
      align-self: center;
      border: 1px solid rgba(220, 38, 38, .20);
    }
    .as-gem-filter__pulse { position: relative; }
    .as-gem-filter__pulse:before{
      content:"";
      position:absolute; inset:-6px;
      border-radius: 999px;
      border: 2px solid rgba(220,38,38,.20);
      animation: asPulse 1.6s ease-in-out infinite;
      pointer-events:none;
    }
    @keyframes asPulse {
      0%{ transform: scale(.98); opacity:.75; }
      70%{ transform: scale(1.06); opacity:.15; }
      100%{ transform: scale(1.06); opacity:0; }
    }
    .as-gem-filter__icon { width: 16px; height:16px; stroke: currentColor; fill:none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

    /* Reset */
    .as-gem-filter__reset{
      appearance:none;
      border: 1px solid var(--as-border);
      background: var(--as-bg);
      color: var(--as-text);
      border-radius: 12px;
      padding: 8px 10px;
      font-size: 13px;
      font-weight: 650;
      cursor:pointer;
      display:inline-flex; align-items:center; gap: 8px;
      transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
    }
    .as-gem-filter__reset:hover{ background: var(--as-soft); transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0,0,0,.06); }

    /* ---------- Title section ---------- */
    .as-gem-filter__heading {
      padding: 24px 0;
      border-bottom: 1px solid var(--as-border);
      background: color-mix(in srgb, var(--as-bg) 88%, transparent);
    }
    .as-gem-filter__h2 { margin: 0; font-size: 26px; line-height: 1.2; font-weight: 850; text-align:center; }
    .as-gem-filter__p { margin: 8px auto 0 auto; max-width: 760px; text-align:center; color: var(--as-muted); }

    /* ---------- Grid ---------- */
    .as-gem-filter__grid-wrap{
      padding: 24px 0 44px 0;
      background: linear-gradient(180deg, color-mix(in srgb, var(--as-bg) 100%, transparent) 0%, color-mix(in srgb, var(--as-bg) 94%, #000 6%) 100%);
    }
    .as-gem-filter__grid{
      display:grid;
      grid-template-columns: 1fr;
      gap: 18px;
    }
    @media (min-width: 640px){ .as-gem-filter__grid{ grid-template-columns: repeat(2, 1fr); } }
    @media (min-width: 1024px){ .as-gem-filter__grid{ grid-template-columns: repeat(3, 1fr); } }
    @media (min-width: 1280px){ .as-gem-filter__grid{ grid-template-columns: repeat(4, 1fr); } }

    /* ---------- Card ---------- */
    .as-gem-card{
      border: 2px solid var(--as-border);
      border-radius: var(--as-radius);
      overflow:hidden;
      background: var(--as-bg);
      box-shadow: 0 6px 18px rgba(0,0,0,.06);
      transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
      cursor: pointer;
      position: relative;
      display:flex;
      flex-direction: column;
      min-height: 100%;
    }
    .as-gem-card:hover{
      transform: translateY(-4px);
      box-shadow: var(--as-shadow-2);
      border-color: color-mix(in srgb, var(--as-primary) 45%, var(--as-border));
    }

    .as-gem-card__media{
      position: relative;
      aspect-ratio: 1 / 1;
      background: linear-gradient(135deg, rgba(0,0,0,.04), rgba(0,0,0,.07));
      overflow:hidden;
    }
    .as-gem-card__img{
      width:100%; height:100%;
      object-fit: cover;
      transform: scale(1);
      transition: transform .6s ease;
      display:block;
    }
    .as-gem-card:hover .as-gem-card__img{ transform: scale(1.08); }

    .as-gem-card__overlay{
      position:absolute; inset:0;
      background: linear-gradient(180deg, rgba(0,0,0,.0) 0%, rgba(0,0,0,.45) 100%);
      opacity: 0;
      transition: opacity .45s ease;
    }
    .as-gem-card:hover .as-gem-card__overlay{ opacity: 1; }

    .as-gem-card__badges-left,
    .as-gem-card__badges-right{
      position:absolute; top: 12px; display:flex; flex-direction: column; gap: 8px;
      z-index: 2;
    }
    .as-gem-card__badges-left{ left: 12px; }
    .as-gem-card__badges-right{ right: 12px; align-items: flex-end; }

    .as-badge{
      display:inline-flex; align-items:center; gap: 8px;
      border-radius: 999px;
      padding: 6px 10px;
      font-size: 12px;
      font-weight: 750;
      line-height:1;
      border: 1px solid rgba(0,0,0,.08);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      box-shadow: 0 12px 24px rgba(0,0,0,.10);
      background: rgba(255,255,255,.88);
      color: var(--as-text);
      white-space: nowrap;
    }
    .as-badge--amber{ background: rgba(245, 158, 11, .92); color: #fff; border-color: rgba(245, 158, 11, .65); }
    .as-badge--green{ background: rgba(34, 197, 94, .92); color: #fff; border-color: rgba(34, 197, 94, .65); }
    .as-badge--glass{ background: rgba(255,255,255,.82); }
    .as-badge__icon{ width: 14px; height:14px; stroke: currentColor; fill:none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
    .as-badge__star{ fill: currentColor; stroke: currentColor; }

    .as-gem-card__bottom{
      position:absolute; left: 12px; right: 12px; bottom: 12px;
      z-index: 2;
    }
    .as-gem-card__bottom-pill{
      display:flex; align-items:center; justify-content: space-between; gap: 10px;
      background: rgba(0,0,0,.58);
      color: rgba(255,255,255,.92);
      border-radius: 12px;
      padding: 10px 12px;
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      border: 1px solid rgba(255,255,255,.12);
    }
    .as-gem-card__bottom-left{ display:flex; align-items:center; gap: 10px; }
    .as-gem-card__planet-dot{
      width: 22px; height: 22px;
      border-radius: 999px;
      display:inline-flex; align-items:center; justify-content:center;
      background: rgba(255,255,255,.14);
      border: 1px solid rgba(255,255,255,.18);
      font-size: 12px;
      font-weight: 850;
      letter-spacing: .3px;
    }
    .as-gem-card__bottom-right{ font-size: 12px; opacity: .9; }

    .as-gem-card__content{ padding: 14px 14px 16px 14px; display:flex; flex-direction: column; gap: 10px; }
    .as-gem-card__title{ margin:0; font-size: 18px; font-weight: 850; line-height: 1.2; transition: color .25s ease; }
    .as-gem-card:hover .as-gem-card__title{ color: var(--as-primary-2); }
    .as-gem-card__sub{ margin: 0; color: var(--as-muted); font-size: 13px; }
    .as-gem-card__price{ font-size: 13px; color: var(--as-muted); }
    .as-gem-card__price b{ font-size: 16px; color: var(--as-primary-2); }

    .as-gem-card__tags{ display:flex; flex-wrap: wrap; gap: 8px; }
    .as-gem-card__tag{
      background: color-mix(in srgb, var(--as-primary) 14%, white);
      color: color-mix(in srgb, var(--as-primary-2) 78%, #111 22%);
      border: 1px solid color-mix(in srgb, var(--as-primary) 30%, rgba(0,0,0,.08));
      border-radius: 999px;
      padding: 6px 10px;
      font-size: 12px;
      font-weight: 750;
      line-height:1;
    }

    .as-gem-card__actions{ display:flex; gap: 10px; margin-top: 2px; }
    .as-gem-card__btn{
      appearance:none;
      border: 1px solid var(--as-border);
      border-radius: 12px;
      padding: 10px 12px;
      height: 40px;
      cursor:pointer;
      display:inline-flex; align-items:center; justify-content:center; gap: 8px;
      font-size: 13px;
      font-weight: 800;
      transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
      text-decoration:none;
      user-select:none;
    }
    .as-gem-card__btn:hover{ transform: translateY(-1px); box-shadow: 0 12px 24px rgba(0,0,0,.08); }
    .as-gem-card__btn--primary{
      background: var(--as-primary-2);
      border-color: color-mix(in srgb, var(--as-primary-2) 60%, rgba(0,0,0,.10));
      color: #fff;
      flex: 1;
    }
    .as-gem-card__btn--ghost{
      background: var(--as-bg);
      color: var(--as-text);
      width: 40px;
    }
    .as-gem-card__btn-icon{ width: 16px; height:16px; stroke: currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

    /* Empty state */
    .as-gem-filter__empty{
      display:none;
      text-align:center;
      padding: 28px 14px;
      color: var(--as-muted);
    }

    
/* Component: as-types */
.as-types{
  padding: 40px 0; /* py-10 */
  border-top: 1px solid hsl(var(--border));  /* border-y */
  border-bottom: 1px solid hsl(var(--border));
  background: hsl(var(--muted) / .20); /* bg-muted/20 */
}

.as-types__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 16px; /* px-4 */
}

.as-types__title{
  margin: 0 0 24px; /* mb-6 */
  text-align: center;
  font-size: 24px; /* text-2xl */
  font-weight: 800;
  letter-spacing: -0.01em;
  color: hsl(var(--foreground));
}
@media (min-width: 768px){
  .as-types__title{ font-size: 30px; } /* md:text-3xl */
}

.as-types__grid{
  max-width: 1300px; /* max-w-5xl */
  margin: 0 auto;
  margin-top:1rem;
  display: grid;
  gap: 16px; /* gap-6-ish */
}
@media (min-width: 768px){
  .as-types__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)); /* md:grid-cols-2 */
    gap: 24px; /* gap-6 */
  }
}
@media (min-width: 1024px){
  .as-types__grid{
    grid-template-columns: repeat(4, minmax(0, 1fr)); /* lg:grid-cols-4 */
  }
}

.as-types__card{
  background: hsl(var(--background));
  border: 1px solid hsl(var(--border));
  border-radius: 14px; /* rounded-xl */
  padding: 20px; /* p-5 */
  text-align: center;
  box-shadow: var(--shadow-soft);
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}

.as-types__card:hover{
  box-shadow: var(--shadow-elevated);
  transform: translateY(-2px);
  border-color: hsl(var(--border) / .9);
}

.as-types__icon{
  width: 40px;  /* w-10 */
  height: 40px; /* h-10 */
  margin: 0 auto 12px; /* mx-auto mb-3 */
  display: grid;
  place-items: center;
}

.as-types__icon svg{
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.as-types__card-title{
  margin: 0 0 8px; /* mb-2 */
  font-weight: 700;
  color: hsl(var(--foreground));
}

.as-types__card-text{
  margin: 0;
  font-size: 14px; /* text-sm */
  color: hsl(var(--muted-foreground));
  line-height: 1.6;
}

/* Icon colors (match your Tailwind vibe) */
.as-types__icon--amber{ color: hsl(43 96% 45%); }  /* amber-500 */
.as-types__icon--purple{ color: hsl(270 80% 55%); } /* purple-500 */
.as-types__icon--blue{ color: hsl(217 91% 60%); }   /* blue-500 */
.as-types__icon--pink{ color: hsl(330 81% 60%); }   /* pink-500 */

/* Component: as-buying-guide */
.as-buying-guide{
  padding: 40px 0;               /* py-10 */
  border-bottom: 1px solid hsl(var(--border)); /* border-b */
  background: hsl(var(--background));
}

.as-buying-guide__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 16px; /* px-4 */
}

.as-buying-guide__title{
  margin: 0 0 24px; /* mb-6 */
  text-align: center;
  font-size: 24px;  /* text-2xl */
  font-weight: 800;
  letter-spacing: -0.01em;
  color: hsl(var(--foreground));
}
@media (min-width: 768px){
  .as-buying-guide__title{ font-size: 30px; } /* md:text-3xl */
}

.as-buying-guide__wrap{
  max-width: 896px; /* max-w-4xl */
  margin: 0 auto;
}

.as-buying-guide__grid{
  display: grid;
  gap: 16px;
}
@media (min-width: 768px){
  .as-buying-guide__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)); /* md:grid-cols-2 */
    gap: 24px; /* gap-6 */
  }
}

.as-buying-guide__item{
  display: flex;     /* flex */
  gap: 16px;         /* gap-4 */
  padding: 16px;     /* p-4 */
  border-radius: 14px; /* rounded-xl */
  background: hsl(var(--muted) / .30); /* bg-muted/30 */
  border: 1px solid hsl(var(--border) / .70);
  box-shadow: var(--shadow-soft);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.as-buying-guide__item:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow-elevated);
  border-color: hsl(var(--border));
}

.as-buying-guide__num{
  width: 40px;  /* w-10 */
  height: 40px; /* h-10 */
  flex: 0 0 auto; /* shrink-0 */
  border-radius: 999px; /* rounded-full */
  display: grid;
  place-items: center;
  font-weight: 800;
  color: hsl(var(--primary-foreground));
  background: hsl(var(--primary));
  box-shadow: 0 10px 24px hsl(var(--primary) / .25);
}

.as-buying-guide__content{
  min-width: 0;
}

.as-buying-guide__item-title{
  margin: 0 0 4px; /* mb-1 */
  font-weight: 700;
  color: hsl(var(--foreground));
}

.as-buying-guide__item-text{
  margin: 0;
  font-size: 14px; /* text-sm */
  line-height: 1.6;
  color: hsl(var(--muted-foreground));
}

/* Optional: add a tiny accent line on left (premium feel) */
.as-buying-guide__item{
  position: relative;
  overflow: hidden;
}
.as-buying-guide__item::before{
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 3px;
  border-radius: 999px;
  background: hsl(var(--primary) / .55);
  opacity: .9;
}

    .as-faq{
      background: hsl(var(--background));
      color: hsl(var(--foreground));
      font-family: Inter, sans-serif;
      padding: 44px 0;
    }

    .as-faq__container{
      max-width: 1000px;
      margin: 0 auto;
      padding: 0 16px;
    }

    .as-faq__title{
      margin: 0 0 16px;
      font-size: 22px;
      font-weight: 950;
      letter-spacing: -0.02em;
    }
    @media (min-width: 768px){
      .as-faq__title{ font-size: 28px; }
    }

    .as-faq__accordion{
      display: grid;
      gap: 12px;
    }

    .as-faq__item{
      border: 1px solid hsl(var(--border));
      background: hsl(var(--card));
      border-radius: calc(var(--radius) + 6px);
      box-shadow: var(--shadow-card);
      overflow: hidden;
    }

    .as-faq__header{ margin: 0; }

    .as-faq__trigger{
      width: 100%;
      text-align: left;
      padding: 14px 14px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;

      background: transparent;
      border: 0;
      cursor: pointer;

      font-size: 14px;
      font-weight: 900;
      color: hsl(var(--foreground));
    }

    .as-faq__trigger:focus{
      outline: none;
    }

    .as-faq__icon{
      width: 18px;
      height: 18px;
      flex: 0 0 auto;
      transition: transform .2s ease;
      color: hsl(var(--muted-foreground));
    }

    .as-faq__content{
      max-height: 0;
      overflow: hidden;
      transition: max-height .25s ease;
      border-top: 1px solid hsl(var(--border));
      display: none;
    }

    .as-faq__contentInner{
      padding: 12px 14px 14px;
      color: hsl(var(--muted-foreground));
      font-size: 13px;
      line-height: 1.65;
    }

    /* Open state */
    .as-faq__item.is-open .as-faq__icon{
      transform: rotate(180deg);
      color: hsl(var(--primary));
    }
    .as-faq__item.is-open .as-faq__content{
      display: block;
    }
    
/* Componen
t: as-trust-strip */
.as-trust-strip{
  padding: 48px 0; /* py-12 */
  background: hsl(var(--background));
  border-top: 1px solid hsl(var(--border));  /* border-y */
  border-bottom: 1px solid hsl(var(--border));
}

.as-trust-strip__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 16px; /* px-4 */
}

.as-trust-strip__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); /* grid-cols-2 */
  gap: 24px; /* gap-6 */
}
@media (min-width: 768px){
  .as-trust-strip__grid{
    grid-template-columns: repeat(4, minmax(0, 1fr)); /* md:grid-cols-4 */
  }
}

.as-trust-strip__item{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 12px; /* gap-3 */
}

.as-trust-strip__iconWrap{
  width: 56px;  /* w-14 */
  height: 56px; /* h-14 */
  border-radius: 999px; /* rounded-full */
  display: grid;
  place-items: center;
  background: hsl(var(--primary) / .10); /* bg-primary/10 */
  border: 1px solid hsl(var(--primary) / .18);
  box-shadow: var(--shadow-soft);
}

.as-trust-strip__icon{
  width: 28px; /* w-7 */
  height: 28px; /* h-7 */
  stroke: hsl(var(--primary));
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.as-trust-strip__title{
  margin: 0;
  font-weight: 700; /* font-semibold */
  color: hsl(var(--foreground));
}

.as-trust-strip__desc{
  margin: 0;
  font-size: 14px; /* text-sm */
  color: hsl(var(--muted-foreground));
  line-height: 1.5;
}

/* Optional: micro hover polish */
.as-trust-strip__item:hover .as-trust-strip__iconWrap{
  transform: translateY(-1px);
  transition: transform .2s ease, box-shadow .2s ease;
  box-shadow: var(--shadow-elevated);
}

/* Component: as-gem-cta */
.as-gem-cta{
  padding: 48px 0; /* py-12 */
  color: #fff;
  /* bg-gradient-to-r from-orange-600 via-red-500 to-orange-600 */
  background: linear-gradient(90deg, #ea580c 0%, #ef4444 50%, #ea580c 100%);
}

.as-gem-cta__container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 16px; /* px-4 */
  text-align: center;
}

.as-gem-cta__title{
  margin: 0 0 12px 0; /* mb-3 */
  font-weight: 800;
  line-height: 1.15;
  color:white;
  font-size: 24px; /* text-2xl */
}
@media (min-width: 768px){
  .as-gem-cta__title{ font-size: 30px; } /* md:text-3xl */
}

.as-gem-cta__desc{
  margin: 0 auto 24px auto; /* mb-6 */
  max-width: 640px; /* max-w-2xl */
  font-size: 18px; /* text-lg */
  line-height: 1.6;
  opacity: .9;
}

.as-gem-cta__actions{
  display: flex;
  flex-direction: column; /* flex-col */
  gap: 16px; /* gap-4 */
  justify-content: center;
  align-items: center;
}
@media (min-width: 640px){
  .as-gem-cta__actions{
    flex-direction: row; /* sm:flex-row */
  }
}

.as-gem-cta__btn{
  appearance: none;
  border: 1px solid transparent;
  border-radius: 12px;
  padding: 0 24px; /* px-8-ish */
  height: 44px; /* h-11 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, opacity .15s ease;
  outline: none;
}

.as-gem-cta__btn:focus-visible{
  box-shadow: 0 0 0 3px rgba(255,255,255,.35);
}

.as-gem-cta__btn--primary{
  background: #fff;
  color: #ea580c; /* text-orange-600 */
  box-shadow: var(--shadow-elevated);
}
.as-gem-cta__btn--primary:hover{
  opacity: .92; /* hover:bg-white/90 feel */
  transform: translateY(-1px);
}

.as-gem-cta__btn--ghost{
  background: transparent;
  color: #fff;
  border-color: rgba(255,255,255,.9); /* border-white */
}
.as-gem-cta__btn--ghost:hover{
  background: rgba(255,255,255,.10); /* hover:bg-white/10 */
  transform: translateY(-1px);
}

.as-gem-cta__icon{
  width: 20px; /* w-5 */
  height: 20px; /* h-5 */
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}