/* v56: white two-tier header, separated navigation bar; shared mega menus and footer */
.site-header{background:var(--color-white);backdrop-filter:none;position:sticky;top:0;z-index:80;border:0}
.uw-brandbar{background:var(--color-white);border-bottom:1px solid #e6eaf0}
.uw-brandbar__inner{height:70px;display:flex;align-items:center}
.uw-brandbar .brand{width:270px;display:block}
.uw-brandbar .brand img{display:block;max-height:54px;object-fit:contain;object-position:left center}
.uw-navrow{background:var(--color-white);border-bottom:1px solid #e6eaf0}
.uw-navrow__inner{min-height:100px;display:flex;align-items:center;gap:28px}
.uw-global-nav{display:flex;gap:48px;margin:0;align-items:center}
.uw-navgroup{display:flex;align-items:center;gap:8px}
/* Bilingual navigation: English above Japanese, centered within one link. */
.uw-global-nav .uw-navgroup__link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px 10px;border-radius:6px;background:var(--color-white);font-size:15px;letter-spacing:0;font-weight:700;color:var(--color-navy);line-height:1.2;text-align:center;white-space:nowrap;transition:background-color var(--hover-duration) ease,color var(--hover-duration) ease}
.uw-global-nav .uw-navgroup__en{display:block;color:var(--color-navy);font-size:15px;font-weight:700}
.uw-global-nav .uw-navgroup__ja{display:block;color:var(--color-navy);font-size:13px;font-weight:500;letter-spacing:.08em}
.uw-navgroup:nth-child(1) .uw-navgroup__ja{letter-spacing:.18em}
.uw-navgroup:nth-child(2) .uw-navgroup__ja{letter-spacing:.24em}
.uw-navgroup:nth-child(3) .uw-navgroup__ja{letter-spacing:.16em}
.uw-global-nav .uw-navgroup__link:hover,.uw-global-nav .uw-navgroup__link:focus-visible{background:var(--color-white);color:var(--color-navy)}
.uw-global-nav .uw-navgroup__link:hover .uw-navgroup__en,.uw-global-nav .uw-navgroup__link:focus-visible .uw-navgroup__en{color:var(--color-navy);text-decoration:none}
.uw-global-nav .uw-navgroup__link:hover .uw-navgroup__ja,.uw-global-nav .uw-navgroup__link:focus-visible .uw-navgroup__ja{color:var(--color-navy)}
/* Member login: existing navigation, navy by default and mint on hover. */
.uw-global-nav .uw-nav-login{display:none;align-items:center;justify-content:center;gap:10px;padding:12px 10px;color:var(--color-navy);font-size:15px;font-weight:700;line-height:1.2;white-space:nowrap;text-decoration:none;transition:color var(--hover-duration) ease}
.uw-global-nav .uw-nav-login svg{display:block;width:26px;height:26px;flex:none;fill:currentColor}
.uw-global-nav .uw-nav-login:hover,.uw-global-nav .uw-nav-login:focus-visible{color:var(--color-learning)}
.uw-global-nav .uw-nav-login:focus-visible{outline:2px solid var(--color-learning);outline-offset:3px;border-radius:4px}
@media(max-width:700px){.uw-global-nav .uw-nav-login{display:inline-flex;justify-content:flex-start;min-height:52px;padding:12px 14px;border-bottom:1px solid #e5e9ee}.uw-header-login{display:none}}
.uw-navgroup__trigger{border:1px solid var(--color-navy);background:var(--color-navy);color:var(--color-white);width:36px;height:36px;padding:0;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s;font-size:0;line-height:0}
.uw-navgroup__trigger::before{content:"";width:10px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;border-radius:0 0 1px 0;transform:translateY(-2px) rotate(45deg)}
.uw-navgroup__trigger:hover,.uw-navgroup__trigger:focus-visible,.uw-navgroup__trigger[aria-expanded="true"]{background:var(--color-navy);color:var(--color-white)}.uw-navgroup__trigger:focus-visible{outline:2px solid var(--color-trial);outline-offset:3px}
.uw-navrow .header-cta{margin-left:auto;padding:17px 30px;border-radius:var(--action-radius);background:var(--color-trial);border-color:var(--color-trial);color:var(--color-white);font-size:1rem;box-shadow:none;transition:background-color var(--hover-duration) ease,color var(--hover-duration) ease}
.uw-navrow .header-cta:hover,.uw-navrow .header-cta:focus-visible{background:transparent;border-color:transparent;color:inherit;box-shadow:none}
.uw-mega{position:absolute;top:100%;left:0;right:0;background:var(--color-white);box-shadow:0 20px 30px #0b17262b;border-top:1px solid #e6eaf0}
.uw-mega[hidden]{display:none}
.uw-mega__inner{padding-top:24px;padding-bottom:28px;display:grid;grid-template-columns:minmax(230px,34%) 1fr;gap:22px}
.uw-mega__feature{padding:18px;background:#f6f8fa;border-radius:5px}
.uw-mega__photo{display:block;width:100%;height:155px;object-fit:cover;object-position:center;border-radius:4px;margin-bottom:17px}.uw-mega__eyebrow{font-size:.78rem;letter-spacing:.14em;font-weight:800;margin:0}.uw-mega__brand-first{color:var(--color-navy)}.uw-mega__brand-second{color:var(--green)}
.uw-mega__feature .uw-mega__title{font-size:1.8rem;margin:5px 0 3px;color:#0b2343}
.uw-mega__feature p:last-child{font-size:1rem;line-height:1.55;margin:0}
.uw-mega__links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:9px}
.uw-mega__links a{border:2px solid #0b2343;border-radius:4px;min-height:48px;display:flex;align-items:center;justify-content:center;text-align:center;padding:9px 12px;color:#0b2343;font-weight:700;font-size:.83rem;transition:background .2s,color .2s}
.uw-mega__links a:hover,.uw-mega__links a:focus-visible{background:#0b2343;color:var(--color-white)}

.uw-footer-group{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.site-footer .footer-links .uw-footer-group a{font-size:.76rem;line-height:1.5;text-align:left}
.site-footer .footer-links .uw-footer-group__heading{font-weight:800;font-size:.82rem;margin-bottom:4px}
@media(max-width:900px){.uw-global-nav{gap:20px}.uw-navrow__inner{gap:12px}.site-footer .footer-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.uw-brandbar__inner{height:66px}.uw-brandbar .brand{width:225px}.uw-navrow__inner{min-height:76px;justify-content:flex-end}.uw-navrow .menu-toggle{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;margin:0;padding:0;border:1px solid var(--color-navy);border-radius:6px;line-height:1;background:var(--color-white);box-sizing:border-box;transform:translateY(-8px)}.uw-navrow .header-cta{display:inline-flex;margin-left:0;padding:13px 20px;font-size:.875rem}.uw-global-nav{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;background:var(--color-white);padding:10px 18px 20px;max-height:65vh;overflow:auto;box-shadow:0 15px 24px #0b172629}.uw-global-nav.is-open{display:flex}.uw-navgroup{justify-content:space-between;border-bottom:1px solid #e5e9ee;padding:5px 4px}.uw-global-nav .uw-navgroup__link{padding:10px 0;align-items:flex-start;text-align:left}.uw-navgroup__trigger{width:36px;height:40px}.uw-mega{position:absolute;top:100%;max-height:65vh;overflow:auto;z-index:3}.uw-mega__inner{grid-template-columns:1fr;padding-top:8px;padding-bottom:12px;gap:9px}.uw-mega__feature{padding:10px 12px}.uw-mega__photo{display:block;height:clamp(115px,34vw,170px);margin-bottom:7px;object-fit:cover}.uw-mega__feature .uw-mega__title{font-size:1rem;margin:2px 0}.uw-mega__feature p:last-child{margin-top:2px;margin-bottom:0}.uw-mega__links{grid-template-columns:1fr}.uw-mega__links a{min-height:43px}}

/* v57: footer navigation first, brand mark at right on desktop and centered last on mobile. */




/* v58: footer and navigation spacing refinement */
@media(min-width:901px){.uw-navrow__inner{gap:24px}.uw-global-nav{gap:clamp(32px,3.5vw,56px)}}
.site-footer .footer-top{display:flex;justify-content:space-between;align-items:flex-start;gap:clamp(28px,4vw,64px)}
.site-footer .footer-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:start;order:1;flex:1;min-width:0;column-gap:clamp(16px,2vw,32px);row-gap:28px}
.site-footer .uw-footer-group{gap:11px}
.site-footer .footer-logo{order:2;flex:0 0 auto;max-width:300px;height:auto;display:block;align-self:flex-start;width:min(300px,26%);margin-left:auto}
.site-footer .footer-bottom{clear:both;line-height:1.7}
@media(max-width:900px) and (min-width:701px){.site-footer .footer-top{flex-wrap:wrap}.site-footer .footer-links{flex-basis:100%}.site-footer .footer-logo{margin-left:auto}}
@media(max-width:700px){
.site-footer{padding-top:52px;padding-bottom:26px}
.site-footer .footer-top{display:flex;flex-direction:column;align-items:stretch;gap:0}
.site-footer .footer-links{order:1;width:100%;margin:0;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;row-gap:32px}
.site-footer .uw-footer-group{gap:12px}
.site-footer .footer-logo{order:2;align-self:center;width:min(300px,80%);max-width:100%;margin:52px auto 0}
.site-footer .footer-bottom{text-align:center;margin-top:28px;padding-top:20px;font-size:.72rem}
}

/* v126: English action buttons with Japanese captions beneath their frames. */
.uw-header-actions{display:flex;align-items:center;gap:12px;margin-left:auto;flex-shrink:0}
/* Member login at the far right, icon above label (desktop). */
.uw-header-login{display:grid;grid-template-rows:44px 19px 17px;justify-items:center;align-items:center;row-gap:3px;min-width:82px;padding:0 8px;color:var(--color-navy);font-size:13px;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;transition:color var(--hover-duration) ease}
.uw-header-login svg{display:block;width:32px;height:32px;flex:none;fill:currentColor;grid-row:1}
.uw-header-login span{grid-row:2 / span 2;align-self:center}.uw-header-login:hover,.uw-header-login:focus-visible{color:var(--color-learning)}
.uw-header-login:focus-visible{outline:2px solid var(--color-learning);outline-offset:3px;border-radius:4px}
.uw-navrow .uw-header-actions .header-cta{margin-left:0}
.uw-header-actions .header-cta,.uw-header-actions .uw-guide-cta{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:5px;padding:0;min-height:0;background:transparent;border:0;border-radius:0;box-shadow:none;text-decoration:none;white-space:nowrap}
.uw-header-actions .uw-action-label{display:flex;align-items:center;justify-content:center;min-height:43px;padding:10px 20px;border:1px solid transparent;border-radius:var(--action-radius);font-size:15px;font-weight:700;line-height:1.2;transition:background-color var(--hover-duration) ease,color var(--hover-duration) ease}
.uw-header-actions .uw-guide-cta .uw-action-label{background:var(--color-white);border-color:var(--color-navy);color:var(--color-navy)}
.uw-header-actions .uw-guide-cta:hover .uw-action-label,.uw-header-actions .uw-guide-cta:focus-visible .uw-action-label{background:var(--color-navy);color:var(--color-white)}
.uw-guide-label-mobile{display:none}
.uw-header-actions .header-cta .uw-action-label{background:var(--color-trial);border-color:var(--color-trial);color:var(--color-white)}
.uw-header-actions .header-cta:hover .uw-action-label,.uw-header-actions .header-cta:focus-visible .uw-action-label{background:var(--color-white);border-color:var(--color-navy);color:var(--color-navy)}


/* Shared header trial CTA: English label stays fixed; circle replaces the old arrow glyph. */
.uw-header-actions .header-cta .uw-action-label{gap:12px}
.uw-header-actions .uw-header-trial-arrow{display:inline-grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border-radius:50%;background:var(--color-white);color:var(--color-navy);transition:background-color var(--hover-duration) ease,color var(--hover-duration) ease}
.uw-header-actions .uw-header-trial-arrow::after{content:"";width:7px;height:7px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);margin-left:-3px}
.uw-header-actions .header-cta:hover .uw-header-trial-arrow,.uw-header-actions .header-cta:focus-visible .uw-header-trial-arrow{background:var(--color-learning);color:var(--color-white)}
.uw-header-actions .uw-action-caption{display:block;text-align:center;color:var(--color-navy);font-size:12px;font-weight:500;letter-spacing:.12em;line-height:1.4}
.uw-header-actions a:focus-visible{outline:2px solid #14A896;outline-offset:3px}

@media(max-width:1100px) and (min-width:701px){.uw-global-nav{gap:16px}.uw-navrow__inner{gap:10px}.uw-header-actions{gap:8px}.uw-header-actions .uw-action-label{padding-inline:12px;font-size:13px}}
@media(max-width:700px){.uw-header-actions{margin-left:0;gap:4px}.uw-header-actions .uw-action-label{min-height:35px;padding:8px 10px;font-size:12px}.uw-header-actions .uw-action-caption{font-size:10px;letter-spacing:.04em}}
@media(max-width:380px){.uw-header-actions .uw-action-label{font-size:11px;padding-inline:7px}.uw-header-actions .uw-action-caption{font-size:9px}}


/* Footer utility links: secondary navigation below the four main categories. */
.uw-footer-utility{display:flex;flex-wrap:wrap;align-items:center;gap:12px 26px;margin-top:26px;padding-top:20px;border-top:1px solid #ffffff24}
.uw-footer-utility a{color:#d8e1e8;font-size:.76rem;line-height:1.6;text-decoration:none}
.uw-footer-utility a:hover,.uw-footer-utility a:focus-visible{text-decoration:underline}
@media(max-width:700px){.uw-footer-utility{margin-top:32px;gap:12px 20px}}

/* Mobile LESSONS menu only: scroll continuation cue. */
.uw-mega__scroll-hint{display:none}
@media(max-width:700px){
  #uw-mega-1:not([hidden]){display:flex;flex-direction:column;overflow:hidden}
  #uw-mega-1 .uw-mega__inner{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-bottom:12px;scroll-padding-bottom:16px}
  #uw-mega-1 .uw-mega__feature{padding:8px 12px}
  #uw-mega-1 .uw-mega__photo{height:clamp(84px,24vw,112px);margin-bottom:5px}
  #uw-mega-1 .uw-mega__links{gap:7px}
  #uw-mega-1 .uw-mega__scroll-hint{
    position:static;flex:0 0 auto;pointer-events:none;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    min-height:34px;margin:0;padding:4px 12px 5px;
    background:var(--color-white);border-top:1px solid #edf0f3;
    color:#0b2343;font-size:.75rem;font-weight:700;letter-spacing:.02em;
  }
  #uw-mega-1 .uw-mega__scroll-arrow{font-size:1.2rem;line-height:1}
  #uw-mega-1 .uw-mega__scroll-hint.is-hidden{display:none}
}

/* Compact desktop dropdown: the visible panel is also the pointer hit area. */
@media (min-width:701px){
  .site-header .uw-mega{left:var(--uw-dropdown-left, 0px);right:auto;width:300px;max-width:calc(100vw - 24px);background:var(--color-navy);border:0;border-radius:0 0 5px 5px;box-shadow:0 12px 22px #0b172630;z-index:85}
  .site-header #uw-mega-1{width:610px}
  .site-header .uw-mega__inner{display:block;width:100%;padding:9px 10px 12px;max-width:none;margin:0}
  .site-header .uw-mega__feature{display:none}
  .site-header .uw-mega__links{display:grid;grid-template-columns:1fr;gap:0}
  .site-header #uw-mega-1 .uw-mega__links{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}
  .site-header .uw-mega__links a{display:flex;justify-content:space-between;gap:10px;min-height:40px;padding:10px 10px;border:0;border-bottom:1px solid #ffffff20;border-radius:0;background:transparent;color:var(--color-white);text-align:left;font-size:.84rem;font-weight:600;line-height:1.4}
  .site-header .uw-mega__links a::after{content:"→";font-size:1rem;font-weight:400;color:var(--color-white);flex-shrink:0}
  .site-header .uw-mega__links a:hover,.site-header .uw-mega__links a:focus-visible{background:#ffffff17;color:var(--color-white)}
  .site-header .uw-mega__scroll-hint{display:none}
}

/* Mobile accordion: panels remain inside each nav group and its scrollable navigation. */
@media (max-width:700px){
  .site-header .uw-global-nav .uw-mega{position:static;left:auto;right:auto;top:auto;width:100%;max-width:none;max-height:none;overflow:visible;box-shadow:none;border-top:0;z-index:auto}
  .site-header .uw-navgroup{flex-wrap:wrap}
  .site-header .uw-navgroup > .uw-mega{
    position:static;
    flex:0 0 100%;
    width:100%;
    max-width:100%;
    background:var(--color-navy);
    box-shadow:none;
    border:0;
    overflow:visible;
  }
  .site-header .uw-navgroup > .uw-mega[hidden]{display:none}
  .site-header .uw-navgroup > .uw-mega .uw-mega__inner{
    display:block;
    width:100%;
    padding:6px 0 10px;
    margin:0;
    max-height:none;
    overflow:visible;
  }
  .site-header .uw-navgroup > .uw-mega .uw-mega__feature{display:none}
  .site-header .uw-navgroup > .uw-mega .uw-mega__links{
    display:grid;
    grid-template-columns:1fr;
    gap:0;
  }
  .site-header .uw-navgroup > .uw-mega .uw-mega__links a{
    justify-content:space-between;
    min-height:44px;
    padding:12px 14px;
    border:0;
    border-bottom:1px solid #FFFFFF30;
    border-radius:0;
    background:transparent;
    color:var(--color-white);
    text-align:left;
    font-size:14px;
  }
  .site-header .uw-navgroup > .uw-mega .uw-mega__links a::after{
    content:"→";
    color:var(--color-white);
    margin-left:10px;
  }
  .site-header #uw-mega-1:not([hidden]){
    display:block;
    overflow:visible;
  }
  .site-header #uw-mega-1 .uw-mega__inner{
    overflow:visible;
    max-height:none;
  }
  .site-header #uw-mega-1 .uw-mega__scroll-hint{display:none}
}

@media(max-width:700px){.uw-guide-label-desktop{display:none}.uw-guide-label-mobile{display:inline}}

/* Trial navigation: navy microphone/title panel with a reversed hover state. */
.uw-header-actions .header-cta.uw-action--trial {
  display:grid;
  grid-template-rows:56px 17px;
  justify-items:center;
  align-content:center;
  row-gap:3px;
  min-width:134px;
  color:var(--color-navy);
}
.uw-header-actions .header-cta .uw-trial-mic-tile {
  grid-row:1;
  grid-column:1;
  display:grid;
  place-items:center;
  align-self:start;
  width:56px;
  height:56px;
  padding:0;
  border:1px solid var(--color-trial);
  border-radius:7px;
  color:var(--color-white);
  background:var(--color-trial);
  transition:background-color var(--hover-duration) ease,color var(--hover-duration) ease;
}
.uw-header-actions .header-cta .uw-trial-mic-tile svg {width:38px;height:38px}
.uw-header-actions .header-cta .uw-action-caption {
  grid-row:2;
  grid-column:1;
  color:var(--color-navy);
  font-size:12px;
  line-height:17px;
}
.uw-header-actions .header-cta:hover .uw-trial-mic-tile,
.uw-header-actions .header-cta:focus-visible .uw-trial-mic-tile {
  background:var(--color-white);
  color:var(--color-trial);
}
/* Login icon and label remain navy; muted gray on hover. */
/* Match the trial tile's upper row and its caption baseline. */
.uw-header-login {
  display:grid;
  grid-template-rows:56px 17px;
  justify-items:center;
  align-items:center;
  align-content:center;
  row-gap:3px;
  min-width:72px;
  padding:0 4px;
  color:var(--color-navy);
}
.uw-header-login svg {
  grid-row:1;
  width:48px;
  height:48px;
  align-self:center;
}
.uw-header-login span {
  grid-row:2;
  align-self:center;
  font-size:12px;
  line-height:17px;
  font-weight:500;
}
.uw-header-login:hover,.uw-header-login:focus-visible {color:#7C8796}
@media(max-width:700px) {
  .uw-header-actions .header-cta.uw-action--trial {
    grid-template-rows:44px 14px;
    row-gap:2px;
    min-width:106px;
  }
  .uw-header-actions .header-cta .uw-trial-mic-tile {
    width:44px;
    height:44px;
    padding:0;
    border-radius:6px;
  }
  .uw-header-actions .header-cta .uw-trial-mic-tile svg {width:30px;height:30px}
    .uw-header-actions .header-cta .uw-action-caption {font-size:10px;line-height:14px}
  .uw-header-login {grid-template-rows:44px 14px;row-gap:2px;min-width:54px;padding:0 2px}
  .uw-header-login svg {width:42px;height:42px}
  .uw-header-login span {grid-row:2;font-size:10px;line-height:14px;font-weight:500}
}
