/* =====================================================================
   JAY GOLD - ROYAL LAYER  (loaded after site.css)
   Same design and the same burgundy + gold colours. This file only:
     1. refines the shades so everything feels royal and matched (no salmon / brown / bright blue parts)
     2. adds the animations (page loader, reveal on scroll, gold shine, hero zoom, marquee, counters)
     3. improves the phone view (side drawer menu, bottom bar, tighter cards)
   The background and gold colours come from Admin > Settings > Website colour (includes/header.php).
   ===================================================================== */

:root{
  --ivory:#F5ECDA; --warm-ivory:#EEDFC1; --paper:#FCF7EE;
  --gold-metal:linear-gradient(120deg,#F7E7B4 0%,#DDBE72 22%,#B98B3C 48%,#E8CC86 70%,#C9A04F 100%);
  --gold-line:linear-gradient(90deg,transparent,var(--antique-gold) 18%,var(--champagne) 50%,var(--antique-gold) 82%,transparent);
  --ease-royal:cubic-bezier(.22,.8,.24,1);
  --shadow-royal:0 22px 50px -22px rgba(20,4,6,.75);
}

/* ---------- 1. ROYAL REFINEMENT ---------- */
body{background:
  radial-gradient(1200px 600px at 10% -10%,rgba(200,161,90,.08),transparent 60%),
  radial-gradient(900px 500px at 110% 30%,rgba(200,161,90,.06),transparent 60%),
  var(--burgundy);}
::selection{background:var(--antique-gold);color:var(--dark-burgundy);}
html{scrollbar-color:var(--antique-gold) var(--deepest);}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:var(--deepest);}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--champagne),var(--rich-gold));border-radius:10px;border:2px solid var(--deepest);}

/* top bar : deeper, gold hairline */
.topbar{background:linear-gradient(90deg,var(--deepest),var(--dark-burgundy),var(--deepest));border-bottom:1px solid rgba(200,161,90,.28);}
.topbar .rates b{color:var(--champagne);}

/* header : glass + gold rule, shrinks a little after scrolling */
.site-top{background:rgba(0,0,0,0) linear-gradient(180deg,var(--burgundy),var(--dark-burgundy));transition:box-shadow .4s,background .4s;}
.site-top::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold-line);opacity:.9;}
.site-top .head{transition:height .35s var(--ease-royal);}
body.scrolled .site-top{box-shadow:0 10px 30px rgba(0,0,0,.45);}
@media (min-width:981px){ body.scrolled .site-top .head{height:64px;} body.scrolled .brand .logo-img{height:42px;} }
.brand .logo-img{transition:height .35s var(--ease-royal),filter .4s;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));}
.brand:hover .logo-img{filter:drop-shadow(0 0 10px rgba(229,204,155,.45));}
.menu{border-bottom:none;}
.menu li > a{position:relative;letter-spacing:.3px;}
.menu li > a::after{content:"";position:absolute;left:16px;right:16px;bottom:6px;height:1px;background:var(--gold-line);transform:scaleX(0);transition:transform .45s var(--ease-royal);}
.menu li > a:hover::after,.menu li > a.active::after{transform:scaleX(1);}
.menu li > a.active{box-shadow:none;color:var(--champagne);}
@media (min-width:981px){
  .menu .sub{display:block!important;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .3s,transform .35s var(--ease-royal),visibility .3s;border-radius:0 0 8px 8px;}
  .menu .sub.wide{display:grid!important;}
  .menu li:hover > .sub,.menu li:focus-within > .sub{opacity:1;visibility:visible;transform:none;}
}
.search form{border-color:rgba(200,161,90,.45);}
.search button{background:var(--gold-metal);background-size:200% 100%;transition:background-position .6s;}
.search button:hover{background-position:100% 0;}

/* buttons : metallic gold with a shine that runs across */
.btn-gold,.btn-dark,.btn-outline,.offer-btn{position:relative;overflow:hidden;isolation:isolate;transition:transform .3s var(--ease-royal),box-shadow .3s,background .3s,color .3s,border-color .3s;}
.btn-gold{background:var(--gold-metal);background-size:180% 100%;color:#2A1208;border:1px solid rgba(255,240,200,.35);box-shadow:0 10px 24px -10px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.45);}
.btn-gold:hover{background-position:100% 0;transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(0,0,0,.7),0 0 0 4px rgba(200,161,90,.15);}
.btn-gold::after,.btn-dark::after,.offer-btn::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;z-index:-1;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);transition:left .8s var(--ease-royal);}
.btn-gold:hover::after,.btn-dark:hover::after,.offer-btn:hover::after,.pcard:hover .btn-dark::after{left:130%;}
.btn-dark{background:linear-gradient(135deg,var(--wine),var(--burgundy) 60%,var(--dark-burgundy));border:1px solid rgba(200,161,90,.45);}
.btn-dark:hover{transform:translateY(-1px);border-color:var(--antique-gold);}
.btn-outline:hover{transform:translateY(-1px);}

/* titles : gold metal text on dark sections, ornament draws in */
.title,.offer-title,.founder h2,.sv-head h2,.page-head h1,.pd-info h1,.sc-hero h1{letter-spacing:.2px;}
.section:not(.ivory):not(.paper) .title,.offer-title,.founder h2,.page-head h1,.sc-hero h1,.insta-band h3{
  background:linear-gradient(100deg,#FFF3D6 0%,#E5CC9B 30%,#C8A15A 50%,#F2DDA8 70%,#E5CC9B 100%);background-size:200% auto;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:goldText 7s linear infinite;}
.offer-title svg{stroke:var(--antique-gold);}
@keyframes goldText{to{background-position:200% center;}}
.ornament::before,.ornament::after{transition:width 1.1s var(--ease-royal) .2s;}
.ornament i{transition:transform 1s var(--ease-royal) .1s;}
[data-rv]:not(.in) .ornament::before,[data-rv]:not(.in) .ornament::after{width:0;}
[data-rv]:not(.in) .ornament i{transform:rotate(45deg) scale(0);}

/* ivory sections : pearl, not yellow, with a faint royal pattern */
.section.ivory,.section.paper,.about-strip,.visit,.trust{
  background-color:var(--paper);
  background-image:radial-gradient(circle at 1px 1px,rgba(184,138,59,.13) 1px,transparent 1.4px);background-size:22px 22px;}
.section.ivory .title,.section.paper .title{color:var(--burgundy);}

/* "Products we offer" : the frames and buttons were brown / salmon -> gold */
.offer-frame .fr path{stroke:rgba(200,161,90,.55);}
.offer-card:hover .fr path{stroke:var(--champagne);}
.offer-img{border-color:var(--antique-gold);box-shadow:0 0 0 7px rgba(20,5,6,.55),0 18px 34px -16px rgba(0,0,0,.8);}
.offer-name{color:var(--champagne);font-family:var(--serif);}
.offer-btn{background:transparent;color:var(--champagne);border:1px solid var(--antique-gold);border-radius:30px;padding:7px 24px;font-weight:600;font-size:12.5px;letter-spacing:.5px;}
.offer-card:hover .offer-btn{background:var(--gold-metal);color:#2A1208;border-color:transparent;}

/* product cards : soft lift, gold glow, photo zoom + shine */
.pcard{border-color:rgba(184,138,59,.4);border-radius:10px;transition:transform .5s var(--ease-royal),box-shadow .5s,border-color .4s;}
.pcard:hover{transform:translateY(-6px);box-shadow:0 26px 46px -20px rgba(0,0,0,.75),0 0 0 1px var(--antique-gold);border-color:var(--antique-gold);}
.pcard .ph-track a img{transition:transform 1.1s var(--ease-royal);}
.pcard:hover .ph-track a img{transform:scale(1.07);}
.pcard .ph::after{border-color:rgba(200,161,90,.45);transition:inset .5s var(--ease-royal),border-color .4s;}
.pcard:hover .ph::after{inset:12px;border-color:rgba(200,161,90,.9);}
.pcard .ph .shine{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%);}
.pcard:hover .ph .shine{transform:translateX(120%);transition:transform 1.1s var(--ease-royal);}
.pcard .nm{font-size:16.5px;}
.pcard .pr{color:var(--burgundy);font-family:var(--serif);font-size:18px;}
.pcard .set-tag{position:absolute;left:14px;bottom:14px;z-index:3;background:var(--gold-metal);color:#2A1208;font-size:10px;font-weight:700;letter-spacing:.6px;padding:3px 10px;border-radius:20px;text-transform:uppercase;box-shadow:0 4px 10px rgba(0,0,0,.25);}
.wish-btn{transition:transform .3s var(--ease-royal);}
.wish-btn:hover{transform:scale(1.12);}
.wish-btn.active svg{animation:heart .45s var(--ease-royal);}
@keyframes heart{50%{transform:scale(1.35);}}

/* tiles (shop by category) */
.tile .arch{transition:box-shadow .5s,transform .5s var(--ease-royal);}
.tile:hover .arch{transform:translateY(-6px);box-shadow:0 0 0 6px var(--burgundy),0 0 0 7px var(--antique-gold),0 24px 40px -18px rgba(0,0,0,.8);}
.ivory .tile:hover .arch,.paper .tile:hover .arch{box-shadow:0 0 0 6px var(--paper),0 0 0 7px var(--antique-gold),0 24px 40px -18px rgba(60,20,10,.4);}

/* promises : one gold ribbon that moves */
.promise-band{background:linear-gradient(90deg,var(--deepest),var(--dark-burgundy) 50%,var(--deepest));border-top:1px solid rgba(200,161,90,.35);border-bottom:1px solid rgba(200,161,90,.35);overflow:hidden;padding:12px 0;}
.promise-band.marquee .wrap{max-width:none;padding:0;display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:0;width:max-content;animation:marquee 38s linear infinite;}
.promise-band.marquee:hover .wrap{animation-play-state:paused;}
.promise-band.marquee span{padding:0 26px;white-space:nowrap;}
@keyframes marquee{to{transform:translateX(-50%);}}

/* side social links : quiet gold circles instead of bright brand colours */
.side-social a{background:rgba(27,6,9,.82)!important;border:1px solid rgba(200,161,90,.6);color:var(--champagne);border-radius:50%;backdrop-filter:blur(4px);}
.side-social a:hover{background:var(--gold-metal)!important;color:#2A1208;}

/* footer */
footer.site-footer{background:linear-gradient(180deg,var(--deepest),#1a0508);}
footer.site-footer::before{height:2px;background:var(--gold-line);opacity:1;}
.footer-grid a{position:relative;transition:color .3s,padding .3s;}
.footer-grid ul a:hover{padding-left:6px;}
.socials a{transition:transform .3s var(--ease-royal),background .3s;}
.socials a:hover{transform:translateY(-3px);background:var(--gold-metal);}
.copy .legal-links{display:flex;gap:14px;flex-wrap:wrap;}
.copy .legal-links a:hover{color:var(--champagne);}

/* payment charges note, set badge, set parts on the product page */
.fee-free{color:var(--champagne);background:rgba(200,161,90,.1);border-color:rgba(200,161,90,.45);}
.charges-note{font-size:12.5px;color:var(--secondary-text);margin:-2px 0 6px;}
.charges-note a,.fee-note a{color:var(--champagne);text-decoration:underline;}
.set-badge{display:inline-block;background:var(--gold-metal);color:#2A1208;font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;padding:4px 12px;border-radius:20px;margin-bottom:10px;}
.set-parts{display:grid;gap:10px;margin:6px 0 4px;}
.set-part{display:grid;grid-template-columns:1fr auto;gap:2px 14px;padding:12px 14px;border:1px solid var(--border-gold);border-left:3px solid var(--antique-gold);border-radius:8px;background:rgba(200,161,90,.07);}
.set-part .sp-head{display:flex;gap:10px;align-items:baseline;}
.set-part .sp-head b{font-family:var(--serif);font-size:17px;color:var(--light-text);font-weight:600;}
.set-part .sp-head span{font-size:11px;font-weight:700;color:#2A1208;background:var(--champagne);padding:1px 8px;border-radius:10px;}
.set-part .sp-wts,.set-part .sp-rate{grid-column:1;font-size:12.5px;color:var(--secondary-text);}
.set-part .sp-rate b{color:var(--champagne);font-weight:600;}
.set-part .sp-price{grid-column:2;grid-row:1 / span 3;align-self:center;font-family:var(--serif);font-size:19px;color:var(--antique-gold);}
.spec tr.sub-head td{padding-top:14px;color:var(--champagne)!important;font-weight:600;text-align:left!important;border-bottom:1px dashed var(--border-gold);}
.pd-price{background:linear-gradient(100deg,#FFF3D6,#E5CC9B 40%,#C8A15A 60%,#F2DDA8);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* panels and modals : a gold frame */
.modal-box,.st-box{animation:royalIn .5s var(--ease-royal);}
@keyframes royalIn{from{opacity:0;transform:translateY(24px) scale(.97);}to{opacity:1;transform:none;}}

/* ---------- 2. ANIMATIONS ---------- */

/* page loader : the logo in a turning gold ring (first page of a visit only) */
.jg-loader{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;
  background:radial-gradient(circle at 50% 45%,var(--wine),var(--dark-burgundy) 55%,var(--deepest));transition:opacity .7s ease,visibility .7s;}
.jg-loader.gone{opacity:0;visibility:hidden;pointer-events:none;}
.jg-loader .ring{position:relative;width:132px;height:132px;display:flex;align-items:center;justify-content:center;}
.jg-loader .ring::before{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(200,161,90,.2);border-top-color:var(--champagne);border-right-color:var(--antique-gold);animation:spin 1.3s linear infinite;}
.jg-loader .ring::after{content:"";position:absolute;inset:10px;border-radius:50%;border:1px dashed rgba(200,161,90,.35);animation:spin 6s linear infinite reverse;}
.jg-loader img{width:74px;height:auto;animation:breathe 1.8s ease-in-out infinite;}
.jg-loader b{font-family:var(--serif);font-weight:600;letter-spacing:6px;font-size:13px;color:var(--champagne);text-transform:uppercase;
  background:linear-gradient(100deg,var(--rich-gold),#FFF3D6,var(--rich-gold));background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldText 2.2s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes breathe{50%{transform:scale(1.06);filter:drop-shadow(0 0 14px rgba(229,204,155,.6));}}

/* thin gold line at the top that shows how far the page is read */
.jg-progress{position:fixed;left:0;top:0;height:2px;width:100%;z-index:1000;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--rich-gold),var(--champagne));box-shadow:0 0 8px rgba(229,204,155,.7);pointer-events:none;}

/* reveal on scroll : the script marks elements with data-rv */
[data-rv]{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease-royal),transform 1s var(--ease-royal);transition-delay:var(--d,0s);will-change:opacity,transform;}
[data-rv="zoom"]{transform:scale(.94);}
[data-rv="left"]{transform:translateX(-40px);}
[data-rv="right"]{transform:translateX(40px);}
[data-rv].in{opacity:1;transform:none;}

/* hero : slow royal zoom on the photo, words rise one after another, gold dust */
.hero{min-height:640px;}
.hero-slide .hero-bg-img{transform:scale(1.14);transition:transform 9s ease-out;}
.hero-slide.active .hero-bg-img{transform:scale(1);}
.hero-content > *{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease-royal),transform 1s var(--ease-royal);}
.hero-slide.active .hero-content > *{opacity:1;transform:none;}
.hero-slide.active .hero-content > *:nth-child(1){transition-delay:.35s;}
.hero-slide.active .hero-content > *:nth-child(2){transition-delay:.55s;}
.hero-slide.active .hero-content > *:nth-child(3){transition-delay:.75s;}
.hero-slide.active .hero-content > *:nth-child(4){transition-delay:.95s;}
.hero-kicker{display:inline-flex;align-items:center;gap:12px;}
.hero-kicker::before{content:"";width:38px;height:1px;background:linear-gradient(90deg,transparent,var(--champagne));}
.hero-heading{text-shadow:0 4px 30px rgba(0,0,0,.45);}
.hero-dust{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden;}
.hero-dust i{position:absolute;bottom:-10px;width:4px;height:4px;border-radius:50%;background:radial-gradient(circle,#FFF3D6,rgba(229,204,155,0) 70%);box-shadow:0 0 6px 1px rgba(229,204,155,.6);animation:dust linear infinite;opacity:0;}
@keyframes dust{0%{transform:translateY(0) translateX(0);opacity:0;}15%{opacity:.9;}100%{transform:translateY(-640px) translateX(40px);opacity:0;}}
.hero-dots .dot{position:relative;overflow:hidden;width:40px;height:3px;border-radius:3px;}
.hero-dots .dot.active{background:rgba(244,231,200,.35);}
.hero-dots .dot.active::after{content:"";position:absolute;inset:0;background:var(--antique-gold);transform-origin:0 50%;animation:dotFill 6s linear forwards;}
@keyframes dotFill{from{transform:scaleX(0);}to{transform:scaleX(1);}}
.hero-corner{transition:width .8s var(--ease-royal),height .8s var(--ease-royal);}
.hero:hover .hero-corner{width:80px;height:80px;}

/* back to top : a gold circle that fills as you scroll */
.to-top{position:fixed;left:22px;bottom:22px;z-index:190;width:48px;height:48px;border-radius:50%;border:none;padding:0;background:rgba(27,6,9,.88);color:var(--champagne);
  display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(0,0,0,.45);opacity:0;transform:translateY(20px);transition:opacity .4s,transform .4s var(--ease-royal);pointer-events:none;}
.to-top.show{opacity:1;transform:none;pointer-events:auto;}
.to-top svg.ring{position:absolute;inset:0;width:48px;height:48px;transform:rotate(-90deg);}
.to-top svg.ring circle{fill:none;stroke-width:2;}
.to-top svg.ring .bg{stroke:rgba(200,161,90,.25);}
.to-top svg.ring .fg{stroke:var(--antique-gold);stroke-dasharray:138.2;stroke-dashoffset:138.2;transition:stroke-dashoffset .15s;}
.to-top svg.arr{width:18px;height:18px;}
.to-top:hover{background:var(--gold-metal);color:#2A1208;}

/* ---------- 3. GRAND LAUNCH BANNER ---------- */
.gl-pop{position:fixed;inset:0;z-index:5000;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(12,2,4,.78);backdrop-filter:blur(5px);opacity:0;visibility:hidden;transition:opacity .6s,visibility .6s;}
.gl-pop.show{opacity:1;visibility:visible;}
.gl-box{position:relative;width:100%;max-width:560px;max-height:calc(100vh - 36px);overflow-y:auto;text-align:center;color:var(--light-text);padding:46px 34px 34px;border-radius:18px;
  background:radial-gradient(circle at 50% 0%,rgba(229,204,155,.22),transparent 55%),linear-gradient(160deg,var(--wine),var(--burgundy) 45%,var(--deepest));
  box-shadow:0 0 0 1px var(--antique-gold),0 0 0 7px rgba(27,6,9,.9),0 0 0 8px rgba(200,161,90,.55),0 40px 90px rgba(0,0,0,.7);
  transform:translateY(40px) scale(.94);transition:transform .9s var(--ease-royal);}
.gl-pop.show .gl-box{transform:none;}
.gl-box::before{content:"";position:absolute;inset:12px;border:1px solid rgba(200,161,90,.35);border-radius:12px;pointer-events:none;}
.gl-box .rays{position:absolute;left:50%;top:-140px;width:420px;height:420px;margin-left:-210px;pointer-events:none;opacity:.35;
  background:repeating-conic-gradient(from 0deg,rgba(229,204,155,.35) 0deg 4deg,transparent 4deg 18deg);border-radius:50%;
  -webkit-mask:radial-gradient(circle,#000 20%,transparent 68%);mask:radial-gradient(circle,#000 20%,transparent 68%);animation:spin 40s linear infinite;}
.gl-crown{position:relative;width:64px;height:64px;margin:0 auto 10px;color:var(--champagne);filter:drop-shadow(0 0 12px rgba(229,204,155,.55));animation:breathe 2.4s ease-in-out infinite;}
.gl-kicker{position:relative;font-family:var(--serif-alt);font-style:italic;font-size:19px;color:var(--champagne);}
.gl-title{position:relative;font-family:var(--serif);font-weight:700;font-size:clamp(34px,7vw,52px);line-height:1.05;margin:6px 0 4px;
  background:linear-gradient(100deg,#FFF3D6 0%,#E5CC9B 30%,#B88A3B 50%,#F2DDA8 70%,#FFF3D6 100%);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldText 4s linear infinite;}
.gl-date{position:relative;display:inline-flex;align-items:center;gap:12px;margin:10px 0 6px;font-family:var(--serif);font-size:22px;color:#FFF3D6;letter-spacing:.5px;}
.gl-date::before,.gl-date::after{content:"";width:46px;height:1px;background:linear-gradient(90deg,transparent,var(--antique-gold));}
.gl-date::after{transform:scaleX(-1);}
.gl-text{position:relative;font-size:14px;color:var(--secondary-text);max-width:420px;margin:8px auto 0;line-height:1.65;}
.gl-count{position:relative;display:flex;justify-content:center;gap:10px;margin:20px 0 4px;}
.gl-count div{min-width:70px;padding:10px 6px 8px;border:1px solid rgba(200,161,90,.5);border-radius:10px;background:rgba(0,0,0,.25);}
.gl-count b{display:block;font-family:var(--serif);font-size:28px;line-height:1;color:var(--champagne);font-variant-numeric:tabular-nums;}
.gl-count span{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:var(--secondary-text);}
.gl-acts{position:relative;margin-top:22px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap;}
.gl-close{position:absolute;top:16px;right:18px;z-index:3;width:34px;height:34px;border-radius:50%;border:1px solid rgba(200,161,90,.6);background:rgba(0,0,0,.25);color:var(--champagne);font-size:20px;line-height:1;}
.gl-close:hover{background:var(--antique-gold);color:var(--dark-burgundy);}
.gl-hint{position:relative;display:block;margin-top:12px;font-size:11.5px;color:rgba(205,187,145,.75);}
.gl-petal{position:absolute;top:-20px;width:12px;height:16px;border-radius:12px 0 12px 0;background:linear-gradient(135deg,#ffd27a,#c8a15a);opacity:.85;pointer-events:none;animation:petal linear infinite;}
@keyframes petal{to{transform:translateY(760px) rotate(540deg) translateX(60px);}}
@media (max-width:480px){ .gl-box{padding:40px 18px 26px;} .gl-count div{min-width:58px;} .gl-count b{font-size:22px;} .gl-date{font-size:18px;} }

/* ---------- 4. PHONE VIEW ---------- */
.mob-bar,.drawer-head,.drawer-shade{display:none;}
@media (max-width:980px){
  /* the menu opens as a royal side drawer */
  .menu{display:block!important;position:fixed;top:0;left:0;bottom:0;width:min(84vw,340px);z-index:600;max-height:none;overflow-y:auto;
        background:linear-gradient(180deg,var(--dark-burgundy),var(--deepest));border:none;border-right:1px solid rgba(200,161,90,.5);
        transform:translateX(-105%);transition:transform .5s var(--ease-royal);box-shadow:none;}
  .menu.open{transform:none;box-shadow:30px 0 60px rgba(0,0,0,.6);}
  .menu .wrap{padding:0 20px 30px;}
  .menu li > a{padding:14px 2px;font-size:14.5px;color:var(--light-text);}
  .menu li > a::after{display:none;}
  .menu .sub a{font-size:13.5px;}
  .drawer-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;border-bottom:1px solid rgba(200,161,90,.35);margin-bottom:6px;position:sticky;top:0;background:var(--dark-burgundy);z-index:2;}
  .drawer-head img{height:34px;width:auto;}
  .drawer-head button{width:36px;height:36px;border-radius:50%;border:1px solid rgba(200,161,90,.6);background:transparent;color:var(--champagne);font-size:22px;line-height:1;}
  .drawer-shade{display:block;position:fixed;inset:0;z-index:590;background:rgba(10,2,4,.6);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;}
  body.drawer-open .drawer-shade{opacity:1;visibility:visible;}
  body.drawer-open{overflow:hidden;}
  .menu li{opacity:0;transform:translateX(-16px);transition:opacity .4s,transform .5s var(--ease-royal);}
  .menu.open li{opacity:1;transform:none;}
  .menu.open li:nth-child(2){transition-delay:.05s;} .menu.open li:nth-child(3){transition-delay:.1s;} .menu.open li:nth-child(4){transition-delay:.15s;}
  .menu.open li:nth-child(5){transition-delay:.2s;} .menu.open li:nth-child(6){transition-delay:.25s;} .menu.open li:nth-child(7){transition-delay:.3s;} .menu.open li:nth-child(n+8){transition-delay:.35s;}
  .hero,.hero-content{min-height:520px;}
}
@media (max-width:760px){
  body{font-size:14.5px;padding-bottom:64px;}
  .topbar .rates{animation:none;}
  .site-top .head{padding-top:8px;}
  .head{gap:6px;}
  .search{padding-bottom:10px;}
  .search input{padding:10px 16px;font-size:13px;}
  .ha{padding:6px 6px;}

  /* hero : taller photo, words at the bottom on a soft shade */
  .hero,.hero-content{min-height:72vh;max-height:620px;}
  .hero-content{justify-content:flex-end;padding-bottom:64px;}
  .hero-scrim{background:linear-gradient(0deg,rgba(27,6,9,.92) 0%,rgba(27,6,9,.55) 45%,rgba(27,6,9,.05) 80%)!important;}
  .hero-heading{font-size:30px;margin-bottom:12px;}
  .hero-sub{font-size:14px;margin-bottom:20px;}
  .hero-content .btn-gold{align-self:stretch;}

  .section{padding:44px 0;}
  .title,.offer-title{font-size:25px;}
  .section-head{margin-bottom:20px;}

  /* product cards : two in a row, clean */
  .pgrid,.pgrid.three{gap:10px!important;}
  .pcard{border-radius:8px;}
  .pcard .info{padding:10px 10px 12px;}
  .pcard .nm{font-size:14px;}
  .pcard .meta{font-size:10.5px;margin:3px 0 8px;line-height:1.4;}
  .pcard .pr{font-size:15.5px;}
  .pcard .pr small{font-size:10px;}
  .pcard .acts{grid-template-columns:1fr 1fr;gap:5px;}
  .pcard .acts .btn-outline,.pcard .acts .btn-dark{padding:9px 2px;font-size:10.5px;letter-spacing:.2px;}
  .pcard .tagno{left:8px;top:8px;font-size:9.5px;padding:2px 7px;}
  .wish-btn{top:8px;right:8px;width:32px;height:32px;}
  .pcard:hover{transform:none;}

  /* the floating links move out of the way */
  .side-social{display:none;}
  .chat-fab{bottom:78px!important;right:14px;width:48px;height:48px;}
  .chat-box{bottom:134px;}
  .to-top{left:auto;right:14px;bottom:136px;width:42px;height:42px;}
  .to-top svg.ring{width:42px;height:42px;}
  .push-ask{bottom:76px;}

  /* bottom bar like an app */
  .mob-bar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:400;height:62px;
           background:linear-gradient(180deg,var(--dark-burgundy),var(--deepest));border-top:1px solid rgba(200,161,90,.55);box-shadow:0 -10px 30px rgba(0,0,0,.45);
           padding-bottom:env(safe-area-inset-bottom);}
  .mob-bar a,.mob-bar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:none;border:none;color:var(--secondary-text);font-size:10.5px;font-weight:500;position:relative;}
  .mob-bar svg{width:21px;height:21px;}
  .mob-bar .on{color:var(--champagne);}
  .mob-bar .on::before{content:"";position:absolute;top:0;left:30%;right:30%;height:2px;background:var(--antique-gold);border-radius:0 0 3px 3px;}
  .mob-bar .count-dot{top:6px;right:calc(50% - 20px);}
  /* product page : the buy bar replaces the bottom bar */
  body.has-buybar .mob-bar{display:none;}
  body.has-buybar{padding-bottom:70px;}
  body.has-buybar .chat-fab{bottom:82px!important;}

  .footer-grid{gap:18px;}
  .copy .wrap{flex-direction:column;align-items:center;text-align:center;}
  .set-part{grid-template-columns:1fr;}
  .set-part .sp-price{grid-column:1;grid-row:auto;font-size:17px;}
  .gl-pop{align-items:flex-end;padding:10px;}
}
@media (max-width:380px){
  .pcard .acts{grid-template-columns:1fr;}
  .hero-heading{font-size:26px;}
}

/* ---------- 5. LESS MOTION when the phone / computer asks for it ---------- */
@media (prefers-reduced-motion:reduce){
  [data-rv]{opacity:1!important;transform:none!important;}
  .hero-slide .hero-bg-img{transform:none!important;}
  .promise-band.marquee .wrap{animation:none!important;}
  .hero-dust,.gl-petal,.jg-loader{display:none!important;}
}
@media print{ .jg-loader,.jg-progress,.to-top,.mob-bar,.gl-pop{display:none!important;} }

/* payment charges table + calculator */
.charges-table td:nth-child(n+2),.charges-table th:nth-child(n+2){text-align:right;white-space:nowrap;}
.charges-table td b{color:var(--champagne);font-weight:600;}
.fee-all{margin-top:10px;font-size:13px;}
.fee-all summary{cursor:pointer;color:var(--champagne);font-weight:600;padding:6px 0;}
.fee-box{border-color:rgba(200,161,90,.55);background:linear-gradient(160deg,rgba(200,161,90,.1),rgba(0,0,0,.15));}
.fee-lines .fee-total b{font-family:var(--serif);font-size:19px;}
.gl-petal{z-index:0;opacity:.6;}
.gl-box > *:not(.gl-petal):not(.rays){z-index:1;}
.gl-box .gl-close{z-index:3;}
@media (max-width:980px){ body.drawer-open .site-top{z-index:700;} }

/* ---------- 6. PAY DIRECTLY TO OUR BANK + SCREENSHOT (includes/bank-pay.php) ---------- */
.pay-or{display:flex;align-items:center;gap:14px;margin:26px 0 16px;color:var(--champagne);font-family:var(--serif-alt);font-style:italic;font-size:17px;}
.pay-or::before,.pay-or::after{content:"";flex:1;height:1px;background:var(--gold-line);}
.bankpay{border:1px solid rgba(200,161,90,.55);border-radius:12px;padding:18px;background:linear-gradient(160deg,rgba(200,161,90,.1),rgba(0,0,0,.18));text-align:left;}
.bp-head h3{font-size:20px;color:var(--champagne);}
.bp-head p{font-size:13.5px;color:var(--secondary-text);margin:4px 0 12px;}
.bp-head b{color:var(--champagne);}
.bp-steps{display:grid;gap:14px;}
.bp-step{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:14px;border:1px solid var(--border-soft);border-radius:10px;background:rgba(0,0,0,.14);}
.bp-num{width:32px;height:32px;border-radius:50%;background:var(--gold-metal);color:#2A1208;font-weight:700;display:flex;align-items:center;justify-content:center;font-family:var(--serif);}
.bp-body > b{display:block;font-size:15px;color:var(--light-text);margin:4px 0 10px;}
.bp-pay{display:grid;grid-template-columns:190px 1fr;gap:16px;align-items:start;}
.bp-qr{width:100%;border-radius:10px;background:#fff;padding:6px;box-shadow:0 10px 24px -12px rgba(0,0,0,.7);}
.bp-upi-app{width:100%;}
.bp-hint{display:block;font-size:12px;color:var(--secondary-text);margin:6px 0 10px;}
.bp-dl div{display:grid;grid-template-columns:104px 1fr;gap:8px;padding:6px 0;border-bottom:1px solid var(--border-soft);font-size:13.5px;}
.bp-dl dt{color:var(--secondary-text);}
.bp-dl dd{display:flex;justify-content:space-between;align-items:center;gap:8px;color:var(--light-text);font-weight:600;word-break:break-all;}
.bp-dl button{flex-shrink:0;background:transparent;border:1px solid var(--antique-gold);color:var(--champagne);border-radius:20px;font-size:11px;padding:3px 10px;}
.bp-dl button:hover{background:var(--antique-gold);color:var(--dark-burgundy);}
.bp-file{display:block;cursor:pointer;margin-bottom:12px;}
.bp-file input{position:absolute;opacity:0;width:1px;height:1px;}
.bp-file-box{display:flex;align-items:center;gap:12px;border:1.5px dashed var(--antique-gold);border-radius:10px;padding:14px;background:rgba(200,161,90,.06);color:var(--champagne);font-size:13.5px;}
.bp-file-box img{width:64px;height:84px;object-fit:cover;border-radius:6px;}
.bp-file-box em{font-style:normal;}
.bp-file input:focus-visible + .bp-file-box{outline:2px solid var(--champagne);}
.bp-fields{gap:0 12px;}
.bp-fields label small{font-weight:400;opacity:.75;}
@media (max-width:640px){ .bp-pay{grid-template-columns:1fr;} .bp-qr{max-width:240px;margin:0 auto;} .bp-step{grid-template-columns:1fr;} .bp-num{display:none;} }
@media (max-width:640px){
  .bankpay{padding:14px 12px;}
  .bp-step{padding:0;border:none;background:none;}
  .bp-dl div{grid-template-columns:1fr auto;gap:2px 8px;}
  .bp-dl dt{grid-column:1 / -1;font-size:11.5px;}
  .bp-dl dd{grid-column:1 / -1;}
}
.bp-file-box img[hidden]{display:none;}
.bp-file-box::before{content:"";flex:0 0 40px;height:40px;border-radius:50%;background:rgba(200,161,90,.15) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E5CC9B' stroke-width='1.8'%3E%3Cpath d='M12 16V4M7 9l5-5 5 5M4 20h16'/%3E%3C/svg%3E") center/20px no-repeat;}
.bp-file-box:has(img:not([hidden]))::before{display:none;}


/* =====================================================================
   7. DESIGN PASS : rows that fill the screen, calmer rhythm, a real phone layout
   ===================================================================== */

/* ---- one rhythm for every section heading ---- */
.section-head{align-items:center;}
.title,.offer-title{font-size:clamp(25px,2.6vw,36px);}
.offer-title{justify-content:center;font-weight:600;}
.offer{padding:64px 0;}
.section.deep{background:linear-gradient(180deg,var(--dark-burgundy),var(--deepest));}

/* ---- "Shop by category" : with 6 or fewer categories the tiles share the whole row ---- */
.h-rail.fill{display:grid;overflow:visible;gap:30px;padding:8px 0 4px;}
.h-rail.fill .tile{flex:none;width:auto;}
.h-rail.fill .tile .arch{aspect-ratio:4/5;}
.h-rail.fill.n1{grid-template-columns:minmax(0,260px);justify-content:center;}
.h-rail.fill.n2{grid-template-columns:repeat(2,minmax(0,260px));justify-content:center;}
.h-rail.fill.n3{grid-template-columns:repeat(3,minmax(0,1fr));}
.h-rail.fill.n4{grid-template-columns:repeat(4,minmax(0,1fr));}
.h-rail.fill.n5{grid-template-columns:repeat(5,minmax(0,1fr));}
.h-rail.fill.n6{grid-template-columns:repeat(6,minmax(0,1fr));}
.h-rail.fill .tile .t-name{font-size:19px;}
.section-head:has(+ .h-rail.fill) .rail-btns button{display:none;}

/* ---- "Gold / Diamond products we offer" : the cards share the row equally, all the same size ---- */
.offer-grid{display:grid;gap:40px 34px;margin:0 auto;}
.offer-grid.n1{grid-template-columns:minmax(0,1fr);max-width:290px;}
.offer-grid.n2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:620px;}
.offer-grid.n3{grid-template-columns:repeat(3,minmax(0,1fr));max-width:950px;}
.offer-grid.n4{grid-template-columns:repeat(4,minmax(0,1fr));}
.offer-grid.n5{grid-template-columns:repeat(5,minmax(0,1fr));}
.offer-card{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;}
.offer-frame{width:100%;height:auto;aspect-ratio:10/11;padding:9% 8.5%;}
.offer-img{position:relative;width:100%;height:100%;}
.offer-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.offer-name{width:100%;min-height:2.6em;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.offer-count{min-height:1.5em;}
.offer-btn{margin-top:auto;}
@media (max-width:1150px){ .offer-grid.n5{grid-template-columns:repeat(4,minmax(0,1fr));} .h-rail.fill.n6{grid-template-columns:repeat(3,minmax(0,1fr));} .h-rail.fill.n5{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;} }
@media (max-width:900px){ .offer-grid.n4,.offer-grid.n5{grid-template-columns:repeat(3,minmax(0,1fr));} .offer-grid{gap:30px 20px;} }

/* ---- new arrivals : with fewer than 4 pieces they sit in the middle, not stretched ---- */
.pgrid.few{grid-template-columns:repeat(auto-fit,minmax(0,300px));justify-content:center;}

/* ---- founder letter : two paragraphs, the rest opens on request ---- */
.letter-more[hidden]{display:none;}
.letter-toggle{background:none;border:none;padding:0;margin:2px 0 10px;color:var(--champagne);font-size:14px;font-weight:600;letter-spacing:.3px;border-bottom:1px solid var(--antique-gold);}
.letter-toggle:hover{color:#fff;}
.founder{gap:64px;}
.founder .letter p{font-size:19px;}

/* ---- product card : calmer text lines ---- */
.pcard .meta{display:flex;flex-wrap:wrap;gap:2px 10px;}
.pcard .meta span + span::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--rich-gold);margin:0 8px 2px 0;vertical-align:middle;}
.pcard .m-pur{font-weight:700;color:var(--burgundy);}

/* =====================================================================
   PHONE (760 px and below)
   ===================================================================== */
@media (max-width:760px){
  .wrap{padding:0 16px;}
  .section,.offer{padding:40px 0;}
  .title,.offer-title{font-size:24px;}
  .offer-title{margin-bottom:24px;}
  .section-head{margin-bottom:18px;gap:10px;}
  .link-more{font-size:12px;}

  /* top bar : today's rates move slowly, so every purity can be read */
  .topbar .rates{overflow:hidden;position:relative;}
  .topbar .rates .rt-move{display:inline-flex;flex-shrink:0;gap:18px;animation:rtMove 22s linear infinite;padding-right:18px;}
  .topbar .insta{display:none;}

  /* hero */
  .hero,.hero-content{min-height:66vh;}
  .hero-content{padding-bottom:58px;}
  .hero-heading{font-size:29px;}
  .hero-kicker{font-size:15px;}

  /* founder : small round photo next to the name, then the letter */
  .founder{gap:20px;}
  .founder .portrait{display:grid;grid-template-columns:104px 1fr;gap:16px;align-items:center;max-width:none;padding:0;}
  .founder .portrait .arch{aspect-ratio:1;border-radius:50%;box-shadow:0 0 0 4px var(--burgundy),0 0 0 5px var(--border-gold);}
  .founder .mono{font-size:54px;}
  .founder .f-cap{text-align:left;margin:0;}
  .founder .f-cap b{font-size:19px;}
  .certs{display:flex;margin-top:8px;gap:5px;}
  .certs li{font-size:11.5px;padding:4px 10px 4px 7px;}
  .certs svg{width:14px;height:14px;}
  .founder h2{font-size:24px;margin-bottom:12px;}
  .founder .letter p{font-size:16.5px;line-height:1.7;margin-bottom:12px;}
  .founder .quote{display:none;}
  .founder .sign{font-size:22px;}
  .journey{grid-template-columns:1fr 1fr;gap:12px;margin-top:20px;padding-top:16px;}
  .journey .line{display:none;}
  .journey b{font-size:24px;}
  .journey div:last-child{text-align:left;}

  /* about strip : 4 facts in a 2 x 2 box */
  .about-strip{padding:26px 0;}
  .about-line{font-size:18px;}
  .about-facts{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid rgba(184,138,59,.4);border-radius:10px;overflow:hidden;}
  .about-facts div{padding:12px 14px!important;border-left:none!important;border-bottom:1px solid rgba(184,138,59,.3);}
  .about-facts div:nth-child(odd){border-right:1px solid rgba(184,138,59,.3)!important;}
  .about-facts div:nth-last-child(-n+2){border-bottom:none;}
  .about-facts b{font-size:22px;}

  /* shop by category : swipe sideways on a phone, 2.5 tiles visible */
  .h-rail.fill{display:flex;overflow-x:auto;gap:14px;scroll-snap-type:x mandatory;padding-bottom:10px;}
  .h-rail .tile,.h-rail.fill .tile{flex:0 0 38%!important;}
  .h-rail .tile .t-name,.h-rail.fill .tile .t-name{font-size:14.5px;margin-top:10px;}

  /* products we offer : 2 equal cards, the whole card is the link (no extra button) */
  .offer-grid,.offer-grid.n3,.offer-grid.n4,.offer-grid.n5{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px;max-width:none;}
  .offer-grid.n1{max-width:200px;}
  .offer-btn{display:none;}
  .offer-name{font-size:14.5px;margin-top:10px;min-height:0;}
  .offer-img{box-shadow:0 0 0 4px rgba(20,5,6,.55);}

  /* product cards : name, purity, one weight line, price, two buttons */
  .pcard .wts{display:block;border:none;background:none;margin:0 0 6px;}
  .pcard .wts > div{display:none;}
  .pcard .wts > div:last-child{display:block;text-align:left;padding:0;}
  .pcard .wts > div:last-child span{display:inline;font-size:11px;letter-spacing:0;text-transform:none;}
  .pcard .wts > div:last-child span::after{content:" weight ";}
  .pcard .wts > div:last-child b{display:inline;font-size:12px;}
  .pcard .meta .m-code,.pcard .meta .m-huid{display:none;}
  .pcard .meta{margin:2px 0 4px;}
  .pcard .nm{font-size:14px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
  .pcard .pr{font-size:16px;}
  .pcard .acts{margin-top:8px;}
  .pcard .acts .btn-outline,.pcard .acts .btn-dark{min-height:36px;}
  .pcard .set-tag{left:8px;bottom:8px;font-size:9px;padding:2px 8px;}

  /* schemes */
  .plan{padding:20px 16px;}
  .plan h3{font-size:21px;}

  /* why choose us : 2 x 3 small boxes instead of 6 tall ones */
  .why{grid-template-columns:1fr 1fr!important;margin-top:20px;}
  .why div{padding:16px 12px;}
  .why svg{width:22px;height:22px;margin-bottom:8px;}
  .why h3{font-size:15px;margin-bottom:4px;}
  .why p{font-size:12px;line-height:1.5;}

  /* expertise */
  .expert{gap:18px;}
  .expert li{padding:14px 0;gap:12px;grid-template-columns:16px 1fr;}
  .expert li h3{font-size:17px;}
  .expert li p{font-size:13px;}

  /* offers / custom jewellery */
  .promo > div{padding:32px 20px;}
  .promo h3{font-size:26px;}
  .promo .big{font-size:20px;}

  /* reviews, instagram band, visit, footer */
  .insta-band{padding:26px 0;}
  .insta-band h3{font-size:21px;}
  .footer-grid h4{margin-bottom:6px;}
  .footer-grid a{font-size:13px;}

  /* floating buttons : only chat stays, above the bottom bar */
  .to-top{display:none!important;}
  .chat-fab{width:46px;height:46px;bottom:74px!important;right:12px;}
  .chat-fab svg{width:21px;height:21px;}
}
@keyframes rtMove{to{transform:translateX(-100%);}}

/* products we offer : rows of equal cards, an unfinished last row sits in the middle (no empty gap at the side) */
.offer-grid{display:flex!important;flex-wrap:wrap;justify-content:center;--gap:34px;--cols:var(--n,4);gap:40px var(--gap);}
.offer-grid > .offer-card{flex:0 0 calc((100% - (var(--cols,4) - 1) * var(--gap)) / var(--cols,4));max-width:300px;}
.offer-grid.n4 > .offer-card,.offer-grid.n5 > .offer-card{max-width:none;}
@media (max-width:1150px){ .offer-grid.n5{--cols:4;} }
@media (max-width:900px){ .offer-grid.n4,.offer-grid.n5{--cols:3;} .offer-grid{--gap:20px;} }
@media (max-width:760px){ .offer-grid,.offer-grid.n3,.offer-grid.n4,.offer-grid.n5{--cols:2;--gap:12px;gap:22px 12px;} .offer-grid.n1{--cols:1;} .offer-grid.n1 > .offer-card{max-width:200px;} }
.founder .f-cap span{display:block;}
.founder .f-cap .certs{margin-left:auto;margin-right:auto;}
@media (max-width:760px){ .founder .f-cap .certs{margin-left:0;} }

/* =====================================================================
   8. PAYMENT CHARGES CALCULATOR (includes/fee-box.php) : a light ivory bill card, dark readable text
   ===================================================================== */
.fee-box{margin-top:20px;padding:0;border:1px solid var(--antique-gold);border-radius:12px;overflow:hidden;
  background:var(--paper);color:#2B1A17;box-shadow:0 18px 40px -22px rgba(0,0,0,.7);text-align:left;}
.fee-box h3{margin:0;padding:14px 18px 2px;font-family:var(--serif);font-size:19px;color:var(--burgundy);}
.fee-box > .fee-note:first-of-type{padding:0 18px;margin:2px 0 12px;font-size:13px;color:#6A5446;}
.fee-box .fee-note{color:#6A5446;}
.fee-box .fee-row{padding:0 18px;gap:12px 14px;align-items:flex-start;}
.fee-box .fee-row label{color:#5b4636;font-size:12.5px;font-weight:600;letter-spacing:.2px;flex:1 1 200px;}
.fee-box .fee-row select,.fee-box .fee-row input[type=text]{
  width:100%;height:46px;background:#fff;color:#2B1A17;border:1.5px solid rgba(184,138,59,.6);border-radius:8px;
  padding:0 12px;font-size:15px;font-weight:600;font-family:var(--sans);-webkit-text-fill-color:#2B1A17;}
.fee-box .fee-row select:focus,.fee-box .fee-row input[type=text]:focus{outline:none;border-color:var(--rich-gold);box-shadow:0 0 0 3px rgba(200,161,90,.28);}
.fee-box .fee-row input::placeholder{color:#a8957c;font-weight:400;-webkit-text-fill-color:#a8957c;}
.fee-box .fee-row small{display:inline-block;align-self:flex-start;min-height:0;margin-top:2px;font-size:11.5px;font-weight:700;color:var(--burgundy);}
.fee-box .fee-row small:not(:empty){background:rgba(200,161,90,.22);border:1px solid rgba(184,138,59,.5);border-radius:20px;padding:2px 10px;}
.fee-box .fee-row .fee-intl{flex:1 1 100%;flex-direction:row;align-items:center;gap:8px;font-weight:500;color:#5b4636;}
.fee-box .fee-row .fee-intl input{width:17px;height:17px;accent-color:var(--rich-gold);}

/* the bill : bill amount, the charge, and "You pay" in a band */
.fee-box .fee-lines{margin:14px 0 0;border-top:1px dashed rgba(184,138,59,.6);}
.fee-box .fee-lines div{padding:11px 18px;font-size:14px;color:#2B1A17;border-bottom:1px solid rgba(184,138,59,.22);}
.fee-box .fee-lines span{color:#6A5446;}
.fee-box .fee-lines b{color:#2B1A17;font-weight:700;white-space:nowrap;}
.fee-box .fee-lines div:nth-child(2) b{color:#a3142c;}
.fee-box .fee-lines div:nth-child(2) b::before{content:"+ ";}
.fee-box .fee-lines .fee-total{background:linear-gradient(120deg,var(--wine),var(--burgundy));border-bottom:none;padding:14px 18px;align-items:center;}
.fee-box .fee-lines .fee-total span{color:var(--champagne);font-weight:600;font-size:14px;}
.fee-box .fee-lines .fee-total b{color:#FFF3D6;font-family:var(--serif);font-size:24px;}
.fee-box > .fee-note:last-of-type{padding:10px 18px 0;margin:0;font-size:12px;}

/* every way of paying : a small table inside the card */
.fee-box .fee-all{padding:6px 18px 14px;margin:0;}
.fee-box .fee-all summary{color:var(--burgundy);font-weight:700;font-size:13px;padding:8px 0;}
.fee-box .fee-all summary:hover{color:var(--rich-gold);}
.fee-box .charges-table th{color:var(--rich-gold);border-bottom-color:rgba(184,138,59,.6);}
.fee-box .charges-table td{color:#2B1A17;border-bottom-color:rgba(184,138,59,.22);font-size:13px;}
.fee-box .charges-table td b{color:#2e7d32;}

@media (max-width:640px){
  .fee-box .fee-row{flex-direction:column;}
  .fee-box .fee-row label{flex:1 1 auto;width:100%;}
  .fee-box .fee-lines div{padding:10px 14px;font-size:13px;}
  .fee-box .fee-lines div span{max-width:62%;}
  .fee-box .fee-lines .fee-total b{font-size:21px;}
  .fee-box h3,.fee-box .fee-row,.fee-box > .fee-note,.fee-box .fee-all{padding-left:14px;padding-right:14px;}
}

/* "How will you pay?" : one line per way of paying, its charge on the right */
.pm-list{display:grid;gap:8px;padding:0 18px;}
.pm{display:grid;grid-template-columns:20px 1fr auto;gap:10px;align-items:center;padding:11px 14px;border:1.5px solid rgba(184,138,59,.45);border-radius:10px;background:#fff;cursor:pointer;transition:border-color .2s,box-shadow .2s,background .2s;}
.pm:hover{border-color:var(--rich-gold);}
.pm input{width:18px;height:18px;margin:0;accent-color:var(--burgundy);}
.pm-name{font-size:14px;font-weight:600;color:#2B1A17;}
.pm-fee{text-align:right;font-size:14px;font-weight:700;color:#a3142c;white-space:nowrap;line-height:1.2;}
.pm-fee small{display:block;font-size:11px;font-weight:500;color:#8b7562;}
.pm-fee b{color:#2e7d32;font-weight:700;}
.pm.on{border-color:var(--burgundy);background:#FFF8E8;box-shadow:0 0 0 3px rgba(200,161,90,.25);}
.pm input:focus-visible{outline:2px solid var(--rich-gold);outline-offset:2px;}
.fee-box .fee-lines div:nth-child(2) b::before{content:none;}
@media (max-width:640px){ .pm-list{padding:0 14px;} .pm{padding:10px 12px;} .pm-name{font-size:13px;} }
.fee-box .fee-note a{color:var(--burgundy);font-weight:600;}
.fee-box + [data-pay],.fee-box + .btn-gold{margin-top:16px!important;}

/* payment step : the GST line under the payment charge, and the "cash at the store" box */
.fee-box .fee-lines div:nth-child(3) b{color:#a3142c;}
.cashpay .bp-dl dd{word-break:normal;}
.cashpay .bp-dl small{font-size:11.5px;color:var(--secondary-text);}