/* Card and collection components. */
.card-grid h3,
.zodiac-grid b,
.element-cards h3,
.five-grid b,
.product-grid h3,
.product-grid > article > b,
.products section > b,
.blog-grid b,
.related b {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.01em;
}

.card-grid p,
.zodiac-grid small,
.element-cards p,
.product-grid p,
.products small {
  font-family: var(--font-body);
}
.journeys--home .card-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:13px;
}
.journeys--home .journey-card{
  display:grid;
  grid-template-rows:1fr auto;
  gap:12px;
  padding:12px 10px;
  border:1px solid var(--line);
  border-radius:7px;
  background:#fff;
}
.journeys--home .card-main{
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  align-items:start;
  gap:9px;
}
.journeys--home .card-main img{
  width:64px;
  height:64px;
  object-fit:contain;
}
.journeys--home .card-grid h3{
  margin:0 0 4px;
  font-size:16px;
  font-weight:400;
}
.journeys--home .card-grid p{
  min-height:0;
  margin:0;
  font-size:14px;
  line-height:1.45;
}
.journeys--home .card-action{
  justify-self:start;
  padding-inline:10px;
}
:is(.zodiac--home,.elements--home,.tools--home,.symbols--home,.products--home,.guides--home,.trust--home,.faq--home) .section-intro>a,.zodiac--home .feature-wide a{display:block;color:#83501f;font-size:16px;margin-top:8px}
.zodiac--home .zodiac-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.zodiac--home .zodiac-trigger{
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  grid-template-rows:auto auto;
  align-items:center;
  align-content:center;
  column-gap:10px;
  min-width:0;
  border:1px solid var(--line);
  border-radius:7px;
  color:var(--ink);
  background:#fff;
  font:inherit;
  text-align:left;
  cursor:pointer;
  transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease;
}
.zodiac--home .zodiac-trigger:hover,.zodiac--home .zodiac-trigger.is-active{border-color:#c58a45;background:#fff9ef;box-shadow:0 2px 10px rgba(151,101,46,.1)}
.zodiac--home .zodiac-trigger:focus-visible{outline:3px solid rgba(197,138,69,.35);outline-offset:2px}
.zodiac--home .zodiac-grid img{grid-column:1;grid-row:1/3;align-self:center;width:64px;height:64px;object-fit:contain}
.zodiac--home .zodiac-grid b,.zodiac--home .zodiac-grid p{grid-column:2;min-width:0;color:var(--ink);overflow-wrap:break-word}
.zodiac--home .zodiac-grid p{margin:2px 0 0;font-size:16px}
.zodiac--home .feature-wide{position:relative;margin-top:10px;border:1px solid var(--line);border-radius:7px;overflow:hidden;background:#fff}
.zodiac--home .feature-slide{display:grid;grid-template-columns:48% 52%;height:auto}
.zodiac--home .feature-wide img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.zodiac--home .feature-copy{padding:12px 54px 12px 27px}
.zodiac--home .feature-wide h3{font:400 16px "Be Vietnam Pro";margin:0 0 5px}
.zodiac--home .feature-wide p{font-size:16px;line-height:1.5;margin:4px 0}
.zodiac--home .feature-wide em{font-style:normal;border:1px solid #d7aa78;border-radius:10px;padding:2px 7px;color:#9b652e}
.zodiac--home .feature-wide a{margin-top:3px}
.zodiac--home .swiper-button-prev,.zodiac--home .swiper-button-next{display:flex;flex:0 0 32px;width:32px;min-width:32px;max-width:32px;height:32px;min-height:32px;max-height:32px;margin-top:-16px;padding:0;box-sizing:border-box;border:1px solid #d7aa78;border-radius:50%;background:rgba(255,255,255,.94);color:#a4672d;font-size:12px;line-height:1;box-shadow:0 2px 8px rgba(83,53,26,.12);appearance:none}
.zodiac--home .swiper-button-prev{left:10px}
.zodiac--home .swiper-button-next{right:10px}
.zodiac--home .swiper-button-prev i,.zodiac--home .swiper-button-next i{display:block;font-size:12px;line-height:1}
.zodiac--home .swiper-button-prev:hover,.zodiac--home .swiper-button-next:hover{border-color:#b87831;background:#fff4e4;color:#8f5924}
.zodiac--home .swiper-button-prev:focus-visible,.zodiac--home .swiper-button-next:focus-visible{outline:3px solid rgba(197,138,69,.35);outline-offset:2px}
.elements--home .elements,.tools--home .tools,.symbols--home .symbols,.products--home .products,.guides--home .guides{padding-top:10px}
.elements--home .element-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.elements--home .element-card{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;height:204px;padding:9px 5px;border:1px solid var(--line);border-radius:7px;background:#fff;color:inherit;text-align:center;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}.elements--home .element-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(87,54,27,.08)}
.elements--home .element-card>img{width:115px;height:115px;margin-bottom:2px;border-radius:50%;object-fit:cover}
.elements--home .element-card h3{margin:1px 0;font:500 16px/1.3 var(--font-body)}
.elements--home .element-card p{margin:0;font-size:16px;line-height:1.35;white-space:nowrap}
.elements--home .element-card--metal{--element-color:#c39b4a;--element-soft:#f4ead8;--swatch-1:#d9b35d;--swatch-2:#f0c65d;--swatch-3:#b9b7b1;--swatch-4:#ddd9cf}
.elements--home .element-card--wood{--element-color:#557d36;--element-soft:#e9f0df;--swatch-1:#5d511c;--swatch-2:#818b36;--swatch-3:#3e7451;--swatch-4:#a9b9ac}
.elements--home .element-card--water{--element-color:#5d8fa7;--element-soft:#e0edf2;--swatch-1:#3a718e;--swatch-2:#679bb2;--swatch-3:#9ab9c7;--swatch-4:#596b82}
.elements--home .element-card--fire{--element-color:#dc5035;--element-soft:#f9e3da;--swatch-1:#dc4935;--swatch-2:#ed6246;--swatch-3:#c93a2b;--swatch-4:#e88965}
.elements--home .element-card--earth{--element-color:#a56d2e;--element-soft:#f1e2cd;--swatch-1:#75400e;--swatch-2:#a76b22;--swatch-3:#c18a38;--swatch-4:#d7ac65}
.elements--home .element-palette{display:flex;justify-content:center;gap:6px;margin-top:7px}
.elements--home .element-palette b{display:block;width:10px;height:10px;border-radius:50%;background:var(--swatch-1)}
.elements--home .element-palette b:nth-child(2){background:var(--swatch-2)}
.elements--home .element-palette b:nth-child(3){background:var(--swatch-3)}
.elements--home .element-palette b:nth-child(4){background:var(--swatch-4)}
.tools--home .tool-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.tools--home .tool-grid a{min-height:82px;border:1px solid var(--line);border-radius:7px;display:flex;align-items:center;gap:10px;padding:8px 10px;background:#fff}
.tools--home .tool-grid img{flex:0 0 64px;width:64px;height:64px;border-radius:50%;object-fit:cover}
.tools--home .tool-grid b{font:400 16px/1.35 "Be Vietnam Pro";color:var(--ink)}
.products--home .product-grid{display:grid;grid-template-columns:repeat(4,1fr) 1.15fr;gap:7px}
.products--home .product-grid img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.products--home .product-grid aside p{display:flex;align-items:flex-start;gap:8px;margin:0 0 12px;font-size:16px;line-height:1.45}
.products--home .product-grid aside img{flex:0 0 32px;width:32px;height:32px;aspect-ratio:1/1;border-radius:50%;object-fit:cover}
.products--home .product-grid h3{font:400 16px "Be Vietnam Pro";margin:5px 8px 2px}
.products--home .home-product-card{display:block;overflow:hidden;border:1px solid var(--line);border-radius:7px;background:#fff;color:inherit;text-decoration:none}.products--home .home-product-card>b,.products--home .home-product-card>span{display:block;margin:3px 8px;font-size:14px}.products--home .home-product-card>b{color:#765000;font-size:16px}.products--home .home-product-card>span{margin-bottom:9px;color:#83501f}
.guides--home .blog-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.guides--home .blog-grid>a{display:block;color:inherit;text-decoration:none}
.guides--home .blog-grid article{border:1px solid var(--line);border-radius:5px;overflow:hidden}
.guides--home .blog-grid img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.guides--home .blog-grid b{display:block;font:400 16px/1.3 "Be Vietnam Pro";padding:5px}
.trust--home .trust-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 24px}
.trust--home .trust-card{padding:12px;border:1px solid var(--line);border-radius:6px;background:#fffdfa}
.trust--home .trust-card-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.trust--home .trust-card-head img{width:32px;height:32px;object-fit:contain;flex:0 0 32px}
.trust--home .trust-card h3{margin:0;font-size:16px;font-weight:600;line-height:1.35}
.trust--home .trust-card p{margin:0;font-size:16px;line-height:1.5}
.trust--home .trust-people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.trust--home .trust-person{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px}
.trust--home .trust-person .avatar{margin-bottom:10px}
.trust--home .trust-role{font-size:14px;line-height:1.4}
.trust--home .trust-name{font-size:16px;font-weight:600;line-height:1.4}
:is(.faq--home,.faq--zodiac) .faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
:is(.faq--home,.faq--zodiac) .faq-grid details{min-height:64px;padding:0 16px;border-radius:var(--radius-md);background:#fffdfa;transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}
:is(.faq--home,.faq--zodiac) .faq-grid details:hover{border-color:#d8b58f;background:#fff}
:is(.faq--home,.faq--zodiac) .faq-grid summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:62px;font-size:16px;font-weight:500;line-height:1.45}
:is(.faq--home,.faq--zodiac) .faq-grid summary::after{content:"+";display:grid;flex:0 0 28px;width:28px;height:28px;border:1px solid #dfc4a5;border-radius:50%;place-items:center;float:none;font-size:18px;font-weight:400;line-height:1;color:var(--gold)}
:is(.faq--home,.faq--zodiac) .faq-grid details[open] summary::after{content:"−"}
:is(.faq--home,.faq--zodiac) .faq-grid summary:focus-visible{outline:0;border-radius:4px;box-shadow:0 0 0 3px var(--button-focus)}
.journeys--home .journeys .container,.story--home .story .container,.zodiac--home .zodiac .container,.elements--home .elements .container,.tools--home .tools .container,.symbols--home .symbols .container,.products--home .products .container,.guides--home .guides .container,.trust--home .container,.faq--home .container{
  padding-left: 4.35%;
  padding-right: 6.9%;
}
.story--home .story p,:is(.zodiac--home,.elements--home,.tools--home,.symbols--home,.products--home,.guides--home,.trust--home,.faq--home) .section-intro p,.zodiac--home .feature-wide p,
:is(.zodiac--home,.elements--home,.tools--home,.symbols--home,.products--home,.guides--home,.trust--home,.faq--home) .section-intro > a,.zodiac--home .feature-wide a{
  font-size: 16px;
}
.zodiac--home .zodiac-trigger{
  min-height: 82px;
  padding: 8px 10px;
}
.zodiac--home .zodiac-grid b,.zodiac--home .zodiac-grid p{
  line-height: 1.35;
}
.zodiac--home .zodiac-grid b{font-size:16px}
@media (prefers-reduced-motion:reduce){.zodiac--home .zodiac-trigger{transition:none}.zodiac--home .swiper-wrapper{transition-duration:0ms!important}}
.elements--home .intro-row{
  grid-template-columns:minmax(250px,20%) minmax(0,1fr);
}
.elements--home .intro-row.intro-row--full{
  grid-template-columns:minmax(0,1fr);
}
.elements--home .section-intro>a{white-space:nowrap}
.article--zodiac .main-column h2{font-size:14px;margin:0 0 8px}
.article--zodiac .intro h2{margin:0 0 12px;font-size:18px;font-weight:600;line-height:1.4}
.article--zodiac .tools-banner{border-radius:6px;width:100%}
.article--zodiac .zodiac-block,.article--zodiac .elements,.article--zodiac .birthdays,.article--zodiac .popular{margin-top:var(--main-gap)}
.article--zodiac .zodiac-block>h2{margin:0 0 16px;font-size:18px;font-weight:600;line-height:1.4}
.article--zodiac .zodiac-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.article--zodiac .zodiac-card{display:grid;grid-template-columns:64px minmax(0,1fr);grid-template-rows:auto auto auto;align-content:start;align-items:start;column-gap:10px;row-gap:6px;min-height:174px;padding:12px;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa}
.article--zodiac .zodiac-card>img{width:64px;height:64px;object-fit:contain}
.article--zodiac .zodiac-card-head{grid-column:2;grid-row:1;display:flex;flex-direction:column;gap:0}
.article--zodiac .zodiac-card h3{margin:0;font-size:16px;font-weight:600;line-height:1.25}
.article--zodiac .zodiac-card p{margin:0;font-size:14px;line-height:1.45}
.article--zodiac .zodiac-card .zodiac-meta{display:flex;height:auto;min-height:0;margin:0;flex-direction:column;justify-content:flex-start;gap:0;color:#76665b;line-height:1.25}
.article--zodiac .zodiac-card .zodiac-meta span{display:block;margin:0;padding:0;line-height:1.25}
.article--zodiac .zodiac-description{grid-column:1/-1;grid-row:2}
.article--zodiac .zodiac-card>a{grid-column:1/-1;grid-row:3;display:inline-flex;align-items:center;gap:6px;width:max-content;color:#a4692d;font-size:14px;font-weight:500}
.article--zodiac .elements>h2{margin:0 0 16px;font-size:18px;font-weight:600;line-height:1.4}
.article--zodiac .element-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.article--zodiac .element-card{min-height:142px;padding:12px;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa}
.article--zodiac .element-card-head{display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:10px}
.article--zodiac .element-icon{display:block;width:48px;height:48px;object-fit:contain}
.article--zodiac .element-card h3{margin:0;font-size:16px;font-weight:600;line-height:1.3}
.article--zodiac .element-card p{margin:0;font-size:14px;line-height:1.45}
.article--zodiac .element-signs{color:#76665b}
.article--zodiac .element-card p.element-description{margin-top:8px}
.article--zodiac .popular>h2{margin:0 0 16px;font-size:18px;font-weight:600;line-height:1.4}
.article--zodiac .post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.article--zodiac .popular-card{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:12px;min-height:132px;padding:12px;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa}
.article--zodiac .popular-card img{width:96px;height:96px;border-radius:5px;object-fit:cover}
.article--zodiac .popular-card h3{margin:0;font-size:16px;font-weight:600;line-height:1.35}
.article--zodiac .popular-card p{margin:4px 0;font-size:14px;line-height:1.4}
.article--zodiac .popular-card a{display:inline-flex;align-items:center;gap:6px;color:#a4692d;font-size:14px;font-weight:500}
.tools--zodiac>.container{padding-right:368px}
.tools--zodiac .head h2{margin:0 0 16px;font-size:18px;font-weight:600;line-height:1.4}
.tools--zodiac .tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tools--zodiac .tool-card{display:grid;grid-template-columns:80px minmax(0,1fr);align-items:center;gap:10px;min-height:152px;padding:12px;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa}
.tools--zodiac .tool-card img{width:80px;height:80px;border-radius:50%;object-fit:cover}
.tools--zodiac .tool-card h3{margin:0;font-size:16px;font-weight:600;line-height:1.35}
.tools--zodiac .tool-card p{margin:4px 0 8px;font-size:14px;line-height:1.4}
.tools--zodiac .tool-card .btn{padding-inline:12px;font-size:14px}
.products--zodiac>.container{padding-right:368px}
.products--zodiac .head h2{margin:0 0 16px;font-size:18px;font-weight:600;line-height:1.4}
.products--zodiac .product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.products--zodiac .product-card{position:relative;min-height:180px;overflow:hidden;border-radius:var(--radius-md);background:#21170f;color:#fff}
.products--zodiac .product-card:after{position:absolute;z-index:1;inset:20% 0 0;background:linear-gradient(transparent,rgba(24,16,12,.96));content:""}
.products--zodiac .product-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.products--zodiac .product-card-copy{position:absolute;z-index:2;right:12px;bottom:12px;left:12px}
.products--zodiac .product-card h3{margin:0;font-size:16px;font-weight:600;line-height:1.35}
.products--zodiac .product-card p{margin:3px 0 8px;font-size:14px;line-height:1.4}
.products--zodiac .product-card .btn{padding-inline:12px;font-size:14px}
.related--zodiac .related-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.related--zodiac .related-card{overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.related--zodiac .related-card:hover{border-color:#d8b58f;box-shadow:0 4px 14px rgba(83,53,26,.1);transform:translateY(-2px)}
.related--zodiac .related-card img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.related--zodiac .related-card h3{margin:0;padding:10px 12px 12px;font-size:16px;font-weight:500;line-height:1.4}
.related--zodiac .related-card:focus-visible{outline:0;box-shadow:0 0 0 3px var(--button-focus)}
.article--elements .main-column h2,.tools--elements .tools h2,.products--elements .products h2,:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .faq h2,.related--elements .related h2{font-size:14px;margin:0 0 8px}
.article--elements .tools-banner{border-radius:6px;width:100%}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .zodiac-block,:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .elements,:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .birthdays,.article--elements .popular{margin-top:10px}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .zodiac-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .zodiac-grid article{height:89px;border:1px solid var(--line);border-radius:7px;padding:9px;display:flex;gap:9px}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .zodiac-grid i{font:24px "Be Vietnam Pro";color:#b6752e}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .zodiac-grid b{display:block;font:14px "Be Vietnam Pro"}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .zodiac-grid small{font-size:14px}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .zodiac-grid p{height:25px;margin:5px 0 0}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .zodiac-grid a{color:#a4692d;font-weight:500}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .element-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .element-grid article{height:59px;border:1px solid var(--line);border-radius:6px;padding:7px;font-size:14px}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .element-grid b{font:14px "Be Vietnam Pro"}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .element-grid p,:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .element-grid small{font-size:14px;margin:2px 0;display:block}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .post-grid article{height:65px;border:1px solid var(--line);border-radius:6px;padding:6px;display:grid;grid-template-columns:57px 1fr;gap:7px}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .post-grid img{width:57px;height:52px;object-fit:cover;border-radius:4px}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .post-grid b{font:14px "Be Vietnam Pro"}
:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .post-grid p{font-size:14px;margin:2px 0}
.tools--elements .tools,.products--elements .products,.method--elements .method,:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .faq{padding-top:9px}
.tools--elements .tools .content{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.tools--elements .tool-grid article{height:64px;border:1px solid var(--line);border-radius:7px;padding:8px;font-size:18px;color:#be8750}
.tools--elements .tool-grid b{font:14px "Be Vietnam Pro";color:var(--ink)}
.tools--elements .tool-grid p{font-size:14px;color:var(--ink);margin:2px 0}
.tools--elements .tool-grid button,.products--elements .product-grid button{font-size:14px;padding:4px 12px}
.products--elements .product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}
.products--elements .product-grid article{height:102px;border-radius:6px;overflow:hidden;position:relative;color:#fff;background:#21170f}
.products--elements .product-grid img{width:100%;height:100%;object-fit:cover;opacity:.78}
.products--elements .product-grid article:after{content:"";position:absolute;inset:30% 0 0;background:linear-gradient(transparent,#18100c)}
.products--elements .product-grid b,.products--elements .product-grid p,.products--elements .product-grid button{position:absolute;z-index:1;left:25px}
.products--elements .product-grid b{bottom:35px;font:14px "Be Vietnam Pro"}
.products--elements .product-grid p{bottom:21px;margin:0;font-size:14px}
.products--elements .product-grid button{bottom:4px}
.article--elements .five-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.article--elements .five-grid article{height:126px;border:1px solid var(--line);border-radius:7px;text-align:center;padding:8px}
.article--elements .five-grid i{display:block;margin:auto;width:36px;height:36px;border:1px solid #b8a58d;border-radius:50%;font:24px/34px "Be Vietnam Pro";color:#423127}
.article--elements .five-grid article:nth-child(2) i{color:#497c3e}
.article--elements .five-grid article:nth-child(3) i{color:#4588aa}
.article--elements .five-grid article:nth-child(4) i{color:#d34c35}
.article--elements .five-grid article:nth-child(5) i{color:#a16b2f}
.article--elements .five-grid b{display:block;font:14px "Be Vietnam Pro"}
.article--elements .five-grid p{margin:4px 0;font-size:14px}
.article--elements .five-grid small{display:block;color:#b77a37;font-size:14px}
.article--elements .five-grid a{display:block;color:#a46a2f;margin-top:5px}
.article--elements .relation-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.article--elements .relation-grid article{height:95px;border:1px solid var(--line);border-radius:7px;padding:8px}
.article--elements .relation-grid b{font:14px "Be Vietnam Pro"}
.article--elements .relation-grid p{margin:2px 0}
.article--elements .relation-grid div{font-size:24px;text-align:center;margin:5px 0}
.article--elements .relation-grid small{display:block;text-align:center}
.article--elements .element-posts{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}
.article--elements .element-posts article{height:128px;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.article--elements .element-posts img{width:100%;height:72px;object-fit:cover}
.article--elements .element-posts b{display:block;font:14px/1.3 "Be Vietnam Pro";padding:6px 8px}
.article--elements .element-posts a{display:block;color:#a66b31;padding:0 8px}

/* Five elements page cards. */
.highlights--elements .highlight-card{display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:10px;min-height:82px;padding:12px;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa}
.highlights--elements .highlight-card img{width:48px;height:48px;object-fit:contain}
.highlights--elements .highlight-card span{display:flex;min-width:0;flex-direction:column}
.highlights--elements .highlight-card strong{font-size:16px;font-weight:600}
.highlights--elements .highlight-card small{font-size:14px;line-height:1.45}
.article--elements .main-column h2{margin:0 0 14px;font-size:18px;font-weight:600}
.article--elements .five-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.article--elements .element-profile{display:flex;min-height:220px;padding:14px;flex-direction:column;align-items:center;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa;color:inherit;text-align:center;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.article--elements .element-profile:hover{border-color:#d8b58f;box-shadow:0 4px 14px rgba(83,53,26,.1);transform:translateY(-2px)}
.article--elements .element-symbol{display:grid;width:64px;height:64px;margin-bottom:8px;border:1px solid currentColor;border-radius:50%;place-items:center;font-size:32px;color:#8d7762}
.article--elements .element-profile--moc .element-symbol{color:#4f7d43}.article--elements .element-profile--thuy .element-symbol{color:#3e86a9}.article--elements .element-profile--hoa .element-symbol{color:#d14d34}.article--elements .element-profile--tho .element-symbol{color:#a26c30}
.article--elements .element-profile h3{margin:0;font-size:16px;font-weight:600}
.article--elements .element-profile p{margin:4px 0 10px;font-size:14px}
.article--elements .color-dots,.article--elements .table-dots{display:flex;justify-content:center;gap:7px}
.article--elements .color-dots i,.article--elements .table-dots i{display:block;width:12px;height:12px;border:1px solid rgba(83,53,26,.12);border-radius:50%;background:var(--dot-color)}
.article--elements .element-link{margin-top:auto;color:var(--gold);font-size:14px}
.article--elements .relation-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.article--elements .relation-card{min-height:180px;padding:16px;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa}
.article--elements .relation-card h3{margin:0;font-size:16px;font-weight:600}
.article--elements .relation-card>p{margin:4px 0 14px;font-size:14px}
.article--elements .relation-flow{display:flex;align-items:center;justify-content:space-between;gap:5px;text-align:center}
.article--elements .relation-flow span{display:flex;min-width:42px;flex-direction:column;font-size:28px}
.article--elements .relation-flow small{font-size:12px}
.article--elements .relation-flow b{color:var(--gold);font-size:18px}
.article--elements .table-scroll{overflow:auto;border:1px solid var(--line);border-radius:var(--radius-md)}
.article--elements .applications table{width:100%;min-width:780px;border:0;border-collapse:collapse;background:#fffdfa}
.article--elements .applications th,.article--elements .applications td{padding:10px 12px;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);font-size:14px;font-weight:400;text-align:left;vertical-align:middle}
.article--elements .applications thead th{font-weight:600}
.article--elements .applications tbody th{font-weight:600;white-space:nowrap}
.article--elements .element-posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.article--elements .element-post{display:block;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa;color:inherit}
.article--elements .element-post img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.article--elements .element-post h3{min-height:55px;margin:0;padding:10px 12px 4px;font-size:16px;font-weight:500}
.article--elements .element-post>span{display:block;padding:0 12px 12px;color:var(--gold);font-size:14px}
.tools--elements .tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tools--elements .tool-card{display:grid;grid-template-columns:56px minmax(0,1fr);gap:10px;min-height:150px;padding:14px;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa}
.tools--elements .tool-card img{width:56px;height:56px;object-fit:contain}
.tools--elements .tool-card h3{margin:0;font-size:16px;font-weight:600}
.tools--elements .tool-card p{margin:4px 0;font-size:14px}
.tools--elements .tool-card .btn{grid-column:1/-1;justify-self:start;align-self:end}
.products--elements .product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.products--elements .product-card{position:relative;min-height:220px;overflow:hidden;border-radius:var(--radius-md);background:#21170f;color:#fff}
.products--elements .product-card:after{position:absolute;z-index:1;inset:20% 0 0;background:linear-gradient(transparent,rgba(24,16,12,.96));content:""}
.products--elements .product-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.products--elements .product-card>span{position:absolute;z-index:2;right:14px;bottom:14px;left:14px}
.products--elements .product-card h3{margin:0;font-size:16px;font-weight:600}
.products--elements .product-card p{margin:3px 0 10px;font-size:14px}
.products--elements .product-card .btn{display:inline-flex}
.related--elements .related-card{overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa;color:inherit}
.related--elements .related-card img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.related--elements .related-card h3{margin:0;padding:10px 12px 12px;font-size:16px;font-weight:500}
.article--aries .product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.article--aries .product-grid section{height:91px;border:1px solid var(--line);border-radius:6px;padding:7px;position:relative}
.article--aries .product-grid img{width:94px;height:76px;object-fit:cover;float:left;margin-right:7px}
.article--aries .product-grid b,.article--aries .product-grid strong{display:block;font-size:14px;margin:12px 0 4px}
.article--aries .product-grid strong{color:#b47830}
.article--wood .product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.article--wood .product-grid section{height:91px;border:1px solid var(--line);border-radius:6px;padding:7px;position:relative}
.article--wood .product-grid img{width:94px;height:76px;object-fit:cover;float:left;margin-right:7px}
.article--wood .product-grid b,.article--wood .product-grid strong{display:block;font-size:14px;margin:12px 0 4px}
.article--wood .product-grid strong{color:#b47830}
.article--wood .gems>div{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.article--wood .gems span{display:grid;grid-template-columns:32px 1fr;font-size:18px}
.article--wood .gems b,.article--wood .gems small{font-size:14px}
.article--wood .gems small{grid-column:2}
.article--wood .product-grid.four{grid-template-columns:repeat(4,1fr)}
.article--wood .product-grid.four section{height:112px}
.article--wood .product-grid.four img{height:97px;width:88px}
.catalog--gems .types #gem-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.catalog--gems .gem-card{display:flex;min-height:170px;padding:12px;flex-direction:column;align-items:center;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa;color:inherit;text-align:center}
.catalog--gems .gem-card img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain}
.catalog--gems .gem-card b{font-size:16px;font-weight:600}
.catalog--gems .gem-card small{margin-top:auto;color:#4f7d43;font-size:14px}
.catalog--gems .products #product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.catalog--gems .gem-product{display:flex;overflow:hidden;padding-bottom:14px;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa;color:inherit}
.catalog--gems .gem-product img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.catalog--gems .gem-product b,.catalog--gems .gem-product small,.catalog--gems .gem-product strong{display:block;padding-inline:12px}
.catalog--gems .gem-product b{margin-top:10px;font-size:16px;font-weight:600}
.catalog--gems .gem-product small{margin:4px 0;font-size:14px}
.catalog--gems .gem-product strong{font-size:16px}
.catalog--gems .gem-product .btn{align-self:flex-start;margin:10px 12px 0}
.product--ruby .product .head{height:27px;padding-top:9px}
.product--ruby .product .head p{margin:0}
.product--ruby .product .content{display:grid;grid-template-columns:457px 1fr;gap:24px}
.product--ruby .thumbs{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:8px}
.product--ruby .thumbs img{height:70px;width:100%;object-fit:cover;border-radius:4px}
.product--ruby .thumbs .selected{border:2px solid #b8782b}
.product--ruby .ratings{display:grid;grid-template-columns:110px 1fr 130px;border:1px solid var(--line);margin-top:12px;padding:10px}
.product--ruby .ratings h3{margin:0}
.product--ruby .ratings strong,.customer--ruby .score strong{font:24px "Be Vietnam Pro";color:#aa6b25}
.product--ruby .ratings p,.customer--ruby .score p{color:#c28323;margin:0;font-size:14px}
.product--ruby .review-pics{display:flex;gap:7px}
.product--ruby .review-pics img{width:56px;height:65px;object-fit:cover}
.product--ruby .reviews{border:1px solid var(--line);border-top:0;padding:5px 10px}
.product--ruby .reviews article{border-bottom:1px solid var(--line);padding:8px}
.product--ruby .reviews p{margin:4px}
.product--ruby .reviews>a{display:block;text-align:center;padding:7px}
.recommend--ruby .cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}
.recommend--ruby .recommend .content>div+div .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.recommend--ruby .cards article{min-width:0;overflow-wrap:anywhere}
.recommend--ruby .cards img{height:93px;width:100%;object-fit:cover}
.recommend--ruby .cards b,.recommend--ruby .cards strong,.recommend--ruby .cards small{display:block;font-size:14px;margin-top:4px}
.recommend--ruby .cards strong{color:#c11d25}
.recommend--ruby .cards small{color:#b67825}
.product--ruby-alt .product .head{padding-top:9px}
.product--ruby-alt .product .head p{margin:0}
.product--ruby-alt .product .content{display:grid}
.product--ruby-alt .thumbs{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:8px}
.product--ruby-alt .thumbs img{width:100%;object-fit:cover;border-radius:4px}
.product--ruby-alt .thumbs .selected{border:2px solid #b8782b}
.product--ruby-alt .ratings{display:grid;grid-template-columns:110px 1fr 130px;border:1px solid var(--line);margin-top:12px;padding:10px}
.product--ruby-alt .ratings h3{margin:0}
.product--ruby-alt .ratings strong,.customer--ruby-alt .score strong{font:24px "Be Vietnam Pro";color:#aa6b25}
.product--ruby-alt .ratings p,.customer--ruby-alt .score p{color:#c28323;margin:0;font-size:14px}
.product--ruby-alt .review-pics{display:flex;gap:7px}
.product--ruby-alt .review-pics img{width:56px;height:65px;object-fit:cover}
.product--ruby-alt .reviews{border:1px solid var(--line);border-top:0;padding:5px 10px}
.product--ruby-alt .reviews article{border-bottom:1px solid var(--line);padding:8px}
.product--ruby-alt .reviews p{margin:4px}
.product--ruby-alt .reviews>a{display:block;text-align:center;padding:7px}
.recommend--ruby-alt .cards{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}
.recommend--ruby-alt .recommend .content>div+div .cards{grid-template-columns:repeat(3,1fr)}
.recommend--ruby-alt .cards img{height:93px;width:100%;object-fit:cover}
.recommend--ruby-alt .cards b,.recommend--ruby-alt .cards strong,.recommend--ruby-alt .cards small{display:block;font-size:14px;margin-top:4px}
.recommend--ruby-alt .cards strong{color:#c11d25}
.recommend--ruby-alt .cards small{color:#b67825}
.product--ruby-alt .product .head{height:29px}
.product--ruby-alt .product .content{grid-template-columns:474px 1fr;gap:10px}
.product--ruby-alt .thumbs img{height:66px}
.product--ruby-alt .gallery .ratings,.product--ruby-alt .gallery .reviews{display:none}
.product--ruby-alt .gallery{display:flex;flex-direction:column}
.product--ruby-alt .gallery .ruby-banner{display:none}
.product--ruby-alt .product .content:after{content:"";grid-column:1/-1;height:67px;border-radius:5px;background:url('../images/chi-tiet-vong-ruby-2/ruby-banner.png') center/cover;color:#fff;font:14px/67px "Be Vietnam Pro";text-align:center;word-spacing:18px}
.recommend--ruby-alt .recommend .cards img{height:96px}
.article--aries-alt .products>div{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.article--aries-alt .products section{height:126px;border:1px solid var(--line);border-radius:5px;overflow:hidden;padding-bottom:5px}
.article--aries-alt .products img{width:100%;height:76px;object-fit:cover}
.article--aries-alt .products b,.article--aries-alt .products small,.article--aries-alt .products strong,.article--aries-alt .products a{display:block;padding:0 8px;font-size:14px}
.article--aries-alt .products strong{color:#ad6e2e}
/* 12px is reserved for compact label-like UI only. */
.badge,
.badges b,
.price em,
.stock,
.facts article small,
.authors em,
.authors small,
.people small,
.cards small,
.element-cards small,
.zodiac-grid small,
.five-grid small,
.birth-years small,
.product-grid small,
.products small,
.meta small,
[class*="badge"],
[class*="tag"]{
  font-size: 12px !important;
}
.card-grid article,
.zodiac-grid article,
.element-cards article,
.element-grid article,
.product-grid article,
.product-grid section,
.blog-grid article,
.post-grid article,
.tool-grid article,
.tool-grid a,
.needs span,
.types span,
.filters span,
.highlights article,
.facts article,
.related section,
.element-posts article,
.birth-years span,
.links span,
.helpers span,
.guarantees span{
  height: auto;
  min-height: 3rem;
}
.card-grid p,
.zodiac-grid p,
.product-grid p{
  height: auto;
}
.card-grid,
.zodiac-grid,
.element-cards,
.element-grid,
.product-grid,
.blog-grid,
.post-grid,
.tool-grid,
.needs > div,
.types #gem-grid,
.filters > div,
.highlights .content,
.facts .content{
  align-items: stretch;
}

.article--wood .product-grid.four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.article--wood .product-grid.four section{display:flex;min-height:0;height:auto;padding:0 0 14px;overflow:hidden;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa}
.article--wood .product-grid.four img{float:none;width:100%;height:auto;aspect-ratio:1/1;margin:0;object-fit:cover}
.article--wood .product-grid.four b,.article--wood .product-grid.four strong{display:block;margin:0;padding-inline:12px;font-size:16px}
.article--wood .product-grid.four b{min-height:62px;padding-top:10px;font-weight:600}
.article--wood .product-grid.four strong{margin-top:auto;color:var(--gold)}
.article--wood .product-grid.four button{align-self:flex-start;margin:10px 12px 0}
.article--wood .related>div.four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.article--wood .related section{overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-md);background:#fffdfa}
.article--wood .related img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.article--wood .related b{display:block;padding:10px 12px 12px;font-size:16px;font-weight:500}

.article--aries .product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.article--aries .product-grid section{display:grid;grid-template-columns:42% minmax(0,1fr);min-height:180px;height:auto;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-md);background:#fff}
.article--aries .product-grid img{grid-row:1/4;float:none;width:100%;height:100%;margin:0;object-fit:cover}
.article--aries .product-grid b,.article--aries .product-grid strong{display:block;margin:0;padding:12px 12px 0;font-size:16px}
.article--aries .product-grid b{font-weight:600}
.article--aries .product-grid strong{color:var(--gold)}
.article--aries .product-grid button{align-self:end;justify-self:start;margin:8px 12px 12px}
.article--aries .related>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.article--aries .related section{overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-md);background:#fff}
.article--aries .related img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.article--aries .related b,.article--aries .related a{display:block;padding:10px 12px 0;font-size:16px;font-weight:500}
.article--aries .related a{padding:6px 12px 12px;color:var(--gold);font-size:14px}