/* Responsive component rules. */
@media(max-width:720px){.journeys--home .card-grid{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.story--home .content,.zodiac--home .feature-slide{grid-template-columns:1fr}}
@media(max-width:720px){.story--home .story-image,.zodiac--home .feature-wide img{width:100%;height:auto;aspect-ratio:16/9}}
@media(max-width:720px){.story--home .story-copy{padding:20px}.story--home .story-points{grid-template-columns:1fr;gap:14px}}
@media(max-width:720px){:is(.zodiac--home,.elements--home,.tools--home,.symbols--home,.products--home,.guides--home,.faq--home) .intro-row,.elements--home .elements .intro-row,.trust--home .content{grid-template-columns:1fr}}
@media(max-width:720px){.zodiac--home .zodiac-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.zodiac--home .feature-copy{padding:16px 48px}.zodiac--home .swiper-button-prev,.zodiac--home .swiper-button-next{top:74px}}
@media(max-width:720px){.elements--home .element-cards{grid-template-columns:repeat(5,minmax(90px,1fr));overflow:auto}}
@media(max-width:720px){.tools--home .tool-grid{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.symbols--home .image-strip,.products--home .product-grid,.guides--home .blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.products--home .product-grid aside{grid-column:1/-1}}
@media(max-width:720px){.trust--home .trust-points,.trust--home .trust-people{grid-template-columns:1fr}}
@media(max-width:720px){.trust--home .avatar{width:72px;height:72px}}
@media(max-width:720px){:is(.faq--home,.faq--zodiac) .faq-grid{grid-template-columns:1fr}}
@media (max-width: 720px) {
  .hero--home,
  .hero--home > .container,
  .hero--home .content {
    min-height: 520px;
  }

  .hero--home .head {
    inset: 210px 0 0;
  }

  .hero--home .head::before {
    background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.82) 18%, transparent 48%);
  }

  .hero--home .content {
    align-items: flex-start;
  }

  .hero--home .hero-copy {
    width: 100%;
  }

  .hero--home h1 { font-size: 24px; }
}
@media(max-width:700px){.article--zodiac .layout,.article--zodiac .intro{grid-template-columns:1fr}}
@media(max-width:960px){.article--zodiac .layout{grid-template-columns:1fr}}
@media(max-width:960px){.tools--zodiac>.container{padding-right:24px}.tools--zodiac .tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:960px){.products--zodiac>.container{padding-right:24px}}
@media(max-width:960px){.method--zodiac .content{grid-template-columns:1fr 1fr}.method--zodiac .method-cta{grid-column:1/-1}}
@media(max-width:700px){.method--zodiac .content{grid-template-columns:1fr}.method--zodiac .method-cta{grid-column:auto}}
@media(max-width:720px){.related--zodiac .related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.hero--zodiac,.hero--zodiac>.container,.hero--zodiac .content{min-height:700px}.hero--zodiac .head{inset:430px 0 0}.hero--zodiac .head:before{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.82) 18%,transparent 52%)}.hero--zodiac .content{align-items:flex-start}.hero--zodiac .hero-copy{width:100%;padding-top:20px}.hero--zodiac .authors{gap:12px}.hero--zodiac .meta{gap:6px 14px}}
@media(max-width:700px){.highlights--zodiac .content,.article--zodiac .zodiac-grid,.article--zodiac .element-grid,.products--zodiac .product-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){:is(.hero--zodiac,.highlights--zodiac,.article--zodiac,.tools--zodiac,.products--zodiac,.method--zodiac,.faq--zodiac,.related--zodiac) .intro-row{grid-template-columns:1fr}}
@media(max-width:700px){.article--zodiac .post-grid{grid-template-columns:1fr}}
@media(max-width:720px){.article--zodiac .birthdays{min-width:0;max-width:100%;overflow-x:auto}.article--zodiac .birthdays>h2{position:sticky;left:0;width:max-content}}
@media(max-width:700px){.hero--zodiac h1{font-size:24px}}
@media(max-width:700px){.hero--elements .hero .content,.article--elements .layout,.article--elements .intro{grid-template-columns:1fr}}
@media(max-width:700px){.hero--elements .hero .content{height:auto}}
@media(max-width:700px){.hero--elements .hero img{height:auto}}
@media(max-width:700px){.highlights--elements .highlights .content,:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .zodiac-grid,:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .element-grid,.tools--elements .tools .content,.products--elements .product-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .intro-row{grid-template-columns:1fr}}
@media(max-width:700px){:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .post-grid{grid-template-columns:1fr}}
@media(max-width:700px){:is(.hero--elements,.highlights--elements,.article--elements,.tools--elements,.products--elements,.method--elements,.related--elements) .timeline{overflow:auto}}
@media(max-width:700px){.hero--elements .hero h1{font-size:24px}}
@media(max-width:700px){.hero--elements .hero .content,.article--elements .intro{grid-template-columns:1fr}}
@media(max-width:700px){.hero--elements .hero .content{height:auto}}
@media(max-width:700px){.highlights--elements .highlights .content,.article--elements .five-grid,.article--elements .element-posts{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.hero--elements .hero img{height:auto}}
@media(max-width:700px){.article--elements .relation-grid{grid-template-columns:1fr}}
@media(max-width:700px){.article--elements .applications{overflow:auto}}

@media(max-width:1024px){
  .highlights--elements .content{grid-template-columns:repeat(3,minmax(0,1fr))}
  .article--elements .layout{grid-template-columns:minmax(0,1fr) 300px}
  .article--elements .five-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tools--elements .tool-grid,.products--elements .product-grid,.related--elements .related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .method--elements .content{grid-template-columns:1fr 1fr}
  .method--elements .content>img{grid-column:1/-1;max-height:260px}
}

@media(min-width:721px) and (max-width:800px){
  .site-header .nav>.container{gap:8px;padding-inline:12px}
  .site-header .brand{font-size:21px}
  .site-header .nav nav{font-size:14px}
  .site-header .nav nav>ul{gap:10px}
  .site-header .nav-actions{gap:12px}
}

@media(max-width:900px){
  .article--elements .layout{grid-template-columns:minmax(0,1fr)}
  .article--elements .main-column,.article--elements .relations,.article--elements .relation-grid,.article--elements .relation-card,.article--elements .applications,.article--elements .table-scroll{min-width:0;max-width:100%}
  .article--elements .element-sidebar{position:static}
}

@media(max-width:720px){
  .hero--elements,.hero--elements>.container,.hero--elements .content{min-height:760px}
  .hero--elements .head{inset:58% 0 0}
  .hero--elements .head:before{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.82) 36%,transparent 78%)}
  .hero--elements .content{align-items:flex-start}
  .hero--elements .hero-copy{width:100%;padding-top:24px}
  .hero--elements .authors{gap:14px}
  .hero--elements .authors img{width:40px;height:40px}
  .hero--elements .meta{gap:5px 12px}
  .highlights--elements .content{grid-template-columns:repeat(2,minmax(0,1fr))}
  .article--elements .layout,.article--elements .intro{grid-template-columns:minmax(0,1fr)}
  .element-single-article .element-sidebar{display:none}
  .article--elements .element-sidebar{position:static}
  .article--elements .five-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .article--elements .relation-grid,.faq--elements .content{grid-template-columns:minmax(0,1fr)}
  .article--elements .relation-flow{gap:2px}
  .article--elements .relation-flow span{min-width:0;flex:1}
  .article--elements .relation-flow small{font-size:12px}
  .article--elements .element-posts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .method--elements .content{grid-template-columns:1fr}
  .method--elements .content>img{grid-column:auto}
}

@media(max-width:480px){
  .hero--elements .authors{align-items:flex-start;flex-direction:column}
  .highlights--elements .content,.article--elements .five-grid,.article--elements .element-posts,.tools--elements .tool-grid,.products--elements .product-grid,.related--elements .related-grid{grid-template-columns:1fr}
}
@media(max-width:700px){.hero--aries .hero h1{font-size:18px}}
@media(max-width:700px){.hero--aries .overlay>p{width:auto}}
@media(max-width:700px){.facts--aries .facts .content{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.article--aries .columns,.article--aries .overview,.article--aries .love,.article--aries .career{grid-template-columns:1fr}}
@media(max-width:700px){.article--aries .columns>aside{display:none}}
@media(max-width:700px){.article--aries .traits>div,.article--aries .colors>div,.article--aries .compatibility>div,.article--aries .product-grid,.article--aries .related>div{grid-template-columns:1fr}}
@media(max-width:700px){.newsletter--aries .newsletter .content{height:auto;padding:15px;display:block}}
@media(max-width:700px){.newsletter--aries .newsletter label{width:100%;margin-top:10px}}
@media(max-width:700px){.hero--wood .hero h1{font-size:18px}}
@media(max-width:700px){:is(.hero--wood,.facts--wood,.article--wood) .overlay>p{width:auto}}
@media(max-width:700px){.facts--wood .facts .content{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.article--wood .columns,.article--wood .overview,:is(.hero--wood,.facts--wood,.article--wood) .love,:is(.hero--wood,.facts--wood,.article--wood) .career{grid-template-columns:1fr}}
@media(max-width:700px){.article--wood .columns>aside{display:none}}
@media(max-width:700px){.article--wood .traits>div,:is(.hero--wood,.facts--wood,.article--wood) .colors>div,:is(.hero--wood,.facts--wood,.article--wood) .compatibility>div,.article--wood .product-grid,.article--wood .related>div{grid-template-columns:1fr}}
@media(max-width:700px){:is(.hero--wood,.facts--wood,.article--wood) .newsletter .content{height:auto;padding:15px;display:block}}
@media(max-width:700px){:is(.hero--wood,.facts--wood,.article--wood) .newsletter label{width:100%;margin-top:10px}}
@media(max-width:700px){.hero--wood .hero .content,.article--wood .overview{grid-template-columns:1fr}}
@media(max-width:700px){.facts--wood .facts .content,.article--wood .birth-years>div,.article--wood .gems>div,.article--wood .product-grid.four,.article--wood .related>div.four{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.hero--wood .hero .content{height:auto}}
@media(max-width:700px){.hero--wood .hero .content>img{height:auto}}
@media(max-width:700px){.article--wood .applications>div{grid-template-columns:1fr}}
@media(max-width:700px){.article--wood .relations>div{grid-template-columns:1fr}}
@media(max-width:700px){.hero--gems .hero .content,.catalog--gems .columns,.catalog--gems .selectors,.catalog--gems .bottom{grid-template-columns:1fr}}
@media(max-width:700px){.hero--gems .hero .content{height:auto}}
@media(max-width:700px){.hero--gems .hero img{height:auto}}
@media(max-width:700px){.categories--gems .categories .content,.catalog--gems .needs>div,.catalog--gems .types #gem-grid,.catalog--gems .products #product-grid{grid-template-columns:repeat(2,1fr);height:auto}}
@media(max-width:700px){.categories--gems .categories span{height:60px}}
@media(max-width:700px){.catalog--gems .columns>aside{display:none}}

@media(max-width:1024px){
  .categories--gems .content{grid-template-columns:repeat(4,minmax(0,1fr))}
  .categories--gems .content>span{border-bottom:1px solid var(--line)}
  .catalog--gems .columns{grid-template-columns:minmax(0,1fr) 300px}
  .catalog--gems .types #gem-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .catalog--gems .products #product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog--gems .bottom{grid-template-columns:1fr 1fr}
  .catalog--gems .bottom>section:last-child{grid-column:1/-1}
}

@media(max-width:720px){
  .hero--gems .content,.catalog--gems .columns,.catalog--gems .selectors,.catalog--gems .bottom{grid-template-columns:1fr}
  .hero--gems .content>img{grid-row:1}
  .hero--gems .people{gap:14px;flex-direction:column}
  .categories--gems .content,.catalog--gems .needs>div{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog--gems .columns>aside{display:block;position:static}
  .catalog--gems .selectors>div:first-child{grid-template-columns:1fr}
  .catalog--gems .selectors>div:first-child h2{grid-column:auto}
  .catalog--gems .filters>div{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog--gems .method>div{grid-template-columns:1fr}
  .catalog--gems .method section{padding:14px 0 0;border-top:1px solid var(--line);border-left:0}
  .catalog--gems .bottom>section:last-child{grid-column:auto}
}

@media(max-width:480px){
  .categories--gems .content,.catalog--gems .needs>div,.catalog--gems .types #gem-grid,.catalog--gems .products #product-grid{grid-template-columns:1fr}
  .hero--gems .actions{align-items:stretch;flex-direction:column}
}
@media(max-width:700px){.product--ruby .product .content,.details--ruby .details .content,.customer--ruby .customer .content,.recommend--ruby .recommend .content{grid-template-columns:1fr}}
@media(max-width:700px){.product--ruby .gallery{order:1}}
@media(max-width:700px){.product--ruby .buy{order:0}}
@media(max-width:700px){.product--ruby .ratings{grid-template-columns:1fr 1fr}.product--ruby .review-pics{grid-column:1/-1;margin-top:10px}}
@media(max-width:700px){.details--ruby .details article{border-bottom:1px solid var(--line)}}
@media(max-width:700px){.faq--ruby .faq .content{grid-template-columns:1fr}}
@media(max-width:700px){.product--ruby-alt .product .content,.details--ruby-alt .details .content,.customer--ruby-alt .customer .content,.recommend--ruby-alt .recommend .content{grid-template-columns:1fr}}
@media(max-width:700px){.product--ruby-alt .gallery{order:1}}
@media(max-width:700px){.product--ruby-alt .buy{order:0}}
@media(max-width:700px){.details--ruby-alt .details article{border-bottom:1px solid var(--line)}}
@media(max-width:700px){.faq--ruby-alt .faq .content{grid-template-columns:1fr}}
@media(max-width:700px){.article--aries-alt .columns,.article--aries-alt .overview,.article--aries-alt .relationship,.article--aries-alt .colors{grid-template-columns:1fr}}
@media(max-width:700px){.article--aries-alt .columns>aside{display:none}}
@media(max-width:700px){.article--aries-alt .strengths{padding-right:0!important}}
@media(max-width:700px){.article--aries-alt .strengths img{position:static;width:100%}}
@media(max-width:700px){.article--aries-alt .products>div,.article--aries-alt .related>div{grid-template-columns:1fr 1fr}}

@media (max-width: 720px) {
  .site-main > section > .container { padding-inline: 18px; }
}

/* Shared responsive header and footer. */
@media (max-width: 720px) {
  .site-header .nav { height: 60px; }

  .site-header .nav nav,
  .site-header .search,
  .site-header .utility > .container > :nth-child(2) {
    display: none;
  }

  .site-header .utility > .container,
  .site-header .nav > .container,
  .site-footer > .container {
    padding-inline: 18px;
  }

  .site-header .nav-actions { gap: 18px; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .copyright span { display: block; float: none; margin-top: 5px; }

  .newsletter .content {
    display: block;
    min-height: 0;
    padding: 15px 18px;
  }

  .newsletter label {
    width: 100%;
    margin-top: 10px;
  }

  .newsletter small { margin-left: 0; }
}

@media(max-width:1024px){
  .facts--wood .content{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts--wood .content>div:nth-child(odd){border-right:1px solid var(--line)}
  .facts--wood .content>div:nth-child(even){border-right:0}
  .facts--wood .content>div:nth-last-child(-n+4){border-bottom:1px solid var(--line)}
  .facts--wood .content>div:nth-last-child(-n+2){border-bottom:0}
  .article--wood .columns{grid-template-columns:minmax(0,1fr) 300px}
  .article--wood .birth-years>div{grid-template-columns:repeat(2,minmax(0,1fr))}
  .article--wood .applications>div,.article--wood .gems>div,.article--wood .product-grid.four,.article--wood .related>div.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .article--wood .applications>div>span:nth-child(2){border-right:0}
  .article--wood .applications>div>span:nth-child(-n+2){border-bottom:1px solid var(--line)}
}

@media(max-width:720px){
  .hero--wood .content,.article--wood .columns,.article--wood .overview,.article--wood .relations>div{grid-template-columns:1fr}
  .hero--wood .content>img{grid-row:1}
  .hero--wood .people{gap:14px;flex-direction:column}
  .article--wood .traits>div,.article--wood .faq>div{grid-template-columns:1fr}
  .article--wood .columns>aside{position:static}
}

@media(max-width:480px){
  .facts--wood .content,.article--wood .birth-years>div,.article--wood .applications>div,.article--wood .gems>div,.article--wood .product-grid.four,.article--wood .related>div.four{grid-template-columns:1fr}
  .facts--wood .content>div{border-right:0!important;border-bottom:1px solid var(--line)!important}
  .facts--wood .content>div:last-child{border-bottom:0!important}
  .article--wood .applications>div>span{border-right:0;border-bottom:1px solid var(--line)}
  .article--wood .applications>div>span:last-child{border-bottom:0}
  .hero--wood .actions{align-items:stretch;flex-direction:column}
}

@media(max-width:1024px){
  .facts--aries .content{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts--aries .content>div{grid-column:span 1!important}
  .facts--aries .content>div{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
  .facts--aries .content>div:nth-child(even){border-right:0}
  .facts--aries .content>div:last-child{grid-column:1/-1!important;border-right:0;border-bottom:0}
  .article--aries .columns{grid-template-columns:minmax(0,1fr) 300px}
  .article--aries .product-grid{grid-template-columns:1fr}
  .newsletter--aries label{min-width:340px}
}

@media(max-width:720px){
  .hero--aries .content,.hero--aries .overlay{min-height:520px}
  .hero--aries .overlay{padding:24px;background:linear-gradient(90deg,rgba(12,10,8,.94),rgba(12,10,8,.58))}
  .zodiac-single .hero--aries .overlay{background:linear-gradient(90deg,rgba(12,10,8,.9),rgba(12,10,8,.45))}
  .article--aries .columns,.article--aries .overview,.article--aries .love,.article--aries .career{grid-template-columns:1fr}
  .article--aries .love img,.article--aries .career img{grid-row:1}
  .article--aries .traits>div,.article--aries .colors>div,.article--aries .compatibility>div,.article--aries .faq>div,.article--aries .related>div{grid-template-columns:1fr}
  .article--aries .colors span,.article--aries .compatibility span{border-right:0;border-bottom:1px solid var(--line)}
  .article--aries .colors span:last-child,.article--aries .compatibility span:last-child{border-bottom:0}
  .article--aries .columns>aside{display:block;position:static}
  .newsletter--aries .content{align-items:stretch;flex-direction:column}
  .newsletter--aries label{min-width:0;width:100%}
}

@media(max-width:480px){
  .facts--aries .content{grid-template-columns:1fr}
  .facts--aries .content>div{border-right:0!important;border-bottom:1px solid var(--line)!important}
  .facts--aries .content>div:last-child{border-bottom:0!important}
  .hero--aries .people{flex-direction:column}
  .hero--aries .badges{align-items:flex-start;flex-direction:column}
  .article--aries .main{padding:14px}
}

@media(max-width:720px){.term-archive .archive-grid,.term-archive .product-archive-grid{grid-template-columns:1fr}}
@media(max-width:720px){.woocommerce ul.products li.product .onsale{right:0;margin:0}}
