/* VELORA GEM AND JEWELRY — premium purple-and-white theme layer (Stage 2)
   Sits on top of styles.css. Heroes · page art · home-page composition · reveal motion.
   Mobile-first (480 / 768 / 1024 / 1280), no !important. */

/* ───────── Heroes (home, markets, blog, article, about, sources, stone) ───────── */
.hero,.marketHero,.blogHero,.articleHero{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;min-height:min(78svh,44rem);padding-block:clamp(3.5rem,8vw,7rem) clamp(3rem,6vw,5.5rem);background:var(--tgs-grad-dark);color:#fff}
.hero>.container,.marketHero>.container,.blogHero>.blogWrap,.articleHero>.blogWrap{position:relative;z-index:1}
body.tgs-over-hero :is(.hero,.marketHero,.blogHero,.articleHero){padding-top:calc(var(--tgs-nav-height) + clamp(1.5rem,5vw,4rem))}
.hero::before,.marketHero::before,.blogHero::before,.articleHero::before{content:"";position:absolute;inset:-6% 0;z-index:-2;background-image:linear-gradient(100deg,rgba(16,7,31,.94) 0,rgba(25,8,47,.78) 46%,rgba(124,58,237,.3) 100%),var(--hero-image,none);background-size:cover;background-position:center 52%;transform:translate3d(0,var(--tgs-py,0px),0)}
.hero::after,.marketHero::after,.blogHero::after,.articleHero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(0deg,rgba(21,10,46,.55),transparent 45%),linear-gradient(115deg,transparent 40%,rgba(201,162,75,.1));border-bottom:1px solid rgba(201,162,75,.45)}
.hero h1,.marketHero h1,.blogHero h1,.articleHero h1{max-width:22ch;margin:1rem 0 1.25rem;color:#fff}
.hero h1 em,.marketHero h1 em,.blogHero h1 em,.articleHero h1 em,.editorial-copy h2 em,.heritage-overlay h2 em,.final-campaign h2 em{background-image:linear-gradient(90deg,#F5EEFF,#C084FC);-webkit-background-clip:text;background-clip:text}
.hero p,.marketHero p,.blogHero p,.articleHero p{max-width:38rem;color:rgba(255,255,255,.88);font-size:var(--tgs-step-0);line-height:1.75}
.hero .kicker,.marketHero .kicker,.blogHero .blogEyebrow,.articleHero .blogEyebrow{color:#E9D5FF}
.hero .actions{margin-top:2rem}
.hero .actions .btn{flex:1 1 12rem}
.hero .btn:not(.primary),.final-campaign .btn:not(.primary),.heritage-overlay .btn:not(.primary){background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.4);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:none}
.hero-note{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1.5rem;max-width:42rem;margin-top:clamp(2rem,6vw,4rem);padding-top:1rem;border-top:1px solid rgba(201,162,75,.55);color:rgba(255,255,255,.72);font-size:.75rem;letter-spacing:.18em}
.marketIntro{position:relative;z-index:2;min-width:0}
.marketIntro h1{color:#fff}

/* ───────── Page art (all imagery is local) ───────── */
.page-index .hero{--hero-image:url('assets/01-the-blue-origin.webp')}
.page-sell-gems .marketHero{--hero-image:url('assets/18-earth-s-geometry.webp')}
.page-jewellery .marketHero{--hero-image:url('assets/05-the-rare-collection.webp')}
.page-auction .marketHero{--hero-image:url('assets/10-the-collector-s-vision.webp')}
.page-about .hero{--hero-image:url('assets/04-nature-s-masterpiece.webp')}
.page-contact .hero{--hero-image:url('assets/49-your-next-discovery.webp')}
.page-sources .hero{--hero-image:url('assets/31-beneath-ratnapura.webp')}
.page-blog .blogHero{--hero-image:url('assets/32-the-river-remembers.webp')}
.page-blog-article .articleHero{--hero-image:url('assets/37-light-in-every-facet.webp')}
.page-stone .hero{--hero-image:url('assets/34-from-river-to-rarity.webp')}
body.page-admin-login .login{background:linear-gradient(110deg,rgba(21,10,46,.88),rgba(21,10,46,.4)),url('assets/03-midnight-brilliance.webp') center/cover no-repeat}
body.page-admin-dashboard .adminTop{background:rgba(21,10,46,.96);border-bottom:1px solid rgba(201,162,75,.4)}

/* ───────── Shared listing cards (home inventory, catalogues) ───────── */
.inventoryCard{display:flex;flex-direction:column;min-width:0;overflow:hidden;background:rgba(255,255,255,.94);border:1px solid rgba(111,70,199,.16);border-radius:var(--tgs-r-md);box-shadow:var(--tgs-shadow-sm);transition:transform .5s var(--tgs-ease),box-shadow .5s var(--tgs-ease),border-color .3s}
.inventoryImage{position:relative;overflow:hidden;aspect-ratio:4/3;background:linear-gradient(135deg,#F9F6FF,#E8DDFF 48%,#6F46C7)}
.inventoryImage img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--tgs-ease)}
.inventoryImage.imageFallback{background:var(--tgs-violet-950)}
.inventoryImage.imageFallback::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(21,10,46,.28),transparent 60%);pointer-events:none}
.inventoryBody{display:flex;flex-direction:column;flex:1;gap:.5rem;padding:1.25rem}
.inventoryBody .btn{align-self:flex-start;margin-top:auto}
.inventoryTitle{font-size:1.5rem;line-height:1.1;margin:.1rem 0;overflow-wrap:anywhere}
.emptyState{grid-column:1/-1;padding:clamp(1.5rem,5vw,3rem);text-align:center;border:1px dashed rgba(111,70,199,.35);border-radius:var(--tgs-r-md);background:rgba(246,242,255,.6)}
.emptyState h3{margin-bottom:.5rem}

/* ───────── Home page composition (alternating white / violet, never 3 dark in a row) ───────── */
.intro-section,.collection-section,.inventory-section{background:var(--tgs-white)}
.category-section,.knowledge-section{background:var(--tgs-violet-50)}
.sectionHead .kicker::before,.intro-grid .kicker::before{content:"";display:inline-block;width:2rem;height:1px;margin-right:.7rem;vertical-align:middle;background:var(--tgs-gold)}
.intro-grid{display:grid;gap:1.5rem;align-items:end}
.intro-grid>*{min-width:0}
.intro-grid h2{margin:1rem 0 0}
.text-link{display:inline-flex;align-items:center;gap:.9rem;min-height:var(--tgs-tap);font-size:.75rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--tgs-violet-700);border-bottom:1px solid var(--tgs-gold)}
.center-action{text-align:center;margin-top:2rem}

.colour-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:12.5rem;gap:.5rem}
.colour-grid>*{min-width:0}
.colour-grid .tall{grid-row:span 2}
.image-tile{position:relative;display:block;overflow:hidden;min-height:0;border-radius:var(--tgs-r-sm);background:var(--tgs-violet-900);box-shadow:var(--tgs-shadow-sm)}
.image-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--tgs-ease)}
.image-tile::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(21,10,46,.82));pointer-events:none}
.image-tile-caption{position:absolute;z-index:1;left:1rem;right:1rem;bottom:1rem;color:#fff}
.image-tile-caption small{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:#E9D5FF}
.image-tile-caption h3{font-size:1.5rem;margin:.35rem 0 0;color:#fff}

.editorial-split{display:grid;background:var(--tgs-grad-dark);color:#fff;overflow:hidden}
.editorial-image{min-height:18rem;overflow:hidden}
.editorial-image img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--tgs-ease)}
.editorial-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0;padding:clamp(2rem,7vw,6rem)}
.editorial-copy .kicker{color:#E9D5FF}
.editorial-copy h2{font-size:var(--tgs-step-3);margin:1rem 0;color:#fff}
.editorial-copy p{max-width:29rem;color:rgba(255,255,255,.78);line-height:1.8;margin:0 0 1.75rem}

.collection-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:.75rem}
.collection-card{position:relative;display:block;min-height:15rem;overflow:hidden;color:#fff;border-radius:var(--tgs-r-sm);background:var(--tgs-violet-900)}
.collection-wide{min-height:22rem}
.collection-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s var(--tgs-ease)}
.collection-card::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(21,10,46,.78),transparent 65%),linear-gradient(90deg,rgba(21,10,46,.5),transparent)}
.collection-card>div{position:absolute;z-index:1;left:1.5rem;right:1.5rem;bottom:1.4rem}
.collection-card small{font-size:.75rem;letter-spacing:.16em;color:#E9D5FF}
.collection-card h3{font-size:clamp(1.6rem,3vw,2.6rem);line-height:1;margin:.6rem 0;color:#fff}
.collection-card span{font-size:.75rem;text-transform:uppercase;letter-spacing:.13em}

.heritage-banner{position:relative;display:flex;align-items:center;min-height:30rem;overflow:hidden;background:var(--tgs-violet-950);color:#fff;padding-block:3rem}
.heritage-banner>img,.final-campaign>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.heritage-banner::after,.final-campaign::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(21,10,46,.9),rgba(21,10,46,.35) 75%)}
.heritage-overlay{position:relative;z-index:1;margin-inline:var(--tgs-gutter);max-width:36rem;padding:clamp(1.25rem,4vw,2.25rem);border:1px solid rgba(255,255,255,.18);border-radius:var(--tgs-r-lg);background:rgba(255,255,255,.07);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.heritage-overlay .kicker,.final-campaign .kicker{color:#E9D5FF}
.heritage-overlay h2,.final-campaign h2{font-size:var(--tgs-step-3);margin:1rem 0;color:#fff}
.heritage-overlay p,.final-campaign p{max-width:27rem;color:rgba(255,255,255,.82);line-height:1.8;margin-bottom:1.5rem}

.knowledge-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:1rem}
.knowledge-card{display:block;min-width:0;overflow:hidden;background:#fff;color:var(--text);border:1px solid rgba(111,70,199,.16);border-radius:var(--tgs-r-md);box-shadow:var(--tgs-shadow-sm)}
.knowledge-card img{width:100%;height:14.5rem;object-fit:cover;transition:transform .8s var(--tgs-ease)}
.knowledge-card>div{padding:1.4rem}
.knowledge-card small{color:var(--tgs-violet-600);font-size:.75rem;letter-spacing:.16em}
.knowledge-card h3{font-size:1.75rem;margin:.6rem 0 1rem}
.knowledge-card span{font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;font-weight:800;color:var(--tgs-violet-700)}

.final-campaign{position:relative;display:flex;align-items:center;min-height:30rem;overflow:hidden;background:var(--tgs-violet-950);color:#fff;padding:4rem var(--tgs-gutter)}
.final-campaign>div{position:relative;z-index:1;max-width:38rem;margin-inline:auto;width:min(100%,var(--max))}
.final-campaign>div>*{max-width:32rem}

/* ───────── Reveal system (luxury-theme.js is the only driver) ───────── */
/* Content is visible by default; the hidden "before" state exists only after JS adds html.tgs-js */
html.tgs-js .reveal:not(.is-visible){opacity:0}
.reveal.is-visible{animation:tgsReveal .85s var(--tgs-ease) var(--tgs-d,0ms) backwards}
@keyframes tgsReveal{from{opacity:0;transform:translateY(1.4rem)}to{opacity:1;transform:none}}
[data-tgs-count]{font-variant-numeric:tabular-nums}
[data-tgs-parallax]{transform:translate3d(0,var(--tgs-py,0px),0);will-change:transform}

@media (hover:hover){
  .inventoryCard:hover,.knowledge-card:hover{transform:translateY(-6px);box-shadow:var(--tgs-shadow-md);border-color:rgba(139,92,246,.5)}
  .inventoryCard:hover .inventoryImage img,.knowledge-card:hover img,.image-tile:hover img,.collection-card:hover img{transform:scale(1.06)}
  .editorial-split:hover .editorial-image img{transform:scale(1.035)}
  .text-link:hover{color:var(--tgs-violet-600);border-color:var(--tgs-violet-500)}
}

@media (min-width:480px){
  .colour-grid{grid-auto-rows:13.5rem;gap:.75rem}
}
@media (min-width:768px){
  .intro-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(2rem,9%,6rem)}
  .colour-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:14.5rem}
  .editorial-split{grid-template-columns:repeat(2,minmax(0,1fr));min-height:34rem}
  .editorial-image{min-height:100%}
  .collection-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);grid-template-rows:16.25rem 16.25rem;gap:.875rem}
  .collection-wide{grid-row:span 2;min-height:0}
  .hero .actions .btn{flex:0 0 auto}
}
@media (min-width:1024px){
  .colour-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:15.25rem}
  .heritage-overlay{margin-inline:max(var(--tgs-gutter),calc((100% - var(--max)) / 2))}
  .final-campaign>div{margin-inline:0}
  .final-campaign{padding-inline:max(var(--tgs-gutter),calc((100% - var(--max)) / 2))}
}
@media (prefers-reduced-motion:reduce){
  html.tgs-js .reveal:not(.is-visible){opacity:1}
  .reveal.is-visible{animation:none}
  .hero::before,.marketHero::before,.blogHero::before,.articleHero::before{transform:none}
}

/* 404 */
.notFound{display:grid;justify-items:center;align-content:center;gap:.5rem;min-height:70svh;padding-block:var(--tgs-section-y);text-align:center}
.notFound h1{margin:.25rem 0 .5rem}