/* ========================================================================== 
   UPS BATTERY SHOP — Brand Identity Experience v5
   Corporate palette (authoritative, extracted from supplied logo):
   Battery Yellow #FEE01C
   Black          #111111
   Warm Ivory     #FFFDF2

   Loaded on public pages before the final Signature layer. This layer deliberately adds richer visual
   storytelling and interaction while keeping commerce/CMS logic untouched.
   ========================================================================== */

:root{
  --brand-navy:#111111;
  --brand-steel:#FEE01C;
  --brand-ice:#FFF3A3;
  --brand-amber:#FEE01C;
  --brand-white:#fff;

  /* shared tokens from earlier layers are intentionally re-tinted here so
     legacy/less-common components cannot fall back to the old cyan palette. */
  --brand:#111111;
  --accent:#FEE01C;
  --rf-bg:#fffdf2;
  --rf-paper:#fff;
  --rf-paper-2:#fffdf8;
  --rf-ink:#111111;
  --rf-muted:#666666;
  --rf-line:#e8dfa8;
  --rf-line-strong:#ddd2a0;
  --rf-navy:#111111;
  --rf-navy-2:#FEE01C;
  --rf-cyan:#FEE01C;
  --rf-cyan-soft:#fff9d8;
  --rf-orange:#FEE01C;
  --rf-orange-soft:#fff8d6;
  --aq:#111111;
  --aq-deep:#111111;
  --aq-mid:#FEE01C;
  --aq-bright:#FFF3A3;
  --aq-light:#FFF3A3;
  --aq-soft:#fff9d8;
  --aq-soft-2:#fffdf7;
  --cta:#FEE01C;
  --cta-2:#FEE01C;
  --cta-soft:#fff8d6;
  --ink:#111111;
  --muted:#666666;
  --line:#e8dfa8;
  --ind-primary-deep:#111111;
  --ind-primary-soft:#fff9d8;
  --ind-accent-soft:#fff8d6;
  --ind-surface:#fffdf2;
  --ind-line:#e8dfa8;
  --ind-ink:#111111;
  --ind-muted:#666666;

  /* remap previous design tokens to the official identity */
  --px-bg:#fffdf2;
  --px-paper:#ffffff;
  --px-paper-soft:#fffdf8;
  --px-ink:#111111;
  --px-ink-2:#3d3d3d;
  --px-muted:#666666;
  --px-line:#1111111a;
  --px-line-2:#1111112b;
  --px-deep:#111111;
  --px-deep-2:#444444;
  --px-aqua:#FEE01C;
  --px-aqua-2:#FFF3A3;
  --px-aqua-soft:#fff9d8;
  --px-warm:#FEE01C;
  --px-warm-soft:#fff8d6;
  --fx-cyan:#FFF3A3;
  --fx-blue:#FEE01C;
  --fx-deep:#111111;
  --fx-teal:#FEE01C;
  --fx-orange:#FEE01C;
  --fx-glow:#FEE01C40;
  --fx-glow-strong:#FFF3A386;
  --fx-border:#FFF3A366;
  --v5-ease:cubic-bezier(.16,1,.3,1);
  --v5-spring:cubic-bezier(.2,1.2,.36,1);
  --v5-shadow:0 26px 70px #11111114;
  --v5-shadow-deep:0 36px 95px #11111129;
}

