/* STOREFRONT-ENHANCE-1 (line G, 2026-10-14): the owner chose to improve this site rather than replace it, with the best of the
   premium pass - soft glow at the accents only (behind the hero, the cards' edges, the buttons) and Thai-first type. The light on
   the words stays the site's own (graphic-scenes.css); a finer one is only a choice in the owner's preview (docs/storefront/
   preview). Glow is soft light, never neon. This sheet loads after the site's own sheets and before brand, theme and dark;
   tools/storefront-dark.mjs derives its dark half like every other sheet. */

/* ---------- type: one body size (17-18 px on a desktop, 16-17 on a phone), Thai-safe line heights, a reading measure */
body{font-size:clamp(16px,calc(15px + .22vw),17.5px);line-height:1.78}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
html[lang=th] h2,html[lang=th] h3{line-height:1.3}
.section-head p,.page-hero p,.hero-v5 .hero-center>p,.closing-copy p,.story-heading p{max-width:36em;line-height:1.8}
.hero-v5 .hero-center>p{margin-inline:auto}
.page-hero p+.btn{margin-top:26px}
.photo-caption,figcaption{text-wrap:balance}
.card p,.audience-copy p,.feature-copy p{line-height:1.78}
.card-number,.price,.count,.note-number,.audience-index,.workflow-step small,.plan-identity span{font-variant-numeric:tabular-nums lining-nums}

/* ---------- glow 1: a soft aurora behind the hero's words (teal, ice blue, champagne) */
.orbit-hero.hero-v5{position:relative;isolation:isolate}
.orbit-hero.hero-v5::after{content:"";position:absolute;left:0;right:0;top:0;height:min(720px,100%);z-index:-1;pointer-events:none;
  background:radial-gradient(34% 40% at 50% 32%,#3fe0d024,transparent 72%),radial-gradient(26% 32% at 33% 26%,#7aa7ff1a,transparent 72%),radial-gradient(26% 30% at 67% 28%,#f3d7a524,transparent 72%)}

/* ---------- glow 2: the cards' edges light softly under the pointer (and with keyboard focus inside) */
.module-card.card,.plan-grid>.plan-card,.audience-panel{transition:border-color .3s,box-shadow .35s,transform .3s}
.module-card.card:hover,.module-card.card:focus-within,.plan-grid>.plan-card:hover,.plan-grid>.plan-card:focus-within{border-color:#7fd3c6;
  box-shadow:0 0 0 1px #3fe0d033,0 18px 40px -18px #12364a33,0 0 46px -14px #3fe0d059}

/* ---------- glow 3: the buttons carry a soft halo, a little stronger under the pointer */
.btn{transition:transform .2s,box-shadow .3s,filter .3s}
.btn:not(.secondary):not(.outline-light){box-shadow:0 10px 26px -12px #06274b59,0 0 30px -12px #3fe0d040}
.btn:not(.secondary):not(.outline-light):hover{box-shadow:0 14px 32px -12px #06274b66,0 0 44px -10px #3fe0d066}
.btn.teal{box-shadow:0 10px 30px -10px #00bdb18c,0 0 50px -12px #3fe0d080}
.btn.teal:hover{box-shadow:0 14px 36px -10px #00bdb1a6,0 0 64px -10px #3fe0d099}

/* ---------- the sign-in page's two ways in (bme Platform, and BME's existing Asset & Maintenance system): two cards, each with
   its address to check, the same soft edge as the other cards */
.login-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:8px}
.login-card{display:flex;flex-direction:column;gap:12px;min-width:0;padding:28px;border:1px solid #dce5e9;border-radius:24px;background:#fff;transition:border-color .3s,box-shadow .35s}
.login-card:hover,.login-card:focus-within{border-color:#7fd3c6;box-shadow:0 0 0 1px #3fe0d033,0 18px 40px -18px #12364a33,0 0 46px -14px #3fe0d059}
.login-card h2{margin:0;font-size:1.35rem;line-height:1.35}
.login-card p{margin:0}
.login-card .login-host{font-size:.88rem;overflow-wrap:anywhere}
.login-card .login-signup{margin-top:.75rem;font-size:.92rem}
.signup-text-body{white-space:pre-wrap;max-width:68ch}
.signup-privacy{margin:2rem 0}
.login-card .actions{margin-top:auto;padding-top:8px}
@media(max-width:720px){.login-cards{grid-template-columns:1fr}.login-card{padding:22px}}
