/*
Theme Name: Nakshatra Store (Astra Child)
Theme URI: 
Description: Spiritual e-commerce child theme inspired by temple/yantra aesthetics. Built on Astra parent theme with WooCommerce support.
Author: Built with Claude
Template: astra
Version: 1.0
Text Domain: nakshatra-child
*/

:root{
    --maroon:#5C1A1A;
    --maroon-dark:#410F0F;
    --gold:#C9942B;
    --gold-light:#E3B85C;
    --copper:#8C5A2B;
    --ivory:#FBF6EC;
    --ivory-deep:#F3EAD6;
    --charcoal:#2A2118;
    --charcoal-soft:#5A4E40;
    --line:#E4D7BC;
    --radius:6px;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  body{
    font-family:'Jost', sans-serif;
    color:var(--charcoal);
    background:var(--ivory);
    line-height:1.6;
  }
  h1,h2,h3,.display{
    font-family:'Cormorant Garamond', serif;
    font-weight:600;
    color:var(--maroon-dark);
  }
  a{text-decoration:none; color:inherit;}
  img{max-width:100%; display:block;}
  .wrap{max-width:1240px; margin:0 auto; padding:0 24px;}
  ul{list-style:none;}
  button{cursor:pointer; font-family:inherit;}

  /* ===== Yantra divider signature element ===== */
  .yantra-divider{
    display:flex; align-items:center; justify-content:center;
    gap:14px; margin:0 auto; width:100%; padding:46px 0 38px;
  }
  .yantra-divider .line{height:1px; flex:1; background:var(--line); max-width:340px;}
  .yantra-divider svg{width:34px; height:34px; flex-shrink:0;}

  /* ===== Top utility bar ===== */
  .announce-bar{
    background:var(--maroon-dark); color:var(--ivory-deep);
    font-size:13px; letter-spacing:.03em; text-align:center;
    padding:9px 0; overflow:hidden; white-space:nowrap;
  }
  .announce-track{display:inline-block; animation:scroll-left 22s linear infinite;}
  .announce-track span{margin:0 40px;}
  @keyframes scroll-left{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

  /* ===== Header ===== */
  header{background:var(--ivory); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:50;}
  .header-inner{display:flex; align-items:center; justify-content:space-between; padding:18px 24px; gap:24px;}
  .logo{display:flex; align-items:center; gap:10px;}
  .logo svg{width:32px; height:32px;}
  .logo-text{font-family:'Cormorant Garamond',serif; font-size:26px; font-weight:700; color:var(--maroon-dark); letter-spacing:.02em;}
  .logo-text em{font-style:normal; color:var(--gold);}

  nav.main-nav{display:flex; gap:30px;}
  nav.main-nav a{
    font-size:14px; font-weight:500; color:var(--charcoal);
    position:relative; padding:6px 0;
    transition:color .2s;
  }
  nav.main-nav a:hover{color:var(--maroon);}
  nav.main-nav a::after{
    content:''; position:absolute; left:0; bottom:0; height:2px; width:0;
    background:var(--gold); transition:width .25s;
  }
  nav.main-nav a:hover::after{width:100%;}

  .header-icons{display:flex; align-items:center; gap:18px;}
  .header-icons button{
    background:none; border:none; color:var(--maroon-dark);
    display:flex; align-items:center; gap:6px; font-size:14px;
  }
  .cart-count{
    background:var(--gold); color:var(--maroon-dark); font-size:11px; font-weight:600;
    border-radius:50%; width:18px; height:18px; display:flex; align-items:center; justify-content:center;
  }

  /* category strip */
  .cat-strip{background:var(--maroon-dark);}
  .cat-strip .wrap{display:flex; gap:28px; overflow-x:auto; padding:11px 24px; scrollbar-width:none;}
  .cat-strip .wrap::-webkit-scrollbar{display:none;}
  .cat-strip a{color:#E9D9B8; font-size:13px; white-space:nowrap; opacity:.9;}
  .cat-strip a:hover{opacity:1; color:var(--gold-light);}

  /* ===== Astra container conflict fix ===== */
  /* Astra wraps page content in .ast-container with its own max-width/padding.
     These rules force our full-width sections to escape that constraint and
     guarantee every section has real visible height. */
  #content, .ast-container, .site-content{
    max-width:none !important; padding:0 !important; margin:0 !important; overflow:visible !important;
  }
  .hero, .trust-strip, .cat-strip, .section, .announce-bar{
    display:block !important; width:100% !important; min-height:1px !important; overflow:visible !important;
  }
  .promo-banner{
    width:100% !important; min-height:1px !important; overflow:hidden !important;
  }
  .hero{min-height:480px !important;}

  /* ===== Hero ===== */
  .hero{
    position:relative !important; overflow:hidden;
    background:radial-gradient(circle at 80% 20%, #6E2424 0%, var(--maroon-dark) 55%, #34090A 100%) !important;
    color:var(--ivory);
  }
  .hero-yantra{
    position:absolute; right:-120px; top:50%; transform:translateY(-50%);
    width:560px; height:560px; opacity:.16;
  }
  .hero-inner{
    position:relative; z-index:2;
    max-width:1240px; margin:0 auto; padding:90px 24px 100px;
    display:grid !important; grid-template-columns:1.1fr .9fr; gap:50px; align-items:center;
  }
  .hero-eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    font-size:12px; letter-spacing:.12em; text-transform:uppercase;
    color:var(--gold-light); margin-bottom:18px;
  }
  .hero-eyebrow::before{content:''; width:22px; height:1px; background:var(--gold-light);}
  .hero h1{
    font-size:52px; line-height:1.08; color:#FBF1DD; max-width:520px;
  }
  .hero h1 span{color:var(--gold-light); font-style:italic;}
  .hero p.sub{
    margin:22px 0 32px; max-width:440px; font-size:16px; color:#E6D7C2;
  }
  .hero-ctas{display:flex; gap:16px;}
  .btn{
    display:inline-flex; align-items:center; gap:8px;
    padding:14px 28px; border-radius:var(--radius);
    font-size:14px; font-weight:500; letter-spacing:.02em;
    border:1px solid transparent; transition:all .2s;
  }
  .btn-gold{background:var(--gold); color:var(--maroon-dark);}
  .btn-gold:hover{background:var(--gold-light);}
  .btn-outline{border-color:rgba(251,246,236,.4); color:var(--ivory);}
  .btn-outline:hover{border-color:var(--ivory);}

  .hero-card{
    background:rgba(251,246,236,.06); border:1px solid rgba(251,246,236,.18);
    border-radius:14px; padding:28px; backdrop-filter:blur(2px);
  }
  .hero-card img{border-radius:10px; width:100%; aspect-ratio:1/1; object-fit:cover;}
  .hero-card .tag{
    display:inline-block; margin-top:16px; background:var(--gold); color:var(--maroon-dark);
    font-size:12px; font-weight:600; padding:5px 12px; border-radius:30px;
  }
  .hero-card .price{margin-top:10px; font-family:'Cormorant Garamond',serif; font-size:24px; color:var(--ivory);}
  .hero-card .price s{color:#B89B7E; font-size:16px; margin-left:8px;}

  /* ===== Trust strip ===== */
  .trust-strip{background:var(--ivory-deep); border-bottom:1px solid var(--line);}
  .trust-strip .wrap{
    display:grid !important; grid-template-columns:repeat(4,1fr); gap:0;
    padding:22px 24px;
  }
  .trust-item{
    display:flex; align-items:center; gap:12px; font-size:13px;
    padding:0 18px; border-right:1px solid var(--line); color:var(--charcoal-soft);
  }
  .trust-item:last-child{border-right:none;}
  .trust-item svg{width:26px; height:26px; flex-shrink:0; color:var(--copper);}
  .trust-item b{display:block; color:var(--maroon-dark); font-size:13px; font-weight:600;}

  /* ===== Section heading pattern ===== */
  .section{padding:0 24px;}
  .section-head{text-align:center; max-width:600px; margin:0 auto 36px;}
  .section-head .eyebrow{
    font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--copper); display:block; margin-bottom:8px;
  }
  .section-head h2{font-size:34px;}
  .section-head p{color:var(--charcoal-soft); font-size:15px; margin-top:10px;}

  /* ===== Shop by purpose ===== */
  .purpose-grid{
    display:grid !important; grid-template-columns:repeat(4,1fr); gap:18px; max-width:1240px; margin:0 auto;
  }
  .purpose-card{
    position:relative; border-radius:12px; overflow:hidden; aspect-ratio:4/5;
    background:linear-gradient(160deg,#7A2E2E,#3D1010);
  }
  .purpose-card img{width:100%; height:100%; object-fit:cover; opacity:.85; transition:transform .4s;}
  .purpose-card:hover img{transform:scale(1.06);}
  .purpose-card .label{
    position:absolute; left:0; bottom:0; right:0; padding:18px;
    background:linear-gradient(to top, rgba(40,10,10,.88), transparent);
    color:var(--ivory);
  }
  .purpose-card .label .small{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-light); display:block; margin-bottom:4px;}
  .purpose-card .label .big{font-family:'Cormorant Garamond',serif; font-size:22px;}

  /* ===== Product grid ===== */
  .product-grid{
    display:grid !important; grid-template-columns:repeat(4,1fr); gap:22px; max-width:1240px; margin:0 auto;
  }
  .product-card{
    background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden;
    transition:box-shadow .25s, transform .25s;
  }
  .product-card:hover{box-shadow:0 10px 26px rgba(92,26,26,.1); transform:translateY(-3px);}
  .product-img{position:relative; aspect-ratio:1/1; background:var(--ivory-deep); overflow:hidden;}
  .product-img img{width:100%; height:100%; object-fit:cover;}
  .product-badge{
    position:absolute; top:10px; left:10px; background:var(--maroon); color:#fff;
    font-size:10.5px; font-weight:500; padding:4px 9px; border-radius:30px; letter-spacing:.02em;
  }
  .product-body{padding:16px;}
  .product-cat{font-size:11px; color:var(--copper); text-transform:uppercase; letter-spacing:.08em;}
  .product-title{font-size:15px; font-weight:500; margin:6px 0 8px; color:var(--charcoal); min-height:40px;}
  .product-rating{font-size:12px; color:var(--charcoal-soft); margin-bottom:8px;}
  .product-rating .stars{color:var(--gold);}
  .product-price{display:flex; align-items:baseline; gap:8px; margin-bottom:12px;}
  .product-price .now{font-family:'Cormorant Garamond',serif; font-size:20px; color:var(--maroon-dark); font-weight:700;}
  .product-price .was{font-size:13px; color:#B5A98E; text-decoration:line-through;}
  .add-btn{
    width:100%; background:var(--ivory-deep); border:1px solid var(--gold); color:var(--maroon-dark);
    padding:10px; border-radius:6px; font-size:13px; font-weight:500; transition:.2s;
  }
  .add-btn:hover{background:var(--gold); color:#fff;}

  /* ===== Category icon ring ===== */
  .ring-grid{display:grid !important; grid-template-columns:repeat(6,1fr); gap:24px; max-width:1100px; margin:0 auto;}
  .ring-item{display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center;}
  .ring-circle{
    width:84px; height:84px; border-radius:50%; background:var(--ivory-deep);
    border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
    transition:.25s;
  }
  .ring-circle svg{width:34px; height:34px; color:var(--maroon);}
  .ring-item:hover .ring-circle{background:var(--maroon-dark); border-color:var(--maroon-dark);}
  .ring-item:hover .ring-circle svg{color:var(--gold-light);}
  .ring-item span{font-size:13px; color:var(--charcoal-soft);}

  /* ===== Banner ===== */
  .promo-banner{
    background:linear-gradient(120deg, var(--maroon) 0%, var(--maroon-dark) 100%);
    border-radius:16px; max-width:1240px; margin:0 auto;
    display:grid !important; grid-template-columns:1fr 1fr; align-items:center; overflow:hidden;
  }
  .promo-text{padding:50px 56px; color:var(--ivory);}
  .promo-text .eyebrow{color:var(--gold-light); font-size:12px; letter-spacing:.12em; text-transform:uppercase;}
  .promo-text h3{font-size:30px; margin:12px 0 14px; color:#FBF1DD;}
  .promo-text p{color:#E6D7C2; font-size:14px; margin-bottom:24px; max-width:380px;}
  .promo-img{aspect-ratio:16/11;}
  .promo-img img{width:100%; height:100%; object-fit:cover;}

  /* ===== Testimonials ===== */
  .testi-grid{display:grid !important; grid-template-columns:repeat(3,1fr); gap:22px; max-width:1240px; margin:0 auto;}
  .testi-card{
    background:#fff; border:1px solid var(--line); border-radius:10px; padding:26px;
  }
  .testi-stars{color:var(--gold); font-size:14px; margin-bottom:14px;}
  .testi-card p{font-size:14px; color:var(--charcoal-soft); margin-bottom:18px;}
  .testi-who{display:flex; align-items:center; gap:10px;}
  .testi-avatar{
    width:38px; height:38px; border-radius:50%; background:var(--ivory-deep);
    display:flex; align-items:center; justify-content:center; font-family:'Cormorant Garamond',serif;
    color:var(--maroon-dark); font-weight:700;
  }
  .testi-who b{font-size:13px; display:block; color:var(--charcoal);}
  .testi-who span{font-size:11px; color:var(--copper);}

  /* ===== FAQ ===== */
  .faq-list{max-width:760px; margin:0 auto;}
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-q{
    width:100%; background:none; border:none; text-align:left; padding:20px 4px;
    display:flex; justify-content:space-between; align-items:center;
    font-size:15px; font-weight:500; color:var(--charcoal);
  }
  .faq-q .plus{color:var(--gold); font-size:20px; transition:transform .25s; font-family:'Cormorant Garamond',serif;}
  .faq-item.open .plus{transform:rotate(45deg);}
  .faq-a{max-height:0; overflow:hidden; transition:max-height .3s ease; font-size:14px; color:var(--charcoal-soft); padding:0 4px;}
  .faq-item.open .faq-a{max-height:200px; padding-bottom:18px;}

  /* ===== Newsletter ===== */
  .newsletter{
    background:var(--ivory-deep); border-radius:16px; max-width:1240px; margin:0 auto;
    padding:50px; text-align:center;
  }
  .newsletter h3{font-size:28px; margin-bottom:10px;}
  .newsletter p{color:var(--charcoal-soft); font-size:14px; margin-bottom:24px;}
  .newsletter form{display:flex; max-width:420px; margin:0 auto; gap:10px;}
  .newsletter input{
    flex:1; padding:13px 16px; border-radius:6px; border:1px solid var(--line); font-size:14px; font-family:inherit;
  }
  .newsletter button{
    padding:13px 24px; background:var(--maroon); color:#fff; border:none; border-radius:6px; font-size:14px; font-weight:500;
  }
  .newsletter button:hover{background:var(--maroon-dark);}

  /* ===== Footer ===== */
  footer{background:var(--maroon-dark); color:#D8C4A8;}
  .footer-top{
    max-width:1240px; margin:0 auto; padding:60px 24px 40px;
    display:grid !important; grid-template-columns:1.3fr 1fr 1fr 1fr 1.2fr; gap:36px;
  }
  .footer-top h4{color:var(--gold-light); font-size:14px; font-weight:600; margin-bottom:16px; letter-spacing:.03em;}
  .footer-top ul li{margin-bottom:10px; font-size:13px; opacity:.85;}
  .footer-top ul li a:hover{color:var(--gold-light);}
  .footer-brand p{font-size:13px; opacity:.8; margin:14px 0 18px; max-width:260px;}
  .footer-social{display:flex; gap:12px;}
  .footer-social a{
    width:34px; height:34px; border-radius:50%; border:1px solid rgba(216,196,168,.3);
    display:flex; align-items:center; justify-content:center;
  }
  .footer-social svg{width:16px; height:16px;}
  .footer-bottom{
    border-top:1px solid rgba(216,196,168,.15); padding:20px 24px; max-width:1240px; margin:0 auto;
    display:flex; justify-content:space-between; font-size:12px; opacity:.7;
  }

  @media(max-width:980px){
    .header-inner nav.main-nav, .trust-strip{display:none;}
    .hero-inner{grid-template-columns:1fr;}
    .hero h1{font-size:38px;}
    .purpose-grid, .product-grid{grid-template-columns:repeat(2,1fr);}
    .ring-grid{grid-template-columns:repeat(3,1fr);}
    .testi-grid{grid-template-columns:1fr;}
    .promo-banner{grid-template-columns:1fr;}
    .footer-top{grid-template-columns:1fr 1fr;}
  }