/* Sugar & Co. shared layer — loader, group bar, brand switcher.
   Used on every site in the group. Everything is namespaced .sc- so it never clashes with a brand's own styles. */
:root{
  --sc-ink:#05302F;
  --sc-deep:#0A4D4B;
  --sc-teal:#0E7A74;
  --sc-turq:#1FB5A8;
  --sc-mist:#BDEDE6;
  --sc-foam:#EAF8F6;
  --sc-white:#FFFFFF;
  --sc-display:'DM Sans','Helvetica Neue',Arial,sans-serif;
  --sc-body:'DM Sans','Helvetica Neue',Arial,sans-serif;
  --sc-ja:'Zen Maru Gothic','Hiragino Maru Gothic ProN','Yu Gothic',sans-serif;
}

/* ---------- Loader ---------- */
.sc-loader{position:fixed;inset:0;z-index:2147483000;background:var(--sc-turq);color:var(--sc-white);display:flex;align-items:center;justify-content:center;
  background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1.4px);background-size:18px 18px;
  transition:opacity .45s ease,transform .6s cubic-bezier(.7,0,.2,1),visibility 0s linear .6s;font-family:var(--sc-body)}
.sc-loader.is-out{opacity:0;transform:translateY(-4%);visibility:hidden;pointer-events:none}
.sc-loader.is-in{opacity:1;transform:none;visibility:visible;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1),visibility 0s}
.sc-loader__inner{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;padding:24px}
.sc-cube{width:112px;height:112px;overflow:visible}
.sc-cube .f{stroke:var(--sc-ink);stroke-width:2.5;stroke-linejoin:round}
.sc-cube .top{fill:#FFFFFF;animation:sc-drop .9s cubic-bezier(.3,1.5,.5,1) both}
.sc-cube .lft{fill:#D7F5F1;animation:sc-left .7s cubic-bezier(.2,.8,.2,1) .12s both}
.sc-cube .rgt{fill:#A6E6DD;animation:sc-right .7s cubic-bezier(.2,.8,.2,1) .2s both}
.sc-cube .g{fill:#FFFFFF;stroke:var(--sc-ink);stroke-width:1.5;animation:sc-grain 1.6s ease-out infinite;opacity:0}
.sc-cube .g2{animation-delay:.35s}.sc-cube .g3{animation-delay:.7s}.sc-cube .g4{animation-delay:1.05s}
.sc-loader__word{font-family:var(--sc-display);font-size:37px;line-height:1;font-weight:700;letter-spacing:-.03em}
.sc-loader__word i{font-style:italic}
.sc-loader__ja{font-family:var(--sc-ja);font-size:11px;letter-spacing:.3em;opacity:.85}
.sc-loader__bar{width:132px;height:3px;border-radius:2px;background:rgba(5,48,47,.22);overflow:hidden;margin-top:6px}
.sc-loader__bar span{display:block;height:100%;width:40%;background:var(--sc-white);border-radius:2px;animation:sc-bar 1.1s ease-in-out infinite}
.sc-loader__to{font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--sc-ink);min-height:18px}
@keyframes sc-drop{from{transform:translateY(-34px);opacity:0}to{transform:none;opacity:1}}
@keyframes sc-left{from{transform:translateX(-22px);opacity:0}to{transform:none;opacity:1}}
@keyframes sc-right{from{transform:translateX(22px);opacity:0}to{transform:none;opacity:1}}
@keyframes sc-grain{0%{transform:translateY(0) rotate(0);opacity:0}20%{opacity:1}100%{transform:translateY(-38px) rotate(45deg);opacity:0}}
@keyframes sc-bar{0%{transform:translateX(-110%)}100%{transform:translateX(260%)}}

/* ---------- Group bar ---------- */
.sc-bar{position:relative;z-index:60;background:var(--sc-deep);color:var(--sc-white);font-family:var(--sc-body);font-size:11px;line-height:1.2}
.sc-bar__in{max-width:1440px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));box-sizing:border-box}
.sc-bar a{color:inherit;text-decoration:none}
.sc-bar__home{display:inline-flex;align-items:center;gap:9px;min-height:40px;font-weight:600;letter-spacing:.02em;min-width:0}
.sc-bar__home:hover .sc-bar__name{text-decoration:underline;text-underline-offset:3px}
.sc-bar__home svg{flex:none}
.sc-bar__name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sc-bar__name b{font-family:var(--sc-display);font-weight:700;font-size:13px;letter-spacing:.01em}
.sc-bar__name b i{font-style:italic}
.sc-bar__ja{font-family:var(--sc-ja);opacity:.7;font-size:11px;letter-spacing:.12em}
.sc-switch{position:relative;flex:none}
.sc-switch__btn{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 12px;border-radius:999px;border:1px solid rgba(255,255,255,.35);background:transparent;color:var(--sc-white);
  font:600 11px/1 var(--sc-body);cursor:pointer;transition:background .2s ease,border-color .2s ease}
.sc-switch__btn:hover,.sc-switch__btn[aria-expanded="true"]{background:var(--sc-turq);border-color:var(--sc-turq);color:var(--sc-ink)}
.sc-switch__btn svg{transition:transform .25s ease}
.sc-switch__btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.sc-switch__btn:focus-visible,.sc-bar__home:focus-visible,.sc-switch__panel a:focus-visible{outline:2px solid var(--sc-mist);outline-offset:2px}
.sc-switch__panel{position:absolute;right:0;top:calc(100% + 8px);width:min(340px,calc(100vw - 32px));background:var(--sc-white);color:var(--sc-ink);border-radius:14px;
  box-shadow:0 18px 50px rgba(5,48,47,.28),0 0 0 1px rgba(5,48,47,.08);padding:8px;box-sizing:border-box;animation:sc-pop .22s cubic-bezier(.2,.8,.2,1)}
.sc-switch__head{display:flex;justify-content:space-between;align-items:baseline;padding:8px 10px 10px;border-bottom:1px solid #DDEFEC;margin-bottom:6px}
.sc-switch__head span{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sc-teal)}
.sc-switch__head em{font-family:var(--sc-ja);font-style:normal;font-size:11px;color:#4F7774}
.sc-switch__item{display:flex;align-items:center;gap:12px;padding:10px;border-radius:10px;min-height:48px;box-sizing:border-box;transition:background .15s ease}
a.sc-switch__item:hover{background:var(--sc-foam)}
.sc-switch__item[aria-current="page"]{background:var(--sc-foam)}
.sc-switch__item--child{margin-left:22px;position:relative}
.sc-switch__item--child::before{content:"";position:absolute;left:-10px;top:-4px;width:9px;height:28px;border-left:1.5px solid #B9DAD6;border-bottom:1.5px solid #B9DAD6;border-bottom-left-radius:6px}
.sc-switch__dot{flex:none;width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font:700 11px/1 var(--sc-body);border:1.5px solid var(--sc-ink)}
.sc-switch__txt{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.sc-switch__txt strong{font-size:12px;font-weight:700}
.sc-switch__txt small{font-size:11px;color:#4F7774}
.sc-switch__here{flex:none;font-size:11px;font-weight:700;color:var(--sc-teal);letter-spacing:.04em}
.sc-switch__item--soon{opacity:.75}
.sc-switch__item--soon .sc-switch__dot{border-style:dashed;color:var(--sc-teal);background:var(--sc-white)}
@keyframes sc-pop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
@media (max-width:520px){.sc-bar__ja{display:none}.sc-switch__btn .sc-lbl-long{display:none}}

@media (prefers-reduced-motion:reduce){
  .sc-cube .top,.sc-cube .lft,.sc-cube .rgt{animation:none}
  .sc-cube .g,.sc-loader__bar span{animation:none}
  .sc-loader__bar span{width:100%}
  .sc-loader,.sc-loader.is-in{transition:opacity .2s linear,visibility 0s linear .2s;transform:none}
  .sc-switch__panel{animation:none}
}
