/* JomEnglish UI quick-wins preview — founder review only. */
:root{
  --je-brand-purple:#6942bf;
  --je-brand-orange:#e38b35;
  --je-brand-cream:#fff8df;
  --je-brand-line:#e7d8b6;
}

/* Real-text wordmark framed by approved product artwork. */
a.brand{
  position:relative;
  isolation:isolate;
  min-height:48px;
  display:inline-flex;
  align-items:center;
  gap:.16em;
  padding:4px 10px 4px 48px;
  border:1px solid rgba(105,66,191,.13);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,248,223,.94));
  box-shadow:0 4px 0 rgba(199,169,103,.18),0 9px 24px rgba(82,52,130,.08);
  color:var(--je-brand-purple);
  font-family:'Baloo 2',sans-serif;
  font-weight:800;
  line-height:1;
  letter-spacing:-.045em;
  text-decoration:none;
}
a.brand::before{
  content:'';
  position:absolute;
  left:8px;
  top:50%;
  width:32px;
  height:32px;
  transform:translateY(-50%) rotate(-7deg);
  border-radius:11px;
  background:#ffe98c url('/assets/img/home/reward-star.png') center/24px 24px no-repeat;
  box-shadow:0 3px 0 #e7b936,0 6px 12px rgba(93,64,25,.12);
}
a.brand::after{
  content:'';
  position:absolute;
  right:-6px;
  top:-6px;
  width:12px;
  height:12px;
  background:var(--je-brand-orange);
  clip-path:polygon(50% 0,62% 36%,100% 50%,62% 64%,50% 100%,38% 64%,0 50%,38% 36%);
}
a.brand>span:first-child{color:var(--je-brand-orange)}
a.brand .brand-dot{color:var(--je-brand-orange);margin-left:-.12em}

/* Founder-selected candidate A: compact illustrated header wordmark. */
a.brand.brand-graphic-a{
  min-width:0;
  min-height:48px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}
a.brand.brand-graphic-a::before,
a.brand.brand-graphic-a::after{display:none}
a.brand.brand-graphic-a img{
  display:block;
  width:auto;
  height:52px;
  max-width:min(210px,46vw);
  object-fit:contain;
}
@media(max-width:420px){a.brand.brand-graphic-a img{height:46px;max-width:174px}}

.site-header,
.store-page .commerce-nav,
.parent-page .portal-nav{
  border-bottom-color:rgba(105,66,191,.14);
}
.site-header{background:rgba(250,247,241,.9);backdrop-filter:blur(12px)}

/* Inline consent: visible, compact, and never covers price or totals. */
.store-page .consent-banner{
  position:static;
  inset:auto;
  width:100%;
  max-width:none;
  margin:0 0 28px;
  padding:16px 18px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:16px;
  border:1px solid #d9cbed;
  border-left:5px solid var(--je-brand-purple);
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 28px rgba(56,39,91,.09);
}
.store-page .consent-banner p{font-size:14px;line-height:1.55}
.store-page .consent-banner p a{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 8px;
  margin:-8px -8px;
  color:#58339b;
  font-weight:900;
  text-decoration:underline;
  text-underline-offset:3px;
}
.store-page .consent-banner>div:last-child{display:flex;gap:10px;align-items:center}

/* Mobile purchase prompt only appears once the hero CTA has left view. */
@media(max-width:760px){
  body:has(.mobile-buy){padding-bottom:64px}
  .mobile-buy{
    min-height:0!important;
    height:64px!important;
    padding:6px 14px calc(6px + env(safe-area-inset-bottom))!important;
    transform:translateY(110%);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:transform .22s ease,opacity .18s ease,visibility 0s linear .22s;
  }
  .mobile-buy.is-visible{
    transform:translateY(0);
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition-delay:0s;
  }
  .mobile-buy>div small{display:none}
  .mobile-buy>div strong{font-size:20px}
  .mobile-buy .button.primary{min-height:48px!important;height:48px!important;font-size:15px!important;padding:8px 14px!important}

  .store-page .consent-banner{
    grid-template-columns:1fr;
    gap:12px;
    margin-bottom:20px;
    padding:14px;
  }
  .store-page .consent-banner>div:last-child{display:grid;grid-template-columns:1fr 1.35fr;width:100%}
  .store-page .consent-banner button{min-height:48px}
  .parent-page .portal-nav{padding-block:10px;align-items:flex-start;flex-wrap:wrap}
  .parent-page .management-language{gap:8px}
}

@media(prefers-reduced-motion:reduce){
  .mobile-buy{transition:none!important}
}