/*
Theme Name: White Feather Sacred Parampara
Theme URI: https://angelwhitefeather.com
Author: White Feather
Description: Sacred Parampara theme — traditional saffron-maroon look with 3D Sri Yantra and floating marigold petals.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: whitefeather-parampara
WC requires at least: 6.0
WC tested up to: 11.0
*/

:root{
  --bg:#f7efdb; --bg2:#f1e6cb; --ink:#3d1810; --ink-soft:#7a4a34; --saffron:#e0701a; --maroon:#9a2417; --gold:#bf8a2c; --cream:#fffaf0;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);overflow-x:hidden;line-height:1.6}
a{color:inherit}
img{max-width:100%;height:auto}
.petals{position:fixed;inset:0;z-index:-1;pointer-events:none;display:block}
.bgorn{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background:radial-gradient(40vw 40vw at 85% 12%,rgba(224,112,26,.12),transparent 60%),radial-gradient(40vw 40vw at 10% 85%,rgba(154,36,23,.10),transparent 60%)}
.wf-wrap{position:relative;z-index:1;max-width:1160px;margin:0 auto;padding:0 24px}
body{position:relative;z-index:1}

nav{position:sticky;top:0;z-index:20;background:rgba(247,239,219,.9);backdrop-filter:blur(8px);border-bottom:2px solid var(--gold)}
.wf-nav-in{display:flex;align-items:center;justify-content:space-between;max-width:1160px;margin:0 auto;padding:14px 24px}
.wf-logo{font-family:var(--serif);font-size:22px;font-weight:700;color:var(--maroon);display:flex;gap:9px;align-items:center;text-decoration:none}
.wf-logo .om{color:var(--saffron);font-size:24px}
.wf-menu{display:flex;gap:24px;font-size:13.5px;color:var(--ink-soft);list-style:none;margin:0;padding:0}
.wf-menu a{color:inherit;text-decoration:none}.wf-menu a:hover{color:var(--saffron)}
.wf-nav-r{display:flex;align-items:center;gap:16px}
.wf-cta{background:var(--maroon);color:#fff;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:10px 18px;border-radius:6px;text-decoration:none;box-shadow:0 4px 0 #5e150c}
@media(max-width:860px){.wf-menu{display:none}}

.wf-hero{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;min-height:84vh;padding:30px 0}
.wf-kick{font-family:var(--mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--saffron);margin-bottom:18px;display:block}
h1{font-family:var(--serif);font-size:clamp(36px,5.6vw,62px);line-height:1.05;color:var(--maroon);font-weight:700}
h1 em{font-style:normal;color:var(--saffron)}
.wf-lead{color:var(--ink-soft);font-size:16px;max-width:46ch;margin:20px 0 28px}
.wf-cta-row{display:flex;gap:14px;flex-wrap:wrap}
.wf-btn{font-size:13.5px;font-weight:700;text-decoration:none;padding:14px 26px;border-radius:6px;transition:.2s;display:inline-flex;gap:8px;align-items:center;border:0;cursor:pointer}
.wf-btn.p{background:var(--saffron);color:#fff;box-shadow:0 4px 0 #b4560f}.wf-btn.p:hover{transform:translateY(-2px);box-shadow:0 6px 0 #b4560f}
.wf-btn.g{border:1.5px solid var(--maroon);color:var(--maroon);background:transparent}.wf-btn.g:hover{background:var(--maroon);color:#fff}
.wf-trust{display:flex;gap:24px;margin-top:30px;flex-wrap:wrap}
.wf-trust b{font-family:var(--serif);font-size:22px;color:var(--maroon);display:block}
.wf-trust span{font-size:12px;color:var(--ink-soft)}

.wf-stage{position:relative;height:min(58vh,500px);display:flex;align-items:center;justify-content:center;perspective:900px}
.glowd{position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(224,112,26,.28),transparent 65%);animation:pulse 5s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1);opacity:.8}50%{transform:scale(1.1);opacity:1}}
.yantra{width:280px;height:280px;transform-style:preserve-3d;animation:spin3d 24s linear infinite}
@keyframes spin3d{to{transform:rotateY(360deg) rotateZ(360deg)}}
.yantra svg{width:100%;height:100%;filter:drop-shadow(0 0 14px rgba(191,138,44,.6))}
.diya{position:absolute;bottom:6%;width:14px;height:14px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;
  background:radial-gradient(circle at 50% 30%,#fff3c0,#e0701a 60%,#9a2417);box-shadow:0 0 18px 4px rgba(224,112,26,.7);animation:flick 1.6s ease-in-out infinite}
@keyframes flick{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.2) translateY(-2px)}}
.wf-float{animation:bob 5s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}

.wf-marq{overflow:hidden;background:var(--maroon);color:#f7efdb;padding:12px 0;border-top:2px solid var(--gold);border-bottom:2px solid var(--gold);position:relative;z-index:2}
.wf-marq-in{display:flex;white-space:nowrap;animation:slide 22s linear infinite;font-family:var(--serif);font-size:15px}
.wf-marq-in b{color:var(--saffron);font-weight:400}
@keyframes slide{to{transform:translateX(-50%)}}

section{position:relative;z-index:2;padding:74px 0}
.wf-eyebrow{text-align:center;font-family:var(--mono);font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--saffron)}
h2{font-family:var(--serif);font-size:clamp(28px,4vw,42px);text-align:center;color:var(--maroon);margin:10px 0 6px;font-weight:700}
.wf-sub{text-align:center;color:var(--ink-soft);max-width:50ch;margin:0 auto 42px;font-size:15px}
.wf-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.wf-cat{background:var(--cream);border:1px solid #e8d4a8;border-top:4px solid var(--saffron);border-radius:10px;padding:24px 18px;text-align:center;transition:.25s;text-decoration:none;color:var(--ink);display:block}
.wf-cat:hover{transform:translateY(-6px);box-shadow:0 16px 34px rgba(154,36,23,.18);border-top-color:var(--maroon)}
.wf-cat .ic{font-size:32px;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;margin:0 auto}.wf-cat .ic svg{width:100%;height:100%;display:block}.wf-cat h3{font-family:var(--serif);font-size:17px;color:var(--maroon);margin:12px 0 3px}.wf-cat .n{font-family:var(--mono);font-size:11px;color:var(--saffron)}
@media(max-width:860px){.wf-cats{grid-template-columns:repeat(2,1fr)}}

.wf-calc{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:16px}
.wf-cbox{background:linear-gradient(160deg,#fff,#fbeed3);border:1px solid #e8d4a8;border-radius:14px;padding:32px;box-shadow:0 10px 30px rgba(154,36,23,.08)}
.wf-cbox h3{font-family:var(--serif);font-size:24px;color:var(--maroon);margin-bottom:6px}
.wf-cbox p{color:var(--ink-soft);font-size:14px;margin-bottom:16px}
.wf-cbox .b{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--saffron)}

.wf-prods{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.wf-pcard{background:var(--cream);border:1px solid #e8d4a8;border-radius:16px;overflow:hidden;transition:.3s;text-decoration:none;color:var(--ink);display:block}
.wf-pcard:hover{transform:translateY(-6px);border-color:var(--saffron)}
.wf-pimg{height:180px;background:linear-gradient(135deg,#f1e6cb,#f7efdb);display:flex;align-items:center;justify-content:center;font-size:44px;position:relative}
.wf-pimg img{width:100%;height:100%;object-fit:cover}
.wf-pi{padding:16px}.wf-pcard h4{font-size:13.5px;font-weight:600;line-height:1.35;min-height:37px;overflow:hidden;margin:0}
.wf-pr{margin-top:10px;display:flex;align-items:center;justify-content:space-between}
.wf-pr .price{font-family:var(--serif);font-size:18px;color:var(--saffron)}
.wf-pr .add{font-size:11px;font-weight:700;color:var(--ink);border:1px solid #e8d4a8;padding:6px 12px;border-radius:999px}
@media(max-width:860px){.wf-prods{grid-template-columns:repeat(2,1fr)}}

@media(max-width:760px){
  .wf-hero{grid-template-columns:1fr;text-align:center}
  .wf-lead{margin-left:auto;margin-right:auto}
  .wf-kick,.wf-cta-row,.wf-trust{justify-content:center}
  .wf-stage{order:-1;height:340px}
}

.wf-foot{position:relative;z-index:2;background:var(--maroon);color:#f0dcc0;text-align:center;padding:44px 24px;border-top:2px solid var(--gold)}
.wf-foot .l{font-family:var(--serif);font-size:22px;color:#fff;margin-bottom:10px}
.wf-foot .l span{color:var(--saffron)}
.wf-foot p{font-size:13px;max-width:44ch;margin:0 auto;opacity:.85}

.wf-page{position:relative;z-index:2;max-width:1160px;margin:0 auto;padding:40px 24px 70px;min-height:60vh}
.woocommerce span.price,.woocommerce-Price-amount{color:var(--saffron)!important}
.woocommerce ul.products li.product .button,.woocommerce a.button,.woocommerce button.button{background:var(--saffron)!important;color:#fff!important;border-radius:6px!important;font-weight:700!important}
/* Hero Section Styles */
.hero-main{position:relative;z-index:1;min-height:70vh;display:flex;align-items:center;justify-content:space-between;padding:40px 60px;background:linear-gradient(to right,#f7efdb 0%,#fffaf0 50%,#f5f0e0 100%);overflow:hidden}
.angel-container{position:relative;width:300px;height:400px;display:flex;align-items:center;justify-content:center}
.angel-glow{position:absolute;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(224,112,26,0.15),rgba(224,112,26,0.05) 50%,transparent 100%);animation:celestialGlow 4s ease-in-out infinite}
@keyframes celestialGlow{0%,100%{transform:scale(1);opacity:0.8}50%{transform:scale(1.08);opacity:1}}
.angel-figure{position:relative;width:240px;height:320px;animation:angelFloat 3s ease-in-out infinite}
@keyframes angelFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}
.angel-wings{position:absolute;width:100%;height:100%;top:0;left:0}
.wing{position:absolute;top:60px}
.wing.left{left:-30px;animation:wingFlutter 1.5s ease-in-out infinite;transform-origin:right center}
.wing.right{right:-30px;animation:wingFlutterReverse 1.5s ease-in-out infinite;transform-origin:left center}
@keyframes wingFlutter{0%,100%{transform:rotateZ(-15deg)}50%{transform:rotateZ(15deg)}}
@keyframes wingFlutterReverse{0%,100%{transform:rotateZ(15deg) scaleX(-1)}50%{transform:rotateZ(-15deg) scaleX(-1)}}
.feather-background{position:absolute;width:100%;height:100%;top:0;left:0;pointer-events:none;overflow:hidden}
.float-feather{position:absolute;opacity:0.15;animation:featherFloat linear infinite;font-size:80px;color:#fff}
@keyframes featherFloat{0%{transform:translateY(100vh) translateX(0) rotateZ(0);opacity:0}5%{opacity:0.15}95%{opacity:0.15}100%{transform:translateY(-100px) translateX(100px) rotateZ(360deg);opacity:0}}
.hero-content{flex:1;max-width:500px;padding:40px}
.content-line{font-family:var(--serif);font-size:48px;line-height:1.1;color:#9a2417;margin:0;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,0.05);overflow:hidden;position:relative;height:60px;display:flex;align-items:center}
.content-line span{display:inline-block;animation:slideInWord 0.8s cubic-bezier(0.34,1.56,0.64,1) both;margin-right:8px}
.content-line span:nth-child(1){animation-delay:0.1s}
.content-line span:nth-child(2){animation-delay:0.3s}
.content-line span:nth-child(3){animation-delay:0.5s}
@keyframes slideInWord{from{opacity:0;transform:translateY(40px) rotateX(-90deg)}to{opacity:1;transform:translateY(0) rotateX(0)}}
.content-subtitle{font-size:16px;color:#7a4a34;line-height:1.8;margin-top:30px;opacity:0;animation:fadeInText 1s ease-out 1.2s both}
@keyframes fadeInText{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.content-cta{display:inline-flex;gap:16px;margin-top:30px;opacity:0;animation:fadeInText 1s ease-out 1.4s both}
.cta-btn{padding:14px 28px;border:none;border-radius:6px;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;cursor:pointer;transition:all 0.3s ease;text-decoration:none;display:inline-block}
.cta-btn.primary{background:#e0701a;color:#fff;box-shadow:0 4px 12px rgba(224,112,26,0.3)}
.cta-btn.primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(224,112,26,0.4);background:#c9600f}
.cta-btn.secondary{background:transparent;color:#9a2417;border:2px solid #9a2417}
.cta-btn.secondary:hover{background:#9a2417;color:#fff}
@media(max-width:1024px){.hero-main{flex-direction:column;justify-content:center;gap:40px}}
@media(max-width:768px){.hero-main{padding:20px}.angel-container{width:180px;height:240px}.content-line{font-size:28px}.content-subtitle{font-size:14px}}

@media(prefers-reduced-motion:reduce){*{animation:none!important}}