
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; font-feature-settings: 'ss01','ss02'; }

#site-header.scrolled {
  background: rgba(250, 247, 239, 0.85);
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  box-shadow: 0 8px 32px -16px rgba(31, 42, 36, 0.18);
}
.nav-link { position: relative; transition: color .3s; }
.nav-link::after {
  content: ''; position: absolute; left: 0; bottom: -6px;
  width: 0; height: 1px; background: #2F5D3A; transition: width .35s ease;
}
.nav-link:hover { color: #2F5D3A; }
.nav-link:hover::after { width: 100%; }

.logo {
  display: inline-flex; align-items: center; gap: .75rem;
  text-decoration: none;
}
.logo-mark {
  display: block;
  filter: drop-shadow(0 4px 10px rgba(47,93,58,.25));
  transition: transform .6s cubic-bezier(.2,.7,.2,1);
}
.logo:hover .logo-mark { transform: rotate(-6deg) scale(1.06); }
.logo-text { display: flex; flex-direction: column; line-height: 1; }
.logo-name {
  font-family: 'Fraunces', serif;
  font-weight: 400;
  font-size: 22px;
  letter-spacing: .04em;
  color: #1F2A24;
  font-variation-settings: "SOFT" 50, "WONK" 1;
}
.logo-sub {
  margin-top: 4px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px;
  letter-spacing: .3em;
  text-transform: lowercase;
  color: #5D6B61;
}

.reveal { opacity: 0; transform: translateY(32px); transition: opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }

.hero-photo {
  position: relative;
  aspect-ratio: 1/1;
  max-width: 380px;
  margin: 0 auto;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(circle at 50% 45%, rgba(200,222,193,.55) 0%, rgba(250,247,239,0) 65%);
}
@media (min-width: 1024px) {
  .hero-photo { aspect-ratio: 4/5; max-width: none; }
}
.hero-photo::before {
  content: '';
  position: absolute; inset: -10% -10% auto -10%; height: 70%;
  background: radial-gradient(ellipse at 50% 30%, rgba(111,165,106,.18), transparent 70%);
  filter: blur(20px);
  z-index: 0;
}
.hero-photo img {
  position: relative; z-index: 1;
  width: 100%; height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 30px 40px rgba(47,93,58,.25)) contrast(1.04) saturate(1.06);
}

@keyframes floaty {
  0%,100% { transform: translateY(0) rotate(0); }
  50%     { transform: translateY(-14px) rotate(-.4deg); }
}
.floaty { animation: floaty 7s ease-in-out infinite; }

.quality-card {
  position: relative;
  background: #FAF7EF;
  border: 1px solid rgba(47, 93, 58, 0.12);
  border-radius: 1.5rem;
  padding: 2rem 1.75rem;
  transition: transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s, border-color .5s, background .5s;
  overflow: hidden;
}
.quality-card::before {
  content: ''; position: absolute; inset: auto -40% -60% auto;
  width: 16rem; height: 16rem; border-radius: 50%;
  background: radial-gradient(circle, rgba(111,165,106,.35), transparent 70%);
  opacity: 0; transition: opacity .6s;
}
.quality-card:hover {
  transform: translateY(-6px);
  border-color: rgba(47, 93, 58, 0.35);
  box-shadow: 0 24px 48px -28px rgba(47, 93, 58, .35);
  background: #fff;
}
.quality-card:hover::before { opacity: 1; }
.q-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; letter-spacing: .25em;
  color: #6FA56A; margin-bottom: 1.5rem;
}
.q-title {
  font-family: 'Fraunces', serif; font-weight: 400;
  font-size: 1.85rem; color: #1F2A24; margin-bottom: .75rem;
  font-variation-settings: "SOFT" 50;
}
.q-text { color: #5D6B61; line-height: 1.7; font-size: 14.5px; }

.pair-card {
  position: relative; overflow: hidden; border-radius: 1.5rem;
  aspect-ratio: 4/3; background: #F3EEE2;
}
.pair-card img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.2s cubic-bezier(.2,.7,.2,1);
}
.pair-card:hover img { transform: scale(1.06); }
.pair-card figcaption {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 1.25rem 1.5rem;
  background: linear-gradient(to top, rgba(31,42,36,.88), rgba(31,42,36,0));
  color: #FAF7EF;
  display: flex; flex-direction: column; gap: .5rem;
}
.pair-card .tag {
  align-self: flex-start;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .35em; text-transform: uppercase;
  background: rgba(250,247,239,.18); backdrop-filter: blur(6px);
  padding: .35rem .7rem; border-radius: 999px;
  border: 1px solid rgba(250,247,239,.25);
}
.pair-card .tag-gold { background: rgba(184,153,104,.3); border-color: rgba(184,153,104,.5); }
.pair-card .cap { font-family: 'Fraunces', serif; font-weight: 400; font-size: 1.25rem; }

.stone-card {
  background: #FAF7EF;
  border-radius: 1.5rem; overflow: hidden;
  border: 1px solid rgba(47, 93, 58, .1);
  transition: transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s, border-color .5s;
  display: flex; flex-direction: column; height: 100%;
}
.stone-card:hover {
  transform: translateY(-8px);
  border-color: rgba(47, 93, 58, .35);
  box-shadow: 0 32px 56px -32px rgba(47, 93, 58, .4);
}
.stone-img {
  aspect-ratio: 1/1; overflow: hidden;
  background: linear-gradient(135deg, #E6DDC8, #C8DEC1);
}
.stone-img img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.4s cubic-bezier(.2,.7,.2,1);
}
.stone-card:hover .stone-img img { transform: scale(1.08); }
.stone-meta { padding: 1.5rem 1.5rem 1.75rem; }
.stone-name {
  font-family: 'Fraunces', serif; font-weight: 400;
  font-size: 1.5rem; color: #1F2A24; margin-bottom: .5rem;
  font-variation-settings: "SOFT" 50;
}
.stone-spec {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; color: #5D6B61; letter-spacing: .04em; margin-bottom: 1rem;
}
.stone-price {
  font-family: 'Fraunces', serif;
  font-weight: 500;
  font-size: 1.35rem; color: #2F5D3A;
}

.catalog-swiper { padding-bottom: 1rem; overflow: visible; }
.catalog-swiper .swiper-slide { height: auto; }
.swiper-pagination-bullet { background: #2F5D3A; opacity: .25; }
.swiper-pagination-bullet-active { opacity: 1; width: 28px; border-radius: 999px; transition: width .3s; }

.faq-item {
  border: 1px solid rgba(47, 93, 58, .15);
  border-radius: 1.25rem;
  background: #FAF7EF;
  padding: 0 1.5rem;
  transition: border-color .3s, background .3s;
}
.faq-item[open] { border-color: rgba(47, 93, 58, .4); background: #fff; }
.faq-item summary {
  list-style: none; cursor: pointer;
  padding: 1.4rem 0;
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem;
  font-family: 'Fraunces', serif; font-weight: 400;
  font-size: 1.25rem; color: #1F2A24;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item .plus {
  width: 32px; height: 32px; border-radius: 50%;
  border: 1px solid rgba(47, 93, 58, .35);
  display: inline-flex; align-items: center; justify-content: center;
  color: #2F5D3A; font-size: 1.1rem;
  transition: transform .3s, background .3s, color .3s;
  flex-shrink: 0;
}
.faq-item[open] .plus { transform: rotate(45deg); background: #2F5D3A; color: #FAF7EF; }
.faq-item p { color: #5D6B61; line-height: 1.75; padding: 0 0 1.4rem; font-size: 15px; max-width: 56ch; }

.contact-row {
  display: flex; align-items: center; gap: 1rem;
  padding: 1rem 0;
  border-bottom: 1px solid rgba(250, 247, 239, .12);
  text-decoration: none; color: inherit;
  transition: padding .3s;
}
.contact-row:hover { padding-left: .5rem; }
.contact-row .ico {
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(250, 247, 239, .1);
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.contact-row .lab {
  display: block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .25em; text-transform: lowercase;
  opacity: .7;
}
.contact-row .val {
  display: block;
  font-family: 'Fraunces', serif; font-weight: 400;
  font-size: 1.25rem; margin-top: 2px;
}

.info-pill {
  display: flex; gap: .75rem; align-items: flex-start;
  background: rgba(200, 222, 193, .12);
  border: 1px solid rgba(200, 222, 193, .25);
  border-radius: 1rem;
  padding: .85rem 1rem;
  font-size: 12.5px;
  line-height: 1.55;
  color: rgba(250, 247, 239, .9);
}
.info-pill svg { flex-shrink: 0; margin-top: 2px; color: #C8DEC1; }
.info-pill b { color: #fff; font-weight: 500; }

.f-lab {
  display: block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: .25em; text-transform: lowercase;
  opacity: .75; margin-bottom: .5rem;
}
.f-inp {
  width: 100%; background: transparent;
  border: none; border-bottom: 1px solid rgba(250, 247, 239, .25);
  color: #FAF7EF; padding: .6rem 0;
  font-family: inherit; font-size: 15px;
  transition: border-color .3s; outline: none;
}
.f-inp:focus { border-color: #C8DEC1; }
.f-inp::placeholder { color: rgba(250, 247, 239, .35); }
textarea.f-inp { resize: vertical; }

#contact ::selection { background: #C8DEC1; color: #1F2A24; }

@media (max-width: 768px) {
  h1 { font-size: 3rem !important; }
  .pair-card { aspect-ratio: 4/5; }
}