/* --- richer global canvas ------------------------------------------------ */
body.public{
  color:var(--brand-navy);
  background:
    radial-gradient(55rem 34rem at 102% 2%,#FFF3A34d,transparent 67%),
    radial-gradient(48rem 34rem at -8% 32%,#FEE01C1f,transparent 70%),
    linear-gradient(180deg,#fffdf8 0%,#fff9e5 42%,#fffdf5 100%);
}
body.public::before{
  opacity:.56;
  background-image:
    radial-gradient(circle at center,#11111116 0 1px,transparent 1.3px),
    linear-gradient(120deg,transparent 0 46%,#FFF3A311 46% 47%,transparent 47% 100%);
  background-size:30px 30px,210px 210px;
}
body.public::after{
  content:"";
  position:fixed;
  z-index:-3;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(125deg,transparent 0 68%,#FEE01C0b 68% 69%,transparent 69%),
    radial-gradient(38rem 24rem at 88% 72%,#FEE01C12,transparent 74%);
}
body.public .fx-atmosphere::before{
  background:radial-gradient(circle at 52% 48%,#FEE01C2d,#FFF3A31a 47%,transparent 72%);
}
body.public .fx-atmosphere::after{
  background:radial-gradient(circle at 42% 48%,#FFF3A33d,#FEE01C14 54%,transparent 74%);
}
body.public .fx-pointer-glow{
  background:radial-gradient(circle,#FFF3A32f 0,#FEE01C12 42%,transparent 70%);
}
body.public .fx-bubble{
  border-color:#FEE01C3d;
  background:#ffffff70;
  box-shadow:inset 0 0 12px #fff,0 0 18px #FFF3A326;
}

/* --- top progress -------------------------------------------------------- */
body.public .px-scroll-progress{
  height:4px;
  background:linear-gradient(90deg,var(--brand-navy) 0 28%,var(--brand-steel) 28% 63%,var(--brand-ice) 63% 82%,var(--brand-amber) 82% 100%);
  box-shadow:0 0 18px #FEE01C5c;
}

/* --- announcement + floating command header ---------------------------- */
body.public .promo-bar{
  position:relative;
  overflow:hidden;
  min-height:34px;
  background:var(--brand-navy);
  color:#fff8d6;
  border:0;
}
body.public .promo-bar::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(110deg,transparent 0 18%,#FEE01C20 18% 34%,transparent 34% 62%,#FEE01C19 62% 72%,transparent 72%),
    radial-gradient(280px 75px at 74% 0,#FFF3A31e,transparent 72%);
  animation:v5PromoDrift 12s linear infinite alternate;
}
@keyframes v5PromoDrift{to{transform:translateX(-5%) scaleX(1.08)}}
body.public .promo-bar>*{position:relative;z-index:1}

body.public .site-header.upgraded-header{
  background:#fffdf8e8;
  border-bottom:1px solid #11111112;
  backdrop-filter:blur(24px) saturate(145%);
}
body.public.px-scrolled .site-header.upgraded-header{
  background:#ffffffee;
  box-shadow:0 18px 50px #11111112,0 1px 0 #11111112;
}
body.public .site-header.upgraded-header::after{
  inset-inline:7%;
  height:2px;
  background:linear-gradient(90deg,transparent,#FEE01Caa,#FEE01C99,transparent);
}
body.public .upgraded-header .brand-icon{
  border-radius:17px 17px 17px 5px;
  background:
    radial-gradient(circle at 27% 20%,#ffffff55,transparent 28%),
    linear-gradient(145deg,var(--brand-steel),var(--brand-navy) 76%);
  box-shadow:inset 0 0 0 1px #ffffff29,0 13px 30px #11111131,0 0 0 5px #FFF3A31d;
}
body.public .upgraded-header .brand-icon::after{
  background:conic-gradient(from 0deg,transparent,#FFF3A3a6,transparent 27%,#FEE01C59,transparent 47%);
}
body.public .nav-main>a,body.public .header-dropdown>summary{
  color:#5f5f5f;
  font-weight:700;
}
body.public .nav-main>a:hover,body.public .nav-main>a[aria-current="page"],
body.public .header-dropdown>summary:hover,body.public .header-dropdown[data-current="true"]>summary{
  color:var(--brand-navy);
  background:linear-gradient(145deg,#fff,#FFF3A326);
  box-shadow:inset 0 0 0 1px #FEE01C2c,0 8px 22px #1111110c;
}
body.public .nav-main>a::after,body.public .header-dropdown>summary::after{
  height:3px;
  background:linear-gradient(90deg,var(--brand-steel),var(--brand-amber));
}

/* --- buttons: stronger signature, still restrained --------------------- */
body.public .button,
body.public .header-cta,
body.public .mini-cart-button{
  transition:transform .3s var(--v5-spring),box-shadow .3s var(--v5-ease),background .3s,border-color .3s,color .3s;
}
body.public .button.primary,body.public .mini-cart-button{
  background:
    radial-gradient(circle at 20% 0,#FEE01C4a,transparent 34%),
    linear-gradient(135deg,#1b1b1b,var(--brand-navy) 68%);
  border-color:var(--brand-navy);
  box-shadow:0 14px 30px #11111131,inset 0 1px 0 #ffffff24;
}
body.public .button.primary:hover,body.public .mini-cart-button:hover{
  background:
    radial-gradient(circle at 20% 0,#FFF3A35c,transparent 34%),
    linear-gradient(135deg,#242424,var(--brand-navy) 72%);
  box-shadow:0 20px 42px #1111113b,0 0 0 5px #FFF3A328;
}
body.public .button.accent{
  color:#fff;
  border-color:var(--brand-amber);
  background:
    radial-gradient(circle at 22% 0,#ffffff2e,transparent 34%),
    linear-gradient(135deg,#fee01c,var(--brand-amber) 64%,#b99b00);
  box-shadow:0 14px 30px #FEE01C38,inset 0 1px 0 #ffffff49;
}
body.public .button.accent:hover{box-shadow:0 20px 42px #FEE01C4a,0 0 0 5px #FEE01C1b}
body.public .button.outline,body.public .header-cta{
  color:var(--brand-navy);
  border-color:#FEE01C4c;
  background:linear-gradient(145deg,#ffffffde,#FFF3A31c);
}
body.public .button.outline:hover,body.public .header-cta:hover{
  border-color:var(--brand-steel);
  background:#fff;
  box-shadow:0 12px 28px #11111114;
}
body.public .mini-cart-button .count{background:var(--brand-amber);box-shadow:0 0 0 2px var(--brand-navy)}

/* --- hero: asymmetric immersive composition ----------------------------- */
body.public .wp-hero{
  position:relative;
  padding-top:32px;
  padding-bottom:26px;
}
body.public .wp-hero::before{
  height:790px;
  background:
    radial-gradient(48rem 35rem at 88% 42%,#FFF3A347,transparent 69%),
    radial-gradient(36rem 24rem at 11% 7%,#FEE01C12,transparent 68%),
    linear-gradient(180deg,#ffffffb3,transparent 92%);
}
body.public .wp-hero-grid{
  min-height:670px;
  border:1px solid #FEE01C4a;
  border-radius:42px 42px 42px 14px;
  overflow:hidden;
  isolation:isolate;
  background:
    linear-gradient(112deg,#ffffff 0 43%,#fff8d6 43% 64%,#FFF3A373 64% 100%);
  box-shadow:0 46px 110px #11111124,inset 0 1px 0 #fff;
}
body.public .wp-hero-grid::before{
  width:720px;height:720px;
  inset-inline-end:-175px;top:-206px;
  border:1px solid #FEE01C6b;
  box-shadow:0 0 0 58px #FFF3A326,0 0 0 118px #FEE01C12,0 0 120px #FEE01C2a;
}
body.public .wp-hero-grid::after{
  color:#1111114a;
  opacity:.65;
}
/* architectural ribbons create a less generic hero */
body.public .wp-hero-bg::before,
body.public .wp-hero-bg::after{
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
}
body.public .wp-hero-bg::before{
  width:52%;height:170%;
  inset-inline-end:-26%;top:-34%;
  transform:rotate(17deg);
  border:1px solid #ffffff9c;
  background:linear-gradient(180deg,#FEE01C26,#11111111 58%,transparent);
  box-shadow:0 0 0 22px #ffffff17;
}
body.public .wp-hero-bg::after{
  width:220px;height:8px;
  inset-inline-start:8%;bottom:0;
  border-radius:999px;
  background:linear-gradient(90deg,var(--brand-amber) 0 34%,var(--brand-steel) 34% 68%,var(--brand-navy) 68%);
  box-shadow:0 -18px 50px #FEE01C26;
}
body.public .wp-eyebrow{
  color:var(--brand-navy);
  border-color:#FEE01C52;
  background:linear-gradient(90deg,#FFF3A34d,#fff 76%);
  box-shadow:0 9px 26px #11111112,inset 0 1px 0 #fff;
}
body.public .wp-eyebrow span{background:var(--brand-amber);box-shadow:0 0 0 5px #FEE01C20}
body.public .wp-hero-copy h1{
  max-width:760px;
  color:var(--brand-navy);
  background:linear-gradient(112deg,var(--brand-navy) 8%,#444444 48%,var(--brand-steel) 76%,var(--brand-navy) 100%);
  background-size:185% 185%;
  -webkit-background-clip:text;background-clip:text;
  text-wrap:balance;
  letter-spacing:-1.2px;
}
body.public .wp-hero-copy h1::after{
  width:104px;height:5px;
  background:linear-gradient(90deg,var(--brand-amber) 0 38%,var(--brand-steel) 38% 78%,var(--brand-ice));
  box-shadow:0 0 22px #FEE01C30;
}
body.public .wp-hero-copy p{color:#5d5d5d;max-width:720px}
body.public .promo-card{
  border-color:#FEE01C52;
  background:
    linear-gradient(135deg,#ffffffee,#FFF3A32f),
    #fff;
  box-shadow:0 18px 46px #11111112,inset 0 1px 0 #fff;
}
body.public .promo-card::before{background:linear-gradient(90deg,transparent,#ffffffed,transparent)}
body.public .wp-chip{
  border-color:#FEE01C42;
  background:#ffffffcf;
  box-shadow:0 8px 22px #1111110d;
}
body.public .wp-chip:hover{border-color:var(--brand-steel);background:#fff;transform:translateY(-3px)}

/* hero showroom object */
body.public .wp-hero-art::before{
  content:"";
  position:absolute;
  width:330px;height:330px;
  inset-inline-end:2%;top:9%;
  border-radius:44% 56% 63% 37% / 48% 41% 59% 52%;
  background:linear-gradient(145deg,#1111110d,#FEE01C18 52%,#FFF3A33d);
  filter:blur(.2px);
  animation:v5Organic 12s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes v5Organic{to{transform:rotate(9deg) scale(1.08);border-radius:62% 38% 43% 57% / 40% 61% 39% 60%}}
body.public .wp-device-card{
  border-color:#ffffff;
  background:
    radial-gradient(circle at 31% 21%,#fff 0,#f7fbfc 30%,#FFF3A38a 64%,#FEE01C35 100%),
    linear-gradient(145deg,#fff,#FFF3A34d);
  box-shadow:inset 0 0 0 1px #FEE01C24,inset -22px -24px 56px #FEE01C1a,0 42px 90px #11111130,0 0 84px #FFF3A345;
}
body.public .wp-device-card::before{
  border-color:#FEE01C6e;
  box-shadow:0 0 0 25px #ffffff45,0 0 0 54px #FFF3A328,0 0 54px #FEE01C40;
}
body.public .wp-device-card::after{background:#11111129}
body.public .wp-device-photo,body.public .wp-device-illus{filter:drop-shadow(0 31px 32px #11111132)}
body.public .wp-float-note{
  border-color:#FEE01C4a;
  background:linear-gradient(135deg,#ffffffef,#FFF3A32e);
  box-shadow:0 20px 52px #11111126,inset 0 1px 0 #fff;
}
body.public .wp-float-note b{color:var(--brand-navy)}
body.public .wp-hero-stats{
  border-color:#FEE01C40;
  background:linear-gradient(135deg,#ffffffed,#eef6f8de);
  box-shadow:0 24px 68px #1111111c,inset 0 1px 0 #fff;
}
body.public .wp-hero-stats>div:nth-child(2) b{color:var(--brand-steel)}
body.public .wp-hero-stats>div:nth-child(3) b{color:var(--brand-amber)}
body.public .wp-hero-stats>div::after{background:linear-gradient(90deg,transparent,var(--brand-amber),var(--brand-steel),transparent)}

/* --- section rhythm: more editorial, less repetitive ------------------- */
body.public .section-heading{
  position:relative;
  padding-inline-start:22px;
}
body.public .section-heading::before{
  content:"";
  position:absolute;
  inset-inline-start:0;
  top:.45em;
  width:6px;height:54%;
  min-height:28px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--brand-amber),var(--brand-steel));
  box-shadow:0 7px 18px #FEE01C28;
}
body.public .section-heading::after{
  content:"";
  position:absolute;
  inset-inline-start:0;
  bottom:-11px;
  width:86px;height:1px;
  background:linear-gradient(90deg,var(--brand-steel),transparent);
}
body.public .section-heading h2{color:var(--brand-navy);letter-spacing:-.6px}
body.public .section-sub,body.public .section-note{color:#86898B}

/* alternating section atmosphere without extra markup */
body.public .cat-grid,
body.public .svc-grid,
body.public .p-grid,
body.public .post-grid,
body.public .ugc-grid{
  position:relative;
  isolation:isolate;
}
body.public .cat-grid::before,
body.public .svc-grid::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-28px -24px;
  border-radius:34px 12px 34px 34px;
  border:1px solid #FFF3A33d;
  background:linear-gradient(145deg,#ffffff73,#FFF3A317);
  transform:skewY(-.35deg);
}

/* quick navigation becomes a visual dashboard */
body.public .quick-nav{gap:14px}
body.public .quick-card{
  position:relative;
  min-height:118px;
  overflow:hidden;
  border:1px solid #FEE01C3d;
  border-radius:24px 24px 24px 8px;
  background:
    radial-gradient(circle at var(--mx,84%) var(--my,15%),#FFF3A357,transparent 38%),
    linear-gradient(145deg,#fff,#fffdf2);
  box-shadow:0 16px 38px #11111110,inset 0 1px 0 #fff;
}
body.public .quick-card:nth-child(4n+2){border-radius:24px 8px 24px 24px}
body.public .quick-card:nth-child(4n+3){background:linear-gradient(145deg,var(--brand-navy),#3F4247);color:#fff;border-color:#111111}
body.public .quick-card:nth-child(4n+3) *{color:inherit}
body.public .quick-card:nth-child(4n+4)::before{background:var(--brand-amber)}
body.public .quick-card::before{
  content:"";
  position:absolute;
  width:54px;height:5px;
  inset-inline-start:18px;top:0;
  border-radius:0 0 999px 999px;
  background:var(--brand-steel);
  transition:width .45s var(--v5-ease);
}
body.public .quick-card:hover::before{width:calc(100% - 36px)}
body.public .quick-card:hover{box-shadow:0 25px 52px #1111111d;border-color:#FEE01C77}

/* category cards: bento / tactile / colored edges */
body.public .cat-card{
  min-height:235px;
  border:1px solid #FEE01C42;
  border-radius:30px 30px 10px 30px;
  background:
    radial-gradient(circle at var(--mx,72%) var(--my,18%),#FFF3A369,transparent 44%),
    linear-gradient(150deg,#fff,#fff9e5);
  box-shadow:0 18px 44px #11111113,inset 0 1px 0 #fff;
}
body.public .cat-card:nth-child(2n){border-radius:30px 10px 30px 30px}
body.public .cat-card:nth-child(3n)::after{
  content:"";
  position:absolute;
  width:82px;height:82px;
  inset-inline-end:-28px;bottom:-28px;
  border:14px solid #FEE01C1c;
  border-radius:50%;
}
body.public .cat-card::before{
  content:"";
  position:absolute;
  inset-inline-start:0;top:22px;bottom:22px;
  width:4px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--brand-steel),var(--brand-amber));
  transform:scaleY(.35);
  transition:transform .4s var(--v5-ease);
}
body.public .cat-card:hover::before{transform:scaleY(1)}
body.public .cat-card:hover{box-shadow:0 30px 65px #11111121;border-color:#FEE01C73}

/* products: less sterile, more showroom-like */
body.public .p-card{
  border:1px solid #FEE01C3b;
  border-radius:28px 28px 28px 9px;
  background:linear-gradient(160deg,#fff 0 72%,#FFF3A317 100%);
  box-shadow:0 18px 45px #11111112,inset 0 1px 0 #fff;
}
body.public .p-card:nth-child(2n){border-radius:28px 9px 28px 28px}
body.public .p-card::before{
  content:"";
  position:absolute;
  z-index:0;
  width:122px;height:122px;
  inset-inline-end:-72px;top:34%;
  border-radius:50%;
  border:18px solid #FFF3A32d;
  transition:transform .55s var(--v5-ease),border-color .55s;
}
body.public .p-card:hover::before{transform:scale(1.35) rotate(35deg);border-color:#FEE01C24}
body.public .p-cover{
  border-color:#FEE01C29;
  border-radius:22px 22px 22px 7px;
  background:
    radial-gradient(circle at var(--mx,50%) var(--my,42%),#fff,#fff9e2 54%,#FFF3A34f);
  box-shadow:inset 0 1px 0 #fff,inset 0 -24px 48px #FEE01C0e;
}
body.public .p-badges .badge,body.public .p-off{box-shadow:0 8px 22px #FEE01C30}
body.public .p-off{background:var(--brand-amber);color:#fff}
body.public .price-now{
  background:linear-gradient(90deg,var(--brand-navy),var(--brand-steel));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
body.public .p-card:hover{box-shadow:0 30px 68px #11111122;border-color:#FEE01C6e}

/* services: more character than uniform white cards */
body.public .svc-card,
body.public .service-card{
  position:relative;
  overflow:hidden;
  border:1px solid #FEE01C3d;
  border-radius:30px 30px 10px 30px;
  background:
    radial-gradient(circle at 90% 4%,#FFF3A34e,transparent 38%),
    linear-gradient(150deg,#fff,#fffdf2);
  box-shadow:0 18px 44px #11111112;
}
body.public .svc-card:nth-child(3n+2){
  color:#fff;
  border-color:#111111;
  background:
    radial-gradient(circle at 85% 5%,#FEE01C4f,transparent 42%),
    linear-gradient(150deg,#3F4247,var(--brand-navy));
  box-shadow:0 25px 55px #11111135;
}
body.public .svc-card:nth-child(3n+2) :is(h3,p,a,span,strong){color:inherit}
body.public .svc-card:nth-child(3n+2) .button{border-color:#ffffff52;background:#ffffff14}
body.public .svc-card::after,
body.public .service-card::after{
  content:"";
  position:absolute;
  width:120px;height:120px;
  inset-inline-end:-72px;bottom:-72px;
  border-radius:50%;
  border:18px solid #FEE01C20;
  transition:transform .5s var(--v5-ease);
}
body.public .svc-card:hover::after,body.public .service-card:hover::after{transform:scale(1.35)}
body.public .service-mark{background:linear-gradient(145deg,var(--brand-steel),var(--brand-navy));color:#fff}

/* advisor / load lab: signature dark scene */
body.public .advisor-band{
  border:1px solid #FFF3A32e;
  border-radius:40px 40px 40px 14px;
  background:
    linear-gradient(115deg,#111111 0 52%,#3F4247 52% 72%,#3F4247 100%);
  box-shadow:0 46px 110px #1111114a,inset 0 1px 0 #ffffff1a;
}
body.public .advisor-band::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(420px 290px at 84% 24%,#FFF3A334,transparent 68%),
    linear-gradient(120deg,transparent 0 58%,#FEE01C12 58% 59%,transparent 59% 100%);
}
body.public .advisor-band::after{
  border-color:#FFF3A344;
  box-shadow:0 0 0 34px #FFF3A312,0 0 0 68px #FEE01C0d;
}
body.public .load-scale{border-color:#FFF3A336;background:#ffffff0d}
body.public .load-step:hover{box-shadow:0 16px 34px #00000038,0 0 0 2px #FEE01C2c}

/* brand strip */
body.public .brand-row{
  position:relative;
  border:1px solid #FEE01C2e;
  border-radius:26px 8px 26px 26px;
  background:linear-gradient(100deg,#fff,#FFF3A31c,#fff);
  box-shadow:0 16px 42px #1111110e;
  overflow:hidden;
}
body.public .brand-row::after{
  content:"";position:absolute;inset-inline-start:-8%;top:-130%;width:160px;height:340%;transform:rotate(17deg);
  background:linear-gradient(90deg,transparent,#ffffffb5,transparent);animation:v5Sweep 8s ease-in-out infinite;
}
@keyframes v5Sweep{0%,38%{inset-inline-start:-15%}75%,100%{inset-inline-start:112%}}
body.public .brand-chip{position:relative;z-index:1;border-color:#FEE01C2e;background:#ffffffb8}

/* blog / UGC richer editorial cards */
body.public .post-card,
body.public .ugc-item{
  position:relative;
  overflow:hidden;
  border:1px solid #FEE01C34;
  background:linear-gradient(150deg,#fff,#fffdf2);
  box-shadow:0 16px 42px #11111110;
}
body.public .post-card{border-radius:27px 27px 9px 27px}
body.public .post-card:nth-child(2n){border-radius:27px 9px 27px 27px}
body.public .post-card::before{
  content:"";position:absolute;inset-inline-start:0;top:0;width:72px;height:5px;border-radius:0 0 99px 0;
  background:linear-gradient(90deg,var(--brand-amber),var(--brand-steel));transition:width .45s var(--v5-ease)
}
body.public .post-card:hover::before{width:56%}
body.public .post-card:hover,body.public .ugc-item:hover{border-color:#FEE01C68;box-shadow:0 28px 62px #11111120}

/* FAQ has visible personality */
body.public .wp-faq details{
  border:1px solid #FEE01C36;
  border-radius:20px 20px 7px 20px;
  background:linear-gradient(145deg,#fff,#fffdf2);
  box-shadow:0 12px 30px #1111110d;
}
body.public .wp-faq details::before{width:5px;background:linear-gradient(180deg,var(--brand-amber),var(--brand-steel))}
body.public .wp-faq details[open]{border-color:#FEE01C6b;box-shadow:0 20px 42px #11111117}
body.public .wp-faq details[open] summary{color:var(--brand-navy)}

/* --- internal page hero / catalog -------------------------------------- */
body.public .shop-head,
body.public .city-hero,
body.public .product-hero{
  position:relative;
  overflow:hidden;
  border:1px solid #FEE01C4a;
  border-radius:36px 36px 36px 12px;
  background:
    radial-gradient(480px 320px at 88% 18%,#FFF3A35e,transparent 72%),
    radial-gradient(300px 240px at 0 115%,#FEE01C18,transparent 72%),
    linear-gradient(145deg,#fff,#fff9e2);
  box-shadow:0 30px 78px #11111118,inset 0 1px 0 #fff;
}
body.public .shop-head::before,
body.public .city-hero::before,
body.public .product-hero::before{
  content:"";
  position:absolute;
  width:220px;height:220px;
  inset-inline-end:-90px;top:-90px;
  border-radius:50%;
  border:1px solid #FEE01C5c;
  box-shadow:0 0 0 32px #FFF3A329,0 0 0 64px #FEE01C10;
  pointer-events:none;
}
body.public .shop-head::after{border-color:#FEE01C4d;box-shadow:0 0 0 40px #FFF3A31c,0 0 66px #FEE01C22}
body.public .shop-side,body.public .shop-toolbar{
  border-color:#FEE01C38;
  background:#ffffffd9;
  box-shadow:0 18px 48px #1111110e,inset 0 1px 0 #fff;
}
body.public .facet-options a:hover{border-color:#FEE01C66;background:#FFF3A325;color:var(--brand-navy)}
body.public .facet-options a.active{background:var(--brand-navy);border-color:var(--brand-navy);color:#fff}

/* --- product detail showroom ------------------------------------------- */
body.public .product-top{
  border:1px solid #FEE01C42;
  border-radius:38px 38px 38px 13px;
  background:
    radial-gradient(430px 330px at 15% 33%,#FFF3A350,transparent 70%),
    linear-gradient(145deg,#fff,#f3f8f9);
  box-shadow:0 38px 90px #1111111d,inset 0 1px 0 #fff;
}
body.public .gallery-main{
  border-radius:30px 30px 30px 10px;
  background:radial-gradient(circle at 50% 38%,#fff 0,#edf5f7 52%,#FFF3A35b 100%);
  box-shadow:inset 0 0 0 1px #FEE01C22,inset 0 -30px 60px #FEE01C12,0 24px 54px #11111112;
}
body.public .gallery-main::before{border-color:#FEE01C46;box-shadow:0 0 0 24px #FFF3A320,0 0 0 50px #FEE01C0f}
body.public .buy-box{
  border-color:#FEE01C4a;
  border-radius:30px 30px 9px 30px;
  background:
    radial-gradient(circle at 100% 0,#FFF3A340,transparent 40%),
    linear-gradient(155deg,#fff,#edf5f7);
  box-shadow:0 25px 60px #11111120,inset 0 1px 0 #fff;
}
body.public .buy-box::before{
  content:"";
  position:absolute;
  inset-inline-start:0;top:0;height:6px;width:42%;
  border-radius:0 0 999px 0;
  background:linear-gradient(90deg,var(--brand-amber),var(--brand-steel));
}
body.public .buy-box::after{border-color:#FEE01C3d;box-shadow:0 0 0 27px #FFF3A31e}
body.public .p-section{
  border-color:#FEE01C2f;
  border-radius:26px 26px 8px 26px;
  background:linear-gradient(150deg,#ffffffef,#fffdf2cc);
  box-shadow:0 14px 42px #1111110d,inset 0 1px 0 #fff;
}
body.public .p-section:nth-child(even){border-radius:26px 8px 26px 26px}
body.public .p-section:hover{border-color:#FEE01C61;box-shadow:0 25px 58px #11111118,inset 0 1px 0 #fff}

/* commerce forms, cart, checkout: polished but not sterile */
body.public .cart-items,
body.public .cart-summary,
body.public .checkout-form,
body.public .checkout-summary,
body.public .wizard,
body.public .track-card,
body.public .thanks-card{
  border-color:#FEE01C38;
  background:
    radial-gradient(circle at 100% 0,#FFF3A329,transparent 32%),
    linear-gradient(150deg,#fff,#fffdf7);
  box-shadow:0 20px 54px #11111113;
}
body.public :is(input,select,textarea):focus{
  border-color:var(--brand-steel)!important;
  box-shadow:0 0 0 4px #FFF3A34c!important;
  outline:none;
}
body.public input[type="range"]{accent-color:var(--brand-amber)}

/* --- footer: deeper identity + power line ----------------------- */
body.public .rich-footer{
  background:
    radial-gradient(760px 430px at 88% 0,#FEE01C2d,transparent 71%),
    radial-gradient(480px 330px at 9% 110%,#FEE01C19,transparent 70%),
    linear-gradient(155deg,#121519,var(--brand-navy) 56%,#3F4247);
}
body.public .rich-footer::before{
  opacity:.3;
  background-image:
    linear-gradient(#FFF3A30e 1px,transparent 1px),
    linear-gradient(90deg,#FFF3A30e 1px,transparent 1px),
    radial-gradient(circle at center,#FFF3A31e 0 1px,transparent 1.3px);
  background-size:48px 48px,48px 48px,24px 24px;
}
body.public .rich-footer::after{
  content:"";
  position:absolute;
  pointer-events:none;
  inset-inline:-5%;top:-48px;
  height:96px;
  border-radius:50%;
  border-top:2px solid #FFF3A362;
  box-shadow:0 -8px 40px #FEE01C2f;
  animation:v5FooterWave 8s ease-in-out infinite alternate;
}
@keyframes v5FooterWave{to{transform:translateX(3%) scaleX(.97)}}
body.public .rich-footer a:hover{color:var(--brand-ice)}
body.public .footer-phone{color:#fff}
body.public .footer-chat{background:var(--brand-amber);color:#fff;box-shadow:0 12px 30px #FEE01C38}

/* --- cursor splash / click ripple inserted by identity-v5.js ----------- */
body.public .v5-ripple{
  position:fixed;
  z-index:150;
  width:12px;height:12px;
  margin:-6px 0 0 -6px;
  border-radius:50%;
  border:2px solid #FEE01C95;
  box-shadow:0 0 0 1px #FFF3A35a,inset 0 0 0 2px #ffffff99;
  pointer-events:none;
  animation:v5Ripple .72s var(--v5-ease) forwards;
}
@keyframes v5Ripple{to{opacity:0;transform:scale(8);border-color:#FEE01C2a}}

body.public .v5-orbit-dot{
  position:absolute;
  z-index:3;
  width:10px;height:10px;
  border-radius:50%;
  background:var(--brand-amber);
  box-shadow:0 0 0 6px #FEE01C1e,0 0 24px #FEE01C66;
  pointer-events:none;
  animation:v5OrbitDot 9s linear infinite;
}
body.public .v5-orbit-dot.dot-a{inset-inline-end:8%;top:19%}
body.public .v5-orbit-dot.dot-b{inset-inline-end:33%;bottom:13%;width:7px;height:7px;background:var(--brand-steel);box-shadow:0 0 0 6px #FEE01C20,0 0 22px #FEE01C5a;animation-delay:-4s}
@keyframes v5OrbitDot{
  0%{transform:translate(0,0)}
  25%{transform:translate(-18px,9px)}
  50%{transform:translate(-6px,22px)}
  75%{transform:translate(13px,12px)}
  100%{transform:translate(0,0)}
}

/* Better visible reveals than ultra-minimal fade */
body.public.fx-motion [data-fx-reveal]{
  transform:translate3d(0,38px,0) scale(.975);
  filter:blur(6px) saturate(.86);
}
body.public.fx-motion [data-fx-reveal].fx-in{filter:none}
body.public.fx-motion .p-grid [data-fx-card],
body.public.fx-motion .cat-grid [data-fx-card],
body.public.fx-motion .svc-grid [data-fx-card]{transform:translate3d(0,28px,0) rotate(.35deg) scale(.965)}
body.public [data-fx-count].fx-counting{filter:drop-shadow(0 0 12px #FEE01C4c)}

/* --- responsive: keep richness, reduce cognitive load ------------------ */
@media (max-width:1100px){
  body.public .wp-hero-grid{min-height:620px;border-radius:34px 34px 34px 12px}
  body.public .wp-hero-bg::before{opacity:.65}
}
@media (max-width:820px){
  body.public .wp-hero-grid{
    background:linear-gradient(180deg,#fff 0 58%,#eaf3f6 58% 100%);
    border-radius:28px 28px 28px 10px;
  }
  body.public .wp-hero-bg::before{width:90%;height:55%;inset-inline-end:-45%;top:48%;transform:rotate(8deg)}
  body.public .section-heading{padding-inline-start:17px}
  body.public .cat-grid::before,body.public .svc-grid::before{inset:-18px -10px;border-radius:26px 8px 26px 26px}
  body.public .quick-card:nth-child(4n+3){background:linear-gradient(145deg,#fff,#fffdf2);color:inherit;border-color:#FEE01C3d}
  body.public .quick-card:nth-child(4n+3) *{color:inherit}
  body.public .svc-card:nth-child(3n+2){background:radial-gradient(circle at 90% 4%,#FFF3A34e,transparent 38%),linear-gradient(150deg,#fff,#fffdf2);color:inherit;border-color:#FEE01C3d;box-shadow:0 18px 44px #11111112}
  body.public .svc-card:nth-child(3n+2) :is(h3,p,a,span,strong){color:inherit}
}
@media (max-width:560px){
  body.public{background:linear-gradient(180deg,#fffdf8,#f3f8fa 55%,#fbfcfd)}
  body.public .promo-bar::before{opacity:.55}
  body.public .wp-hero{padding-top:14px}
  body.public .wp-hero-grid{border-radius:24px 24px 24px 8px;box-shadow:0 26px 62px #1111111d}
  body.public .wp-hero-copy h1{letter-spacing:-.6px}
  body.public .wp-hero-art::before{width:240px;height:240px;opacity:.7}
  body.public .cat-card,body.public .p-card,body.public .svc-card,body.public .post-card{border-radius:23px 23px 8px 23px}
  body.public .advisor-band{border-radius:28px 28px 28px 10px}
  body.public .v5-orbit-dot{display:none}
}
@media (prefers-reduced-motion:reduce){
  body.public .promo-bar::before,body.public .brand-row::after,body.public .rich-footer::after,
  body.public .wp-hero-art::before,body.public .v5-orbit-dot{animation:none!important}
  body.public .v5-ripple{display:none!important}
}

/* --- V5.1 header dropdown interaction fix ------------------------------ */
@media (min-width:1041px) and (hover:hover) and (pointer:fine){
  body.public .upgraded-header,
  body.public .upgraded-header .header-inner,
  body.public .upgraded-header .public-menu,
  body.public .upgraded-header .nav-main{
    overflow:visible;
  }
  body.public .header-dropdown{
    position:relative;
    z-index:1;
  }
  body.public .header-dropdown[open]{z-index:90}
  body.public .header-dropdown[open]::after{
    content:"";
    position:absolute;
    top:100%;
    right:0;
    width:max(100%,420px);
    height:14px;
    z-index:89;
  }
  body.public .header-dropdown[open]>.cities-menu{
    z-index:90;
    transform-origin:top right;
    animation:v51MenuIn .18s cubic-bezier(.2,.72,.2,1) both;
  }
  body.public .header-dropdown[open]>summary{
    color:var(--brand-navy);
    background:linear-gradient(145deg,#fff,#FFF3A326);
    box-shadow:inset 0 0 0 1px #FEE01C2c,0 8px 22px #1111110c;
  }
  body.public .header-dropdown[open]>summary::after{transform:scaleX(1)}
}
@keyframes v51MenuIn{
  from{opacity:0;transform:translateY(-6px) scale(.985)}
  to{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){
  body.public .header-dropdown[open]>.cities-menu{animation:none!important}
}

/* V6 service section refinement + navy card readable text */
body.public .svc-card:nth-child(3n+2),
body.public .svc-card.dark,
body.public .svc-card[style*="#111111"]{
  color:#fff;
}
body.public .svc-card:nth-child(3n+2) b,
body.public .svc-card:nth-child(3n+2) small,
body.public .svc-card:nth-child(3n+2) span,
body.public .svc-card.dark b,
body.public .svc-card.dark small,
body.public .svc-card.dark span{
  color:#fff!important;
}
body.public .svc-card:nth-child(3n+2) small,
body.public .svc-card.dark small{
  color:rgba(255,255,255,.82)!important;
}

/* Services section: more premium editorial layout */
body.public .svc-grid{
  gap:16px;
}
body.public .svc-card{
  min-height:185px;
  padding:26px;
  border-radius:26px;
  background:linear-gradient(145deg,#fff,#f5f9fb);
}
body.public .svc-card:nth-child(1),body.public .svc-card:nth-child(2){
  min-height:220px;
}
body.public .svc-card::before{
  border-color:rgba(254,224,28,.18);
}
body.public .svc-card:hover{
  transform:translateY(-8px);
}
