/* pages/home-heritage.css — Home page "SSS Heritage".
   Burgundy + gold. Ideas from the reference pins, made with SSS photos only:
   sketch → photo arch hero, SSS Stories, round categories, brand-story arch, temple-treasure collage,
   jimikki treasures, diamond chain "wear" animation, palace banner, favourites grid with filter,
   "Made to be seen" slider, occasions, festive edit, Deepavali water, guide banners,
   Gold Coin quotation with live price slip, how to buy, calculator, earn, FAQ, showrooms. */
body.tn-page { background: var(--cream) !important; color: var(--ink); --m-1: #6b0f1f; --m-1d: #3d0710; --m-gold: #c9a24a; --m-gold-l: #ecd28f; --display: "Playfair Display", Georgia, serif; }
body.tn-page [lang="ta"] { font-family: "Noto Serif Tamil", serif; }
body.tn-page .hg a, body.tn-page .cats a, body.tn-page .gd, body.tn-page .more, body.tn-page .hb { text-decoration: none; color: inherit; }
body.tn-page .wrap { width: min(1200px, calc(100% - 48px)); margin: auto; }
body.tn-page .site-footer { background: var(--bur-d) !important; }
body.tn-page .fx-bar, body.tn-page .fx-top { display: none !important; }
body.tn-page h2 { font-family: "Playfair Display", serif !important; letter-spacing: 0; }
.rv { opacity: 0; transform: translateY(30px); transition: opacity .9s ease, transform .9s ease; transition-delay: var(--d, 0s); }
.rv.in { opacity: 1; transform: none; }

body.tn-page{--bur:#6b0f1f;--bur-d:#3d0710;--bur-2:#8e1b2f;--gold:#c9a24a;--gold-l:#ecd28f;--cream:#f8efe1;--paper:#fffaf2;--ink:#2a1610;--muted:#7a6457}



.serif{font-family:"Playfair Display",serif}







/* hero: arch frame + sketch reveal */
.hero{position:relative;background:radial-gradient(60% 80% at 75% 40%,#9b2238 0,var(--bur) 55%,var(--bur-d) 100%);color:var(--cream);overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;opacity:.12;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cpath d='M40 6 C52 22 52 34 40 46 C28 34 28 22 40 6Z M6 40 C22 28 34 28 46 40 C34 52 22 52 6 40Z' fill='none' stroke='%23ecd28f'/%3E%3C/svg%3E")}
.hg{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:600px;gap:40px}
.hero h1{font:600 64px/1.05 "Playfair Display",serif;margin:12px 0}.hero h1 em{color:var(--gold-l)}
.hero .ta{font-size:22px;color:var(--gold-l)}
.hero p{color:rgba(248,239,225,.82);line-height:1.8;max-width:470px}
.hb{display:inline-block;margin:10px 10px 0 0;padding:14px 28px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;border:1px solid var(--gold);transition:all .3s}.hb.f{background:var(--gold);color:var(--bur-d)}.hb:hover{background:var(--gold-l);color:var(--bur-d)}
.arch{position:relative;justify-self:center;width:440px;height:540px;border-radius:220px 220px 0 0;border:2px solid var(--gold);padding:14px;margin-top:40px}
.arch:before{content:"";position:absolute;inset:-14px;border-radius:234px 234px 0 0;border:1px solid rgba(236,210,143,.5)}
.sk{position:relative;width:100%;height:100%;border-radius:206px 206px 0 0;overflow:hidden}
.sk img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sk .line{filter:grayscale(1) contrast(1.4) brightness(1.25) sepia(.15);mix-blend-mode:normal}
.sk .col{clip-path:inset(0 0 0 100%);animation:rev 6s ease-in-out infinite}
@keyframes rev{0%,15%{clip-path:inset(0 0 0 100%)}45%,85%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 100%)}}
.sk .bar{position:absolute;top:0;bottom:0;width:2px;background:var(--gold-l);box-shadow:0 0 14px var(--gold-l);animation:bar 6s ease-in-out infinite}
@keyframes bar{0%,15%{left:100%}45%,85%{left:0}100%{left:100%}}
.sk-tag{position:absolute;left:-30px;bottom:60px;background:var(--paper);color:var(--ink);padding:12px 18px;font:400 15px "Source Sans 3",sans-serif;box-shadow:0 20px 40px -20px #000}
.sk-tag b{display:block;font:600 11px Poppins;letter-spacing:.2em;color:var(--bur);font-style:normal}
/* trust strip */
.trust{display:grid;grid-template-columns:repeat(4,1fr);background:var(--paper);border-bottom:1px solid #e8d9c2}
.trust div{padding:22px;text-align:center;border-right:1px solid #e8d9c2;font-size:13px}.trust div:last-child{border-right:0}.trust b{display:block;font:600 16px "Playfair Display",serif;color:var(--bur)}.trust i{font-style:normal;font-size:24px}
/* round categories */
h2{font:600 42px "Playfair Display",serif;text-align:center;margin:70px 0 6px;color:var(--bur)}
.orn{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--gold);margin-bottom:34px}.orn:before,.orn:after{content:"";width:80px;height:1px;background:var(--gold)}
.cats{display:grid;grid-template-columns:repeat(6,1fr);gap:20px;text-align:center}
.cats img{width:150px;height:150px;border-radius:50%;object-fit:cover;border:3px solid var(--paper);box-shadow:0 0 0 1.5px var(--gold);transition:transform .5s}.cats a:hover img{transform:scale(1.08) rotate(4deg)}
.cats b{display:block;margin-top:10px;font:600 18px "Playfair Display",serif}.cats small{color:var(--bur-2)}
/* collage on maroon (Mortantra) */
.collage{margin-top:80px;background:var(--bur);padding:70px 0;color:var(--cream)}
.cg{display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:260px 260px;gap:18px}
.cg .c{background:var(--cream);color:var(--ink);padding:26px;border-radius:0 60px 0 60px;display:flex;flex-direction:column;justify-content:center}
.cg .c h3{font:600 32px "Playfair Display",serif;margin:0 0 8px;color:var(--bur)}.cg .c p{font:400 15px/1.5 "Source Sans 3",sans-serif;color:var(--muted);margin:0}
.cg img{width:100%;height:100%;object-fit:cover;border-radius:60px 0 60px 0;transition:transform .8s}.cg figure{margin:0;overflow:hidden;border-radius:60px 0 60px 0}.cg figure:hover img{transform:scale(1.08)}
.cg .tall{grid-row:span 2}
/* product grid */
.grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.pc{background:var(--paper);border:1px solid #ead9bf;transition:transform .3s,box-shadow .3s}.pc:hover{transform:translateY(-6px);box-shadow:0 22px 40px -24px var(--bur)}
.pc .im{position:relative;height:210px;overflow:hidden}.pc img{width:100%;height:100%;object-fit:cover;transition:transform .8s}.pc:hover img{transform:scale(1.08)}
.pc .badge{position:absolute;left:10px;top:10px;background:var(--bur);color:var(--gold-l);font-size:10px;letter-spacing:.14em;padding:4px 8px}
.pc .t{padding:12px 14px 16px;text-align:center}.pc small{color:var(--bur-2)}.pc b{display:block;font:600 17px "Playfair Display",serif}
.more{display:block;width:max-content;margin:28px auto 0;padding:12px 30px;border:1px solid var(--bur);color:var(--bur);font-size:12px;letter-spacing:.2em;text-transform:uppercase}
/* lotus feature (Diwali pin) */
.lotus{margin-top:80px;display:grid;grid-template-columns:1fr 1fr;background:linear-gradient(135deg,#fbe6e9,#f8efe1)}
.lotus .ph{position:relative;min-height:460px;overflow:hidden}
.lotus .ph img{position:absolute;left:50%;top:50%;width:68%;transform:translate(-50%,-50%);border-radius:50%;aspect-ratio:1;object-fit:cover;border:8px solid #2e7d32;box-shadow:0 30px 60px -20px rgba(0,0,0,.4)}
.petal{position:absolute;width:90px;height:140px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:linear-gradient(180deg,#f7a1b8,#e05b84);opacity:.85;animation:sway 5s ease-in-out infinite}
.p1{left:6%;top:12%;transform:rotate(-30deg)}.p2{right:6%;bottom:10%;transform:rotate(30deg);animation-delay:-2s}.p3{left:10%;bottom:6%;transform:rotate(-60deg);width:70px;height:110px;animation-delay:-3s}
@keyframes sway{50%{translate:0 -12px}}
.lotus .tx{padding:70px 60px;display:flex;flex-direction:column;justify-content:center}.lotus h3{font:600 44px "Playfair Display",serif;color:var(--bur);margin:8px 0}.lotus p{font:400 17px/1.6 "Source Sans 3",sans-serif;color:var(--muted)}
/* quotation */
.q{margin-top:80px;background:var(--bur-d);color:var(--cream);padding:70px 0}
.qg{display:grid;grid-template-columns:.9fr 1.1fr .9fr;gap:30px;align-items:center}
.qg label{display:block;font:600 34px "Playfair Display",serif}.qg input{width:100%;margin:10px 0;padding:10px 0;border:0;border-bottom:2px solid var(--gold);background:transparent;color:var(--cream);font:None600 42px "Playfair Display",serif}
.chips button{margin:0 6px 8px 0;padding:7px 14px;border:1px solid var(--gold);background:transparent;color:var(--gold-l)}.chips button.on{background:var(--gold);color:var(--bur-d)}
.slip{background:var(--paper);color:var(--ink);padding:22px}.slip div{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dotted #bbb;font:400 15px "Source Sans 3",sans-serif}.slip .tot{border-top:2px solid var(--ink);font:700 26px "Playfair Display",serif;color:var(--bur)}
/* stores */
.stores{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:70px auto}
.st{position:relative;min-height:260px;padding:40px;color:var(--cream);background:linear-gradient(0deg,rgba(61,7,16,.9),rgba(61,7,16,.4)),url('../../jewellery/hero-banner.jpg') center/cover;border-radius:180px 180px 0 0;text-align:center;display:flex;flex-direction:column;justify-content:flex-end;border:2px solid var(--gold)}
.st:nth-child(2){background-image:linear-gradient(0deg,rgba(61,7,16,.9),rgba(61,7,16,.4)),url('../../jewellery/kozha.jpg')}
.st h3{font:700 40px "Noto Serif Tamil",serif;margin:4px 0;color:var(--gold-l)}



/* ===== Shri Jewels style: palace banner ===== */
.palace{position:relative;margin-top:80px;padding:60px 0 0;text-align:center;color:var(--cream);background:linear-gradient(180deg,#7a1428,#4a0812);overflow:visible;z-index:1}
.palace svg.pal{position:absolute;left:0;right:0;bottom:0;width:100%;height:240px;opacity:.28}
.palace .crest2{width:70px;height:70px;margin:0 auto 6px;border:1.5px solid var(--gold-l);border-radius:50% 50% 50% 50%/60% 60% 40% 40%;display:grid;place-items:center;font:700 20px "Playfair Display",serif;color:var(--gold-l)}
.palace small{letter-spacing:.5em;font-size:11px;color:var(--gold-l)}
.palace h3{margin:30px 0 0;font:500 18px Poppins;letter-spacing:.4em;text-transform:uppercase}
.palace .script{font:italic 600 60px/1 "Playfair Display",serif;color:var(--gold-l);margin:4px 0 20px}
.palace .jewel{position:relative;display:inline-block;width:340px;height:340px;border-radius:50%;overflow:hidden;border:2px solid var(--gold);box-shadow:0 0 0 10px rgba(236,210,143,.12),0 40px 80px -30px #000;animation:float 6s ease-in-out infinite;margin-bottom:-60px}
.palace .jewel img{width:100%;height:100%;object-fit:cover}
@keyframes float{50%{transform:translateY(-12px)}}
.pal-strip{height:90px;background:var(--cream)}
/* ===== Bridgeweb style: one big piece at a time ===== */
.seen{margin-top:60px;background:#fbf6ee;padding:60px 0;text-align:center}
.seen h3{font:500 54px "Playfair Display",serif;letter-spacing:.06em;margin:0;color:var(--ink)}
.seen-stage{position:relative;height:420px;margin-top:10px}
.seen-stage figure{position:absolute;inset:0;margin:0;opacity:0;transform:scale(.92);transition:all 1s}
.seen-stage figure.on{opacity:1;transform:none}
.seen-stage img{height:100%;max-width:70%;object-fit:cover;border-radius:6px;box-shadow:0 40px 60px -40px rgba(0,0,0,.5)}
.seen-stage figcaption{position:absolute;left:0;right:0;bottom:-34px;font:400 19px "Source Sans 3",sans-serif;color:var(--muted)}
.seen .arr{position:absolute;top:50%;width:46px;height:46px;border-radius:50%;border:1px solid var(--ink);background:#fff;font-size:22px;z-index:2}.seen .l{left:8%}.seen .r{right:8%}
.seen .dots{margin-top:46px}.seen .dots i{display:inline-block;width:8px;height:8px;margin:0 4px;border-radius:50%;background:#ccc}.seen .dots i.on{background:var(--bur);width:22px;border-radius:4px}
/* ===== Mortantra style: Jimikki treasures ===== */
.jad{background:#4e0d16;padding:60px 0}
.jg{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:22px;max-width:760px;margin:auto}
.jg .tt{font:italic 600 42px/1.05 "Playfair Display",serif;color:var(--cream);align-self:end}
.jg .pn{background:var(--cream);border-radius:28px 0 28px 0;padding:24px;font:400 15px/1.5 "Source Sans 3",sans-serif;color:var(--muted);text-align:right}
.jg .pn.l{text-align:left}
.jg figure{margin:0;border-radius:0 28px 0 28px;overflow:hidden;height:300px}.jg img{width:100%;height:100%;object-fit:cover;transition:transform 1s}.jg figure:hover img{transform:scale(1.07)}
.jg .star{color:var(--gold-l);font-size:26px;text-align:right}
/* ===== Diwali lotus on water ===== */
.water{position:relative;margin-top:0;height:520px;overflow:hidden;background:radial-gradient(ellipse at 50% 60%,#e7c9cf 0,#b88a93 60%,#8d5c66 100%);display:grid;place-items:center}
.water:before,.water:after{content:"";position:absolute;left:50%;top:60%;width:300px;height:120px;margin:-60px 0 0 -150px;border:2px solid rgba(255,255,255,.45);border-radius:50%;animation:ripple 4s ease-out infinite}
.water:after{animation-delay:-2s}
@keyframes ripple{from{transform:scale(.6);opacity:1}to{transform:scale(3.2);opacity:0}}
.leaf{position:relative;width:340px;height:340px;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.06) 0 2deg,transparent 2deg 15deg),radial-gradient(circle,#4c9a3c 0,#2f7a2a 60%,#1f5a1d 100%);display:grid;place-items:center;box-shadow:0 30px 60px -20px rgba(0,0,0,.5);animation:float 7s ease-in-out infinite}
.leaf img{width:64%;height:64%;object-fit:cover;border-radius:50%}
.lot{position:absolute;width:120px;height:120px}
.lot i{position:absolute;left:50%;bottom:0;width:34px;height:76px;margin-left:-17px;border-radius:50% 50% 50% 50%/80% 80% 20% 20%;background:linear-gradient(180deg,#fbd3df,#e5638b);transform-origin:50% 100%}
.lot i:nth-child(2){transform:rotate(-35deg)}.lot i:nth-child(3){transform:rotate(35deg)}.lot i:nth-child(4){transform:rotate(-70deg);height:60px}.lot i:nth-child(5){transform:rotate(70deg);height:60px}
.lot1{left:12%;top:30%;animation:float 5s ease-in-out infinite}.lot2{right:12%;top:20%;animation:float 6s ease-in-out -2s infinite;transform:scale(.8)}.lot3{right:20%;bottom:8%;transform:scale(.7);animation:float 5.5s ease-in-out -1s infinite}
.water .word{position:absolute;top:18px;z-index:2;font:600 34px "Playfair Display",serif;letter-spacing:.3em;color:rgba(255,255,255,.75)}
/* ===== Tanishq style: SSS Stories sketch/photo cards ===== */
.stories{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.story{position:relative;height:460px;overflow:hidden;background:#f3ede4;border:1px solid #e4d6c0}
.story img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.story .sk2{filter:grayscale(1) contrast(1.6) brightness(1.3)}
.story .rl{clip-path:inset(0 50% 0 0);transition:clip-path .8s}
.story:hover .rl{clip-path:inset(0 0 0 0)}
.story .ln{position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--gold);transition:left .8s}.story:hover .ln{left:100%}
.story .cap{position:absolute;left:0;right:0;top:0;padding:16px;text-align:center;font:400 22px "Source Sans 3",sans-serif;color:var(--bur);background:linear-gradient(180deg,rgba(243,237,228,.95),transparent)}
.story .cap small{display:block;font:600 10px Poppins;letter-spacing:.3em;color:var(--muted)}
.story .note{position:absolute;right:14px;bottom:20px;width:120px;font:400 14px/1.3 "Source Sans 3",sans-serif;color:#555;transform:rotate(-6deg)}

/* ===== Padmavati style: brand story arch ===== */
.brand{background:#efe2cc;padding:70px 0}
.bs{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;max-width:980px;margin:auto}
.bs-arch{position:relative;height:520px;border-radius:260px 260px 0 0;background:linear-gradient(180deg,var(--bur),var(--bur-d));padding:22px 22px 0}
.bs-arch:before{content:"";position:absolute;inset:10px 10px 0;border-radius:250px 250px 0 0;border:1px solid rgba(236,210,143,.6)}
.bs-arch img{width:100%;height:100%;object-fit:cover;border-radius:240px 240px 0 0;transition:transform 1.2s}.bs-arch:hover img{transform:scale(1.04)}
.bs-txt{text-align:center}
.bs-txt p{font:400 20px/1.6 "Source Sans 3",sans-serif;color:var(--bur)}
.bs-logo{margin-top:20px;display:inline-flex;align-items:center;gap:12px;color:var(--bur)}
.bs-logo b{width:58px;height:58px;border-radius:50%;border:1.5px solid var(--bur);display:grid;place-items:center;font:700 18px "Playfair Display",serif}
.bs-logo span{font:italic 600 30px "Playfair Display",serif;text-align:left;line-height:1}
.bs-logo small{display:block;font:500 11px Poppins;letter-spacing:.3em;font-style:normal}
/* ===== Blog banners ===== */
.guides{display:grid;gap:20px}
.gd{position:relative;height:220px;border-radius:18px;overflow:hidden;display:flex;align-items:center;padding:0 46px;color:#fff;text-decoration:none}
.gd img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s}
.gd:hover img{transform:scale(1.06)}
.gd:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(61,7,16,.92) 0,rgba(61,7,16,.6) 45%,transparent 75%)}
.gd.rt{justify-content:flex-end;text-align:right}.gd.rt:before{background:linear-gradient(270deg,rgba(61,7,16,.92) 0,rgba(61,7,16,.6) 45%,transparent 75%)}
.gd div{position:relative;z-index:2;max-width:460px}
.gd small{font:500 13px Poppins;letter-spacing:.14em;color:var(--gold-l)}
.gd h4{margin:4px 0 6px;font:600 40px/1.05 "Playfair Display",serif}
.gd h4 em{color:var(--gold-l)}
.gd .big{font:800 90px/0.8 "Playfair Display",serif;color:var(--gold-l);float:left;margin-right:14px}
.gd span.go{font:600 12px Poppins;letter-spacing:.2em;border-bottom:1px solid var(--gold-l)}

/* ===== Diamond chain that comes down and is worn ===== */
.wear { background: radial-gradient(60% 80% at 50% 30%, #fff 0, #f3ebe0 60%, #e8dccb 100%); padding: 70px 0 0; overflow: hidden; }
.wear-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 40px; align-items: center; }
.wear h3 { font: 600 48px/1.05 "Playfair Display", serif; color: var(--bur); margin: 8px 0 14px; }
.wear p { font:400 17px/1.6 "Source Sans 3",sans-serif; color: var(--muted); }
.wear-stage { position: relative; height: 560px; }
.wear-stage svg { width: 100%; height: 100%; overflow: visible; }
.wear-stage svg { filter: drop-shadow(0 30px 40px rgba(61, 7, 16, .18)); }
/* the haram comes down from above, opens a little, then settles on the neck */
.wear .chain { transform-box: view-box; transform-origin: 300px 330px; transform: translateY(-360px) scale(1.25, .8); opacity: 0; }
.wear.is-on .chain { animation: w-drop 2.4s cubic-bezier(.25, .9, .3, 1) .3s forwards; }
@keyframes w-drop {
  0% { transform: translateY(-360px) scale(1.25, .8); opacity: 0; }
  25% { opacity: 1; }
  62% { transform: translateY(14px) scale(1.04, 1.02); }
  80% { transform: translateY(-5px) scale(.99, 1); }
  100% { transform: none; opacity: 1; }
}
.wear .shine { transform: translateX(0); }
.wear.is-on .shine { animation: w-shine 3.6s ease-in-out 2.8s infinite; }
@keyframes w-shine { 0% { transform: translateX(0); } 55%, 100% { transform: translateX(480px); } }
.wear .tw { fill: #fff; opacity: 0; transform-box: fill-box; transform-origin: center; filter: drop-shadow(0 0 4px #fff); }
.wear.is-on .tw { animation: w-twinkle 2.4s ease-in-out infinite; animation-delay: calc(2.7s + var(--t) * .3s); }
@keyframes w-twinkle { 0%, 100% { opacity: 0; transform: scale(.2) rotate(0); } 50% { opacity: 1; transform: scale(1) rotate(45deg); } }
.wear .wtag { position: absolute; right: 2%; bottom: 60px; padding: 12px 18px; background: #fff; box-shadow: 0 20px 40px -20px rgba(0,0,0,.4); font:400 15px "Source Sans 3",sans-serif; opacity: 0; transform: translateY(20px); transition: all .8s ease 2.8s; }
.wear .wtag b { display: block; font: 600 11px Poppins; letter-spacing: .2em; color: var(--bur); font-style: normal; }
.wear.is-on .wtag { opacity: 1; transform: none; }

/* ===== real quotation panel inside the burgundy block ===== */
body.tn-page .q .panel { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; color: var(--cream); }
body.tn-page .q label { color: var(--cream) !important; }
body.tn-page .q input#coin-grams { width: 100%; margin: 6px 0; padding: 8px 0; border: 0 !important; border-bottom: 2px solid var(--gold) !important; border-radius: 0 !important; background: transparent !important; color: var(--cream) !important; font:None600 42px "Playfair Display",serif; box-shadow: none !important; }
body.tn-page .q .hint { color: rgba(248, 239, 225, .75) !important; font:400 14px/1.5 "Source Sans 3",sans-serif; }
body.tn-page .q .hint strong { color: var(--gold-l); }
body.tn-page .q .btn-maroon { background: var(--gold) !important; color: var(--bur-d) !important; border: 0 !important; border-radius: 0 !important; padding: 14px 30px; font: 600 12px Poppins; letter-spacing: .2em; text-transform: uppercase; }
body.tn-page .q #coin-quote-mount { margin-top: 18px; }
body.tn-page .q #coin-quote-mount img { width: 100%; height: auto; border: 1px solid var(--gold); }
body.tn-page .q #coin-quote-mount .sheet-empty { padding: 14px; border: 1px dashed rgba(236,210,143,.5); background: transparent; color: rgba(248,239,225,.7); font:400 15px "Source Sans 3",sans-serif; }
.qg { align-items: start !important; }
.chips button { cursor: pointer; font: 600 12px Poppins; }
.slip dd { margin: 0; font-weight: 700; }
.slip dt { color: #6b5b50; }
.slip .is-flash { color: var(--gold); }
.slip-note { margin: 10px 0 0; font:400 14px/1.4 "Source Sans 3",sans-serif; color: #6b5b50; }

/* ===== favourites filter + lightbox ===== */
.ftabs { display: flex; justify-content: center; gap: 8px; margin: -16px 0 24px; flex-wrap: wrap; }
.ftabs button { padding: 9px 22px; border: 1px solid var(--bur); background: transparent; color: var(--bur); font: 600 12px Poppins; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: all .25s; }
.ftabs button.on, .ftabs button:hover { background: var(--bur); color: var(--gold-l); }
.pc { cursor: zoom-in; }
.pc.hide { display: none; }
.pc .t span { display: block; margin-top: 4px; font:400 14px/1.4 "Source Sans 3",sans-serif; color: var(--muted); }
.lb { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 30px; background: rgba(61, 7, 16, .92); }
.lb[hidden] { display: none; }
.lb figure { margin: 0; text-align: center; max-width: min(960px, 92vw); }
.lb img { max-width: 100%; max-height: 74vh; border: 2px solid var(--gold); }
.lb figcaption { color: var(--cream); font: 600 26px "Playfair Display", serif; margin-top: 10px; }
.lb button { position: absolute; top: 18px; right: 24px; width: 48px; height: 48px; border: 1px solid var(--gold-l); background: transparent; color: var(--cream); font-size: 28px; cursor: pointer; }

/* ===== occasions, how to buy, calculator, earn, FAQ (burgundy styling) ===== */
.occ6 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.occ6 article { background: var(--paper); border: 1px solid #ead9bf; overflow: hidden; transition: transform .35s, box-shadow .35s; }
.occ6 article:hover { transform: translateY(-6px); box-shadow: 0 24px 40px -24px var(--bur); }
.occ6 .im { height: 220px; overflow: hidden; }
.occ6 img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s; }
.occ6 article:hover img { transform: scale(1.08); }
.occ6 .tx { padding: 16px 20px 20px; }
.occ6 small { color: var(--bur-2); font-weight: 700; }
.occ6 h4 { margin: 2px 0 6px; font: 600 26px "Playfair Display", serif; color: var(--bur); }
.occ6 p { margin: 0; font:400 15px/1.55 "Source Sans 3",sans-serif; color: var(--muted); }
.buy { display: grid; grid-template-columns: 1fr 1.3fr; gap: 0; margin: 70px auto; border: 1px solid #ead9bf; background: var(--paper); }
.buy > div { padding: 46px; }
.buy > div + div { border-left: 1px solid #ead9bf; }
.buy strong { display: block; font: 700 64px/1 "Playfair Display", serif; color: var(--bur); margin: 8px 0; }
.buy .k { font: 600 12px Poppins; letter-spacing: .24em; color: var(--gold); text-transform: uppercase; }
.buy ol { margin: 10px 0 0; padding: 0; list-style: none; counter-reset: s; }
.buy li { counter-increment: s; position: relative; padding: 10px 0 10px 56px; border-bottom: 1px solid #ead9bf; font:400 15px/1.5 "Source Sans 3",sans-serif; color: var(--muted); }
.buy li::before { content: "0" counter(s); position: absolute; left: 0; top: 6px; font: 700 30px "Playfair Display", serif; color: var(--gold); }
.buy li b { color: var(--ink); }
.buy-quote-types { display: grid; gap: 8px; margin-top: 10px; }
.buy-quote-types .hb { margin: 0; padding: 12px 18px; text-align: left; letter-spacing: .12em; }
.buy-quote-types .hb small { display: block; margin-top: 3px; font: 500 11px Poppins, sans-serif; letter-spacing: .04em; text-transform: none; opacity: .8; }
body.tn-page .h-calc #income-calc { background: var(--paper) !important; padding: 70px 0; }
body.tn-page.site .h-calc .section-head { text-align: center; margin: 0 auto 30px; }
body.tn-page.site .h-calc .section-head .kicker { background: none !important; -webkit-text-fill-color: currentColor; color: var(--gold) !important; animation: none !important; margin-inline: auto; }
body.tn-page.site .h-calc .section-head h2 { color: var(--bur) !important; background: none !important; -webkit-text-fill-color: currentColor; font-size: 42px !important; margin-inline: auto; }
body.tn-page.site .h-calc .section-head h2::after { display: none !important; }
body.tn-page .h-calc .panel { background: #fff !important; border: 1px solid #ead9bf !important; border-radius: 0 !important; box-shadow: 0 24px 40px -30px var(--bur) !important; }
body.tn-page .h-calc .btn-maroon, body.tn-page .h-calc .btn-gold { background: var(--bur) !important; color: var(--gold-l) !important; border-radius: 0 !important; border: 0 !important; animation: none !important; }
body.tn-page .plan-pick.plan-metal.is-selected { background: var(--bur) !important; color: var(--gold-l) !important; }
.earn5 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.earn5 article { position: relative; padding: 28px; background: var(--paper); border: 1px solid #ead9bf; border-top: 4px solid var(--bur); transition: transform .3s, border-color .3s; }
.earn5 article:hover { transform: translateY(-5px); border-top-color: var(--gold); }
.earn5 .wide { grid-column: 1 / -1; }
.earn5 .n { position: absolute; right: 20px; top: 14px; font: 700 46px "Playfair Display", serif; color: transparent; -webkit-text-stroke: 1px var(--gold); }
.earn5 small { font: 600 11px Poppins; letter-spacing: .22em; color: var(--bur-2); text-transform: uppercase; }
.earn5 h4 { margin: 4px 0 8px; font: 600 28px "Playfair Display", serif; color: var(--bur); }
.earn5 p { margin: 0; font:400 15px/1.6 "Source Sans 3",sans-serif; color: var(--muted); }
.lede, .enote { max-width: 900px; margin: 0 auto 26px; text-align: center; font:400 17px/1.6 "Source Sans 3",sans-serif; color: var(--muted); }
.enote { margin-top: 24px; font-style: italic; font-size: 17px; }
.faq { display: grid; grid-template-columns: .8fr 1.2fr; gap: 50px; margin: 70px auto; }
.faq h3 { font: 600 42px "Playfair Display", serif; color: var(--bur); margin: 6px 0 10px; }
.faq details { border-bottom: 1px solid #d9c4a3; }
.faq summary { padding: 18px 40px 18px 0; position: relative; cursor: pointer; list-style: none; font: 600 21px "Playfair Display", serif; color: var(--ink); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 4px; top: 12px; font: 400 30px "Playfair Display", serif; color: var(--gold); transition: transform .3s; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { margin: 0 0 18px; font:400 16px/1.6 "Source Sans 3",sans-serif; color: var(--muted); }
.st a { display: inline-block; margin: 12px auto 0; padding: 10px 22px; background: var(--gold); color: var(--bur-d); font: 600 12px Poppins; letter-spacing: .18em; text-decoration: none; }

/* ===== phones ===== */
@media (max-width: 980px) {
  .hg, .bs, .wear-grid, .qg, .buy, .faq, .lotus { grid-template-columns: 1fr !important; }
  .arch { width: min(360px, 86vw); height: 440px; }
  .cats { grid-template-columns: repeat(3, 1fr); }
  .cats img { width: 110px; height: 110px; }
  .cg { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .cg .tall { grid-row: auto; height: 260px; }
  .grid { grid-template-columns: repeat(2, 1fr); }
  .stories, .occ6, .earn5, .stores, .trust { grid-template-columns: 1fr 1fr; }
  .hero h1 { font-size: 44px; }
  .buy > div + div { border-left: 0; border-top: 1px solid #ead9bf; }
  .jg { grid-template-columns: 1fr; padding: 0 20px; }
}
@media (max-width: 620px) {
  .stories, .occ6, .earn5, .stores, .trust, .cg { grid-template-columns: 1fr; }
  .gd { padding: 0 22px; } .gd h4 { font-size: 28px; }
  .seen h3 { font-size: 34px; } .palace .script { font-size: 44px; } .palace .jewel { width: 240px; height: 240px; }
}
@media (prefers-reduced-motion: reduce) {
  .sk .col, .sk .bar, .petal, .leaf, .lot, .palace .jewel, .water::before, .water::after { animation: none !important; }
  .sk .col { clip-path: none; }
  .wear .chain { transform: none; opacity: 1; animation: none !important; }
  .rv { opacity: 1; transform: none; transition: none; }
}

/* headings on dark photo panels: beat the site-wide maroon heading colour */
body.tn-page .hero h1, body.tn-page .gd h4, body.tn-page .gd div { color: var(--cream, #fbf3e4); }
body.tn-page .hero h1 em, body.tn-page .gd h4 em, body.tn-page .gd .big { color: var(--gold-l); }

/* ===== "Made to be worn": traditional maroon + kolam background, temple arch frame, captions ===== */
.wear.wear-trad { position: relative; padding: 80px 0 70px; color: var(--cream);
  background:
    radial-gradient(circle at 50% 50%, rgba(201,162,74,.22) 1.6px, transparent 2.2px) 0 0 / 26px 26px,
    radial-gradient(70% 90% at 72% 50%, #7a1529 0, #4a0915 60%, #2e0710 100%); }
.wear.wear-trad::before, .wear.wear-trad::after { content: ""; position: absolute; left: 0; right: 0; height: 14px;
  background: repeating-linear-gradient(90deg, var(--gold) 0 10px, var(--gold-l) 10px 14px, var(--gold) 14px 24px, transparent 24px 30px); opacity: .9; }
.wear.wear-trad::before { top: 0; } .wear.wear-trad::after { bottom: 0; }
.wear.wear-trad h3 { color: var(--gold-l); }
.wear.wear-trad p { color: rgba(248,239,225,.85); }
.wear.wear-trad .wk { color: var(--gold); letter-spacing: .24em; font: 600 12px Poppins; }
.wear-trad .wear-stage { height: auto; display: grid; place-items: center; }
.wear-arch { position: relative; width: min(470px, 100%); aspect-ratio: 600 / 700; overflow: hidden;
  border-radius: 50% 50% 14px 14px / 34% 34% 14px 14px; border: 3px solid var(--gold);
  outline: 1px solid var(--gold-l); outline-offset: 8px;
  background: radial-gradient(60% 50% at 50% 35%, #fffaf2 0, #f1e4cf 70%, #e2cfb2 100%);
  box-shadow: 0 40px 70px -30px rgba(0,0,0,.6), inset 0 0 0 10px rgba(201,162,74,.12); }
.wear-arch svg, .wear-arch video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.wear-arch svg { top: 4%; height: 96%; }
.wcap { position: absolute; left: 0; right: 0; bottom: 0; height: 74px; display: grid; place-items: center;
  background: linear-gradient(transparent, rgba(46,7,16,.92) 45%); }
.wcap span { grid-area: 1 / 1; padding: 0 16px; text-align: center; color: var(--cream); font: 600 19px "Playfair Display", serif; opacity: 0; transform: translateY(8px); }
.wcap i { font-style: normal; color: var(--gold-l); font-family: "Noto Serif Tamil", serif; }
.wear.is-on .wcap span { animation: w-cap 12s ease infinite; }
.wear.is-on .wcap span:nth-child(1) { animation-delay: 2.6s; } .wear.is-on .wcap span:nth-child(2) { animation-delay: 5.6s; }
.wear.is-on .wcap span:nth-child(3) { animation-delay: 8.6s; } .wear.is-on .wcap span:nth-child(4) { animation-delay: 11.6s; }
@keyframes w-cap { 0% { opacity: 0; transform: translateY(8px); } 4%, 22% { opacity: 1; transform: none; } 26%, 100% { opacity: 0; transform: translateY(-6px); } }
.wear-trad .wtag { right: auto; left: -10px; bottom: 90px; }
@media (max-width: 900px) { .wear-trad .wtag { left: 0; } }
@media (prefers-reduced-motion: reduce) { .wcap span:nth-child(2) { opacity: 1; transform: none; animation: none !important; } }
.wear-arch svg { top: 0; height: 100%; }
body.tn-page .wcap span { color: #fbf3e4 !important; text-shadow: 0 2px 8px rgba(0,0,0,.6); }
body.tn-page .wcap i { color: #f1d58a !important; }
body.tn-page .wear-trad .wtag { color: #2a1a12; }

/* quotation: the price slip on the side is enough, so the big image card below is not shown.
   Only the Download JPG / WhatsApp buttons stay, under "Show quotation". */
body.tn-page .q .coin-card-preview, body.tn-page .q .coin-quote-empty, body.tn-page .q .sheet-empty { display: none !important; }
body.tn-page .q #coin-quote-mount { margin: 0; }
body.tn-page .q .coin-quote-only { display: block; margin: 14px 0 0 !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; max-width: none !important; }
body.tn-page .q .coin-card-export { display: flex; gap: 10px; flex-wrap: wrap; margin: 0 !important; padding: 0 !important; background: none !important; }
body.tn-page .q .coin-card-export .btn { padding: 12px 22px; font: 600 12px Poppins; letter-spacing: .14em; text-transform: uppercase; border-radius: 0; }

/* hero brighter: old home.css put the leaf pattern above the photo and a dark veil over the hero */
body.tn-page .hero::before { z-index: 0 !important; opacity: .08 !important; }
body.tn-page .hero::after { display: none !important; }
body.tn-page .hero .hg { z-index: 1; }
body.tn-page .sk .col { filter: brightness(1.1) saturate(1.18) contrast(1.05); animation-name: rev2; }
body.tn-page .sk .bar { animation-name: bar2; }
@keyframes rev2 { 0%, 6% { clip-path: inset(0 0 0 100%); } 22%, 92% { clip-path: inset(0 0 0 0); } 100% { clip-path: inset(0 0 0 100%); } }
@keyframes bar2 { 0%, 6% { left: 100%; } 22%, 92% { left: 0; } 100% { left: 100%; } }
body.tn-page .sk .col, body.tn-page .sk .bar { animation-duration: 9s; }

/* quotation question + answer in brown, on a cream card like the price slip beside it */
body.tn-page .q .coin-quote-form { background: #fffaf2 !important; padding: 22px 24px 24px !important; border: 1px solid var(--gold) !important; outline: 1px solid rgba(201,162,74,.4); outline-offset: -7px; }
body.tn-page .q .coin-quote-form label, body.tn-page .q label[for="coin-grams"] { color: #5a2e14 !important; font: 600 34px "Playfair Display", serif !important; letter-spacing: 0 !important; text-transform: none !important; }
body.tn-page .q input#coin-grams, body.tn-page .q input#coin-grams:focus { color: #6b3a1a !important; background: #fbf1e1 !important; border: 0 !important; border-bottom: 2px solid #8a5a2b !important; padding: 8px 12px !important; caret-color: #6b3a1a; }
body.tn-page .q input#coin-grams::placeholder { color: rgba(107,58,26,.4) !important; }
body.tn-page .q input#coin-grams:-webkit-autofill { -webkit-text-fill-color: #6b3a1a !important; box-shadow: 0 0 0 40px #fbf1e1 inset !important; }
body.tn-page .q .coin-quote-form .hint { color: #7a5a40 !important; }
body.tn-page .q .coin-quote-form .hint strong { color: #6b0f1f !important; }
body.tn-page .q .coin-quote-form .hint time { color: #7a5a40 !important; }

/* hero temple haram floats gently up and down, with a soft gold glow under it */
body.tn-page .hero .arch { animation: h-float 5s ease-in-out infinite; will-change: transform; filter: drop-shadow(0 30px 30px rgba(0,0,0,.35)); }
body.tn-page .hero .arch::after { content: ""; position: absolute; left: 12%; right: 12%; bottom: -34px; height: 22px; border-radius: 50%; background: radial-gradient(closest-side, rgba(241,213,138,.45), transparent); animation: h-glow 5s ease-in-out infinite; }
body.tn-page .hero .sk-tag { animation: h-float 5s ease-in-out .6s infinite; }
@keyframes h-float { 0%, 100% { transform: translateY(0) rotate(-.4deg); } 50% { transform: translateY(-18px) rotate(.4deg); } }
@keyframes h-glow { 0%, 100% { transform: scaleX(1); opacity: .9; } 50% { transform: scaleX(.8); opacity: .5; } }
@media (prefers-reduced-motion: reduce) { body.tn-page .hero .arch, body.tn-page .hero .arch::after, body.tn-page .hero .sk-tag { animation: none !important; } }

/* showroom cards: address and phone bright and easy to read */
body.tn-page .st .st-addr { margin: 10px auto 12px; max-width: 360px; padding: 12px 16px; background: rgba(255, 247, 226, .95); color: #2a1a12 !important; font: 600 16px/1.45 "Source Sans 3", sans-serif; border: 1px solid #e2bd62; box-shadow: 0 10px 24px -12px rgba(0,0,0,.6); }
body.tn-page .st a.st-tel { display: block; width: max-content; margin: 0 auto 12px; padding: 0; background: none !important; color: #f1d58a !important; font: 700 26px "Playfair Display", serif; letter-spacing: .03em; text-shadow: 0 2px 12px rgba(0,0,0,.6); border: 0; }
body.tn-page .st a.st-tel::before { content: "☎ "; font-size: 20px; }

/* one showroom (Trichy): single card in the middle */
body.tn-page .stores { grid-template-columns: minmax(0, 620px) !important; justify-content: center !important; }
.contact-band { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }

/* home already shows the Trichy showroom card (address + phone + directions) just above the footer,
   so the footer contact band is not repeated on this page */
body.tn-page .site-footer .contact-band { display: none !important; }
body.tn-page .site-footer { padding-top: 30px !important; }

/* showroom phone in the plain reading font */
body.tn-page .st a.st-tel { font-family: "Source Sans 3", "Noto Sans Tamil", sans-serif !important; font-weight: 700 !important; font-size: 26px !important; letter-spacing: .04em; }

/* numbers in Poppins (straight digits) instead of Playfair's old-style 3/4/5/7/9 */
body.tn-page .buy strong { font: 700 clamp(34px, 9vw, 58px)/1.05 Poppins, sans-serif !important; letter-spacing: -.01em; }
body.tn-page .buy li::before { font: 700 24px Poppins, sans-serif !important; top: 10px !important; }
body.tn-page .earn5 .n { font: 700 40px Poppins, sans-serif !important; }
body.tn-page .gd .big { font: 800 80px/0.85 Poppins, sans-serif !important; }
body.tn-page .trust b { font-variant-numeric: lining-nums; }

/* How to buy: keep everything inside its border on phones */
body.tn-page .buy { width: auto; max-width: min(1180px, calc(100% - 28px)); box-sizing: border-box; }
body.tn-page .buy > div { min-width: 0; box-sizing: border-box; }
body.tn-page .buy li { overflow-wrap: anywhere; }
@media (max-width: 760px) {
  body.tn-page .buy { margin: 40px auto; }
  body.tn-page .buy > div { padding: 26px 20px; }
  body.tn-page .buy li { padding-left: 44px; }
}