/*
Theme Name: Azaire Elementor
Theme URI: https://instagram.com/azaireofficial
Author: AZAIRE
Author URI: https://instagram.com/azaireofficial
Description: AZAIRE — The Scent of Lost Verses. Classic theme for the luxury Pakistani candle brand, fully compatible with Elementor page building and WooCommerce. Warm ivory, flame gold, burgundy night, and a drifting-ember burning background.
Version: 2.1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: azaire-elementor
Tags: e-commerce, custom-menu, custom-logo, translation-ready
*/

:root{
  --ivory:#F7F1E6;
  --cream:#F3E9DB;
  --espresso:#2B1D16;
  --kraft:#B08A5E;
  --flame:#D99058;
  --flame-light:#F2B880;
  --burgundy:#4A1420;
  --burgundy-deep:#330E17;
  --plum:#1E1016;
  --lavender-mist:#EFEAF4;
  --pearl:#F9F5EC;
  --gold-text:#E8C28F;
  --content:800px;
  --wide:1280px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Jost',sans-serif;font-weight:300;font-size:1.06rem;line-height:1.65;color:var(--espresso);background:var(--ivory)}

/* == Burning embers — tiny flames over the whole site == */
body::before,body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:40;background-repeat:repeat}
body::before{background-image:
 radial-gradient(3px 5px at 12% 85%, rgba(242,184,128,.55), transparent 60%),
 radial-gradient(2px 4px at 34% 60%, rgba(217,144,88,.45), transparent 60%),
 radial-gradient(3px 5px at 58% 78%, rgba(242,184,128,.5), transparent 60%),
 radial-gradient(2px 3px at 79% 55%, rgba(232,194,143,.45), transparent 60%),
 radial-gradient(2px 4px at 92% 82%, rgba(217,144,88,.4), transparent 60%);
 background-size:100% 100vh;animation:emberRise 26s linear infinite}
body::after{background-image:
 radial-gradient(2px 3px at 22% 70%, rgba(242,184,128,.35), transparent 60%),
 radial-gradient(1.5px 3px at 47% 88%, rgba(232,194,143,.3), transparent 60%),
 radial-gradient(2px 3px at 68% 62%, rgba(217,144,88,.32), transparent 60%),
 radial-gradient(1.5px 2.5px at 86% 74%, rgba(242,184,128,.28), transparent 60%);
 background-size:100% 100vh;animation:emberRise 40s linear infinite}
@keyframes emberRise{from{background-position:0 0}to{background-position:0 -100vh}}
/* Keep embers out of the Elementor editor canvas */
body.elementor-editor-active::before,body.elementor-editor-active::after{content:none}

h1,h2,h3,h4{font-family:'Cormorant Garamond',serif;font-weight:600;line-height:1.15}
.wide{max-width:var(--wide);margin:0 auto;padding:0 1.5rem}
.content{max-width:var(--content);margin:0 auto;padding:0 1.5rem}

/* == Header == */
header.site-header{position:sticky;top:0;z-index:50;background:var(--ivory);border-bottom:1px solid rgba(43,29,22,.08)}
body.admin-bar header.site-header{top:32px}
.nav{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 1.5rem;max-width:var(--wide);margin:0 auto}
.logo-link{display:block;line-height:0}
.logo-img{height:62px;width:auto;mix-blend-mode:multiply;transition:transform .3s ease}
.logo-link:hover .logo-img{transform:scale(1.05)}
.custom-logo-link{display:block;line-height:0}
img.custom-logo{height:62px;width:auto;max-width:none;transition:transform .3s ease}
.custom-logo-link:hover img.custom-logo{transform:scale(1.05)}
nav.menu{display:flex;gap:2.2rem}
nav.menu ul{display:flex;gap:2.2rem;list-style:none;margin:0;padding:0}
nav.menu a{font-size:.85rem;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;color:var(--espresso);position:relative;padding-bottom:3px}
nav.menu a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--flame);transition:width .35s ease}
nav.menu a:hover::after{width:100%}

/* == Hero == */
.hero{position:relative;min-height:86vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,16,22,.55),rgba(30,16,22,.75));z-index:1}
.hero-inner{position:relative;z-index:2;max-width:820px;padding:6rem 1.5rem;color:var(--ivory)}
.hero-kicker{display:flex;justify-content:center;align-items:center;gap:.9rem;font-size:.8rem;letter-spacing:.34em;text-transform:uppercase;color:var(--gold-text);margin-bottom:1.6rem}
.hero-kicker::before,.hero-kicker::after{content:"";width:44px;height:1px;background:var(--gold-text);opacity:.6}
.hero h1{font-size:clamp(2.3rem,5vw,3.5rem);font-weight:500;color:#fff}
.hero h1 .urdu-line{display:block;font-style:italic;color:var(--flame-light)}
.hero p.sub{margin:1.6rem auto 2.4rem;max-width:560px;font-size:1.1rem;color:rgba(247,241,230,.85)}
.btn{display:inline-block;font-family:'Jost',sans-serif;font-size:.85rem;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;padding:1rem 2.4rem;border-radius:2px;transition:all .35s ease}
.btn-gold{background:linear-gradient(160deg,var(--flame-light),var(--flame));color:var(--burgundy-deep);font-weight:500}
.btn-gold:hover{box-shadow:0 10px 30px rgba(217,144,88,.45);transform:translateY(-2px)}
.btn-ghost{border:1px solid rgba(247,241,230,.6);color:var(--ivory);margin-left:1rem}
.btn-ghost:hover{background:rgba(247,241,230,.12)}
.btn-dark{background:var(--espresso);color:var(--ivory)}
.btn-dark:hover{background:var(--burgundy);transform:translateY(-2px)}

/* == Statement == */
.statement{padding:6.5rem 1.5rem;text-align:center}
.statement .flame-mark{font-size:2rem;background:linear-gradient(160deg,var(--flame-light),var(--flame));-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:1.2rem}
.statement h2{font-size:clamp(1.7rem,3.2vw,2.4rem);font-weight:500;max-width:760px;margin:0 auto}
.statement h2 em{color:var(--flame)}
.statement p{max-width:600px;margin:1.6rem auto 0;color:rgba(43,29,22,.75)}

/* == Collection == */
.collection-intro{text-align:center;padding:5rem 1.5rem 3.5rem}
.kicker{font-size:.78rem;letter-spacing:.34em;text-transform:uppercase;color:var(--kraft);margin-bottom:1rem}
.collection-intro h2{font-size:clamp(2rem,4vw,2.8rem);font-weight:500}
.collection-intro p{max-width:560px;margin:1.2rem auto 0;color:rgba(43,29,22,.72)}

.scent-jaam{background:var(--cream)}
.scent-jaam .num,.scent-jaam .mood{color:#8a5a2e}
.scent-khamoshi{background:var(--lavender-mist);color:#3a2f45}
.scent-khamoshi .num,.scent-khamoshi .mood{color:#7c6a99}
.scent-seher{background:var(--pearl);color:#4a4234}
.scent-seher .num,.scent-seher .mood{color:#a08d5f}
.scent-khumaar{background:var(--burgundy);color:var(--ivory)}
.scent-khumaar .num,.scent-khumaar .mood{color:var(--gold-text)}
.scent-khumaar .trans{color:rgba(247,241,230,.8)}
.scent-zeher{background:var(--plum);color:var(--ivory)}
.scent-zeher .num,.scent-zeher .mood{color:#c98ba8}
.scent-zeher .trans{color:rgba(247,241,230,.8)}

/* == Product grid: 3 per row, 2 pics per card == */
.scent-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:2rem;max-width:1280px;margin:0 auto;padding:0 1.5rem 5.5rem}
.scent-card{grid-column:span 2;border-radius:4px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 26px rgba(43,29,22,.08);transition:transform .3s ease,box-shadow .3s ease}
.scent-card:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(43,29,22,.16)}
.scent-card:nth-child(4){grid-column:2/span 2}
.scent-card .pics{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.scent-card .pics img{width:100%;height:200px;object-fit:cover;display:block;transition:transform 1.2s ease}
.scent-card:hover .pics img{transform:scale(1.05)}
.scent-card .body{padding:1.7rem 1.4rem 1.9rem;text-align:center;display:flex;flex-direction:column;align-items:center;flex-grow:1}
.scent-card .num{font-family:'Cormorant Garamond',serif;font-size:.85rem;letter-spacing:.3em;opacity:.7;margin-bottom:.5rem}
.scent-card h3{font-size:1.75rem;font-weight:600}
.scent-card .trans{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.05rem;opacity:.85;margin-top:.2rem}
.scent-card .mood{font-style:italic;font-size:.95rem;margin-top:.9rem}
.scent-card .meta{font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;opacity:.7;margin-top:.9rem}
.scent-card .price{font-family:'Cormorant Garamond',serif;font-size:1.45rem;margin:.9rem 0 1.2rem}
.scent-card .btn{margin-top:auto;padding:.85rem 1.9rem}
@media (max-width:1000px){.scent-grid{grid-template-columns:1fr 1fr}.scent-card{grid-column:auto}.scent-card:nth-child(4){grid-column:auto}}
@media (max-width:640px){.scent-grid{grid-template-columns:1fr}.scent-card .pics img{height:180px}}

/* == Order == */
.order{background:var(--ivory);padding:6.5rem 1.5rem;text-align:center}
.order h2{font-size:clamp(2rem,4vw,2.7rem);font-weight:500}
.order .lede{max-width:600px;margin:1.2rem auto 0;color:rgba(43,29,22,.75)}
.order-form{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem;max-width:780px;margin:2.8rem auto 0;text-align:left;background:#fff;padding:2.8rem;border:1px solid rgba(176,138,94,.25);border-radius:4px}
.order-form .ff{display:flex;flex-direction:column;gap:.45rem}
.order-form .full{grid-column:1/-1}
.order-form label{font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--kraft)}
.order-form input,.order-form select{font-family:'Jost',sans-serif;font-size:1rem;font-weight:300;color:var(--espresso);background:var(--ivory);border:1px solid rgba(176,138,94,.35);border-radius:2px;padding:.85rem 1rem;outline:none;transition:border-color .3s ease}
.order-form input:focus,.order-form select:focus{border-color:var(--flame)}
.order-form button{margin-top:.5rem;border:none;cursor:pointer;font-size:.85rem}
.order-form .az-hp{position:absolute;left:-9999px}
.order-success{max-width:780px;margin:2rem auto 0;padding:1.1rem 1.5rem;background:rgba(217,144,88,.15);border:1px solid var(--flame);border-radius:2px;text-align:center}
.alt-order{margin-top:2rem;font-size:.95rem;color:rgba(43,29,22,.7)}
.alt-order a{color:var(--flame);text-decoration:none}
@media (max-width:880px){.order-form{grid-template-columns:1fr;padding:1.8rem}}

/* == Gift Sets == */
.gifts{background:#EFE0C8;padding:6.5rem 1.5rem;text-align:center}
.gifts h2{font-size:clamp(2rem,4vw,2.7rem);font-weight:500}
.gifts .lede{max-width:600px;margin:1.2rem auto 0;color:rgba(43,29,22,.75)}
.gift-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;max-width:1100px;margin:3.5rem auto 0;align-items:stretch}
.gift-card{background:#fff;border:1px solid rgba(176,138,94,.3);border-radius:4px;padding:3rem 2rem 2.6rem;display:flex;flex-direction:column;position:relative;transition:transform .3s ease,box-shadow .3s ease}
.gift-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(43,29,22,.12)}
.gift-card .tag{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(160deg,var(--flame-light),var(--flame));color:var(--burgundy-deep);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;font-weight:500;padding:.4rem 1.2rem;border-radius:2px;white-space:nowrap}
.gift-card h3{font-size:1.7rem;font-weight:600}
.gift-card .urdu{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.1rem;color:var(--kraft);margin-top:.2rem}
.gift-card .for{margin:1.2rem 0;font-size:.98rem;color:rgba(43,29,22,.75);flex-grow:1}
.gift-card .g-price{font-family:'Cormorant Garamond',serif;font-size:1.7rem}
.gift-card .save{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:#8a5a2e;margin:.3rem 0 1.4rem}
.gift-card.featured{background:linear-gradient(160deg,var(--burgundy),var(--burgundy-deep));border:1px solid rgba(232,194,143,.4);color:var(--ivory)}
.gift-card.featured .urdu{color:var(--gold-text)}
.gift-card.featured .for{color:rgba(247,241,230,.8)}
.gift-card.featured .save{color:var(--gold-text)}
.gifts .fine-note{margin-top:2.6rem;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.1rem;color:rgba(43,29,22,.7)}
@media (max-width:880px){.gift-grid{grid-template-columns:1fr}}

/* == Story == */
.story{background:var(--cream);padding:6.5rem 1.5rem}
.story-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(2rem,5vw,5rem);align-items:center;max-width:var(--wide);margin:0 auto}
.story .logo-frame{background:#fff;padding:2.4rem;box-shadow:0 24px 60px rgba(43,29,22,.14)}
.story .logo-frame img{width:100%;display:block}
.story h2{font-size:clamp(2rem,4vw,2.7rem);font-weight:500;margin-bottom:1.4rem}
.story p{margin-bottom:1.1rem;color:rgba(43,29,22,.8)}
.story p em{font-family:'Cormorant Garamond',serif;font-size:1.2rem}

/* == FAQ == */
.faq{padding:6.5rem 1.5rem;max-width:var(--content);margin:0 auto}
.faq h2{text-align:center;font-size:clamp(2rem,4vw,2.6rem);font-weight:500;margin-bottom:3rem}
.faq details{border-bottom:1px solid rgba(176,138,94,.35);padding:1.4rem 0}
.faq summary{font-family:'Cormorant Garamond',serif;font-size:1.35rem;font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq summary::after{content:"+";font-size:1.5rem;color:var(--flame);transition:transform .3s ease}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding-top:.9rem;color:rgba(43,29,22,.78)}

/* == CTA band == */
.cta-band{background:linear-gradient(160deg,var(--burgundy),var(--burgundy-deep));color:var(--ivory);text-align:center;padding:6.5rem 1.5rem}
.cta-band h2{font-size:clamp(2rem,4.2vw,2.9rem);font-weight:500;color:#fff}
.cta-band h2 em{color:var(--flame-light)}
.cta-band p{max-width:520px;margin:1.4rem auto 2.4rem;color:rgba(247,241,230,.8)}

/* == Footer == */
footer.site-footer{background:var(--espresso);color:rgba(247,241,230,.75);padding:4rem 1.5rem 2.5rem;text-align:center}
.footer-logo{display:inline-block;background:var(--ivory);padding:1rem 1.5rem;border-radius:4px}
.footer-logo img{height:72px;width:auto;display:block;mix-blend-mode:multiply}
footer.site-footer .tagline{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.15rem;margin:1rem 0 2rem;color:var(--gold-text)}
footer.site-footer .links{display:flex;justify-content:center;gap:2.4rem;margin-bottom:2.4rem;flex-wrap:wrap}
footer.site-footer .links a{color:rgba(247,241,230,.75);text-decoration:none;font-size:.85rem;letter-spacing:.2em;text-transform:uppercase}
footer.site-footer .links a:hover{color:var(--flame-light)}
footer.site-footer .fine{font-size:.85rem;opacity:.55}

/* == Inner pages, Elementor & WooCommerce wrappers == */
.site-main{min-height:50vh}
.page-title-band{background:linear-gradient(160deg,var(--burgundy),var(--burgundy-deep));color:#fff;text-align:center;padding:5.5rem 1.5rem 3.5rem}
.page-title-band .kicker{color:var(--gold-text)}
.page-title-band h1{font-size:clamp(2rem,4.5vw,3rem);font-weight:500;color:#fff}
.page-content-wrap{max-width:var(--wide);margin:0 auto;padding:4rem 1.5rem 6rem}
.woo-wrap{max-width:var(--wide);margin:0 auto;padding:4rem 1.5rem 6rem}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:'Cormorant Garamond',serif;font-size:1.4rem}
.woocommerce ul.products li.product .price{font-family:'Cormorant Garamond',serif;color:var(--espresso);font-size:1.2rem}
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{background:var(--espresso);color:var(--ivory);border-radius:2px;font-family:'Jost',sans-serif;letter-spacing:.15em;text-transform:uppercase;font-weight:400}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover{background:var(--burgundy);color:var(--ivory)}
/* Let Elementor-built pages control their own width */
.elementor-page .page-content-wrap{max-width:none;padding:0}

/* == Motion == */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .8s ease,transform .8s ease}
.reveal.is-visible{opacity:1;transform:translateY(0)}
.hero-inner>*{opacity:0;animation:rise .9s ease forwards}
.hero-inner>*:nth-child(1){animation-delay:.15s}
.hero-inner>*:nth-child(2){animation-delay:.35s}
.hero-inner>*:nth-child(3){animation-delay:.55s}
.hero-inner>*:nth-child(4){animation-delay:.75s}
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}.reveal,.hero-inner>*{opacity:1!important;transform:none!important}body::before,body::after{content:none}}

@media (max-width:880px){
  .order .steps{grid-template-columns:1fr}
  .story-grid{grid-template-columns:1fr}
  nav.menu{display:none}
  .btn-ghost{margin-left:0;margin-top:.9rem}
}