/* ============================================================
   SHARED — brand accent tokens, reused across sections 1–3
   ============================================================ */
:root {
  --yamaha-violet-bright: #7B47D2; 
  --yamaha-violet-glow: rgba(123, 71, 210, 0.16);
}

/* ============================================================
   MAIN TITLE-HIDE
   ============================================================ */

.p-heading-attach {
  display: none;
}
/* ============================================================
   MAIN BANNER — left-to-right reveal
   ============================================================ */

.p-mainvisual__img-item {
  animation: iseBannerReveal 1.4s cubic-bezier(0.83, 0, 0.17, 1) 1.8s both;
}
 
@keyframes iseBannerReveal {
  from {
    /* ARROW_SPLIT = 44%  */
     clip-path: inset(0 0 0 44%);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}

/* Hide the carousel prev/next arrow controls*/

.l-mainvisual .p-carousel__arrow-mv {
  display: none;
}
 
@media (prefers-reduced-motion: reduce) {
  .p-mainvisual__img-item {
    animation: none;
  }
}
 

/* ============================================================
   SECTION 1 — Teaser row, 3 columns  [data-id="3229431"]
   ============================================================ */

[data-id="3229431"] {
  padding: 56px 20px 16px;
}

[data-id="3229431"] .l-inner {
  max-width: 1240px;
  margin: 0 auto;
}

/* column strip */

[data-id="3229431"] .p-layout__inner {
  display: flex;
  gap: 0;
  list-style: none;
  padding: 0;
  margin: 0;
  align-items: stretch;
}

[data-id="3229431"] .p-layout__content {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--color-line);
}

[data-id="3229431"] .p-layout__content:first-child {
  border-left: none;
}

[data-id="3229431"] .p-media-layout-02 {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  background: transparent;
}

[data-id="3229431"] .p-media-layout__inner {
  padding: 4px 28px 8px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex-grow: 1;
  position: relative;
}

[data-id="3229431"] .p-layout__content:first-child .p-media-layout__inner {
  padding-left: 4px;
}

/* signal dot */

[data-id="3229431"] .p-media-layout__inner::before {
  content: '';
  display: block;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--yamaha-violet-bright);
  opacity: 0.55;
  margin-bottom: 2px;
  transition: opacity 0.25s ease, box-shadow 0.25s ease;
}

[data-id="3229431"] .p-media-layout-02:hover .p-media-layout__inner::before,
[data-id="3229431"] .p-media-layout-02:active .p-media-layout__inner::before {
  opacity: 1;
  box-shadow: 0 0 0 5px var(--yamaha-violet-glow);
}

/* eyebrow heading */

[data-id="3229431"] .p-media-layout-02__hdg {
  margin: 0;
}

[data-id="3229431"] .c-heading-3__heading {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.3;
}

[data-id="3229431"] .c-heading-4__heading-sub {
  display: inline-block;
  color: var(--color-main);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 1.05rem;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--yamaha-violet-bright);
  transition: border-color 0.25s ease;
}

[data-id="3229431"] .p-media-layout-02:hover .c-heading-4__heading-sub,
[data-id="3229431"] .p-media-layout-02:active .c-heading-4__heading-sub {
  border-color: var(--color-main);
}

/* body text */

[data-id="3229431"] .p-media-layout-02__text {
  flex-grow: 1;
}


/* ---- highlight: 1st column (Attend for free)---- */
[data-id="3229431"] .p-layout__content:first-child .c-button__btn {
  background-color: var(--color-main);
  border-color: var(--color-main);
}
 
[data-id="3229431"] .p-layout__content:first-child .c-button__text {
  color: var(--color-white);
}
 
[data-id="3229431"] .p-layout__content:first-child .c-link-icon {
  filter: brightness(0) invert(1);
}
 
[data-id="3229431"] .p-layout__content:first-child .c-button__btn:hover,
[data-id="3229431"] .p-layout__content:first-child .c-button__btn:active,
[data-id="3229431"] .p-layout__content:first-child .c-button__btn:focus-visible {
  background-color: var(--yamaha-violet-bright);
  border-color: var(--yamaha-violet-bright);
  text-decoration: none;
}

/* link — button left to sitewide .c-button__btn--primary styles */

[data-id="3229431"] .p-media-layout-02__link {
  margin-top: auto;
}

@media (min-width: 1081px) {
  [data-id="3229431"] .c-button__btn {
    padding: 0.75rem 1.25rem;
  }

  [data-id="3229431"] .c-button__text {
    white-space: nowrap;
  }
}


/* responsive */
@media (max-width: 1080px) {
  [data-id="3229431"] .p-layout__inner {
    flex-wrap: wrap;
  }

  [data-id="3229431"] .p-layout__content {
    flex: 1 1 calc(50% - 1px);
  }

  [data-id="3229431"] .p-layout__content:nth-child(2n+1) {
    border-left: none;
  }

  [data-id="3229431"] .p-layout__content:nth-child(-n+2) {
    padding-bottom: 24px;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--color-line);
  }

  [data-id="3229431"] .p-media-layout__inner {
    padding-left: 24px;
  }

  [data-id="3229431"] .p-layout__content:nth-child(2n+1) .p-media-layout__inner {
    padding-left: 4px;
  }
}

@media (max-width: 640px) {
  [data-id="3229431"] {
    padding: 40px 16px 8px;
  }

  [data-id="3229431"] .p-layout__inner {
    flex-direction: column;
  }

  [data-id="3229431"] .p-layout__content {
    flex: 1 1 100%;
    border-left: none !important;
    border-bottom: 1px solid var(--color-line);
    padding-bottom: 20px;
    margin-bottom: 20px;
  }

  [data-id="3229431"] .p-layout__content:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
  }

  [data-id="3229431"] .p-media-layout__inner {
    padding-left: 4px !important;
  }
}


/* ============================================================
   SECTION 2 — Showcase Highlights  [data-id="3229443"]
   Heading divs: #d3229442 (Showcase Highlights), #d3229439 (Meet Us)
   ============================================================ */

.l-wrapper:has(#d3229442),
.l-wrapper:has(#d3229439) {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.l-wrapper:has(#d3229442) .l-inner,
.l-wrapper:has(#d3229439) .l-inner {
  max-width: 1240px !important;
}

#d3229442 .c-heading-2__heading,
#d3229439 .c-heading-2__heading {
  color: var(--color-main);
  position: relative;
}

/* tighter space above "Showcase Highlights" (system default: 48px pc / 40px mobile) */
#d3229442 {
  margin-top: 24px;
}

@media (max-width: 768px) {
  #d3229442 {
    margin-top: 20px;
  }
}

#d3229442 .c-heading-2__heading::before,
#d3229439 .c-heading-2__heading::before {
  content: '';
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--yamaha-violet-bright);
  opacity: 0.8;
  margin: 0 0 12px;
  transition: opacity 0.25s ease, box-shadow 0.25s ease;
}

#d3229442 .c-heading-2__heading:hover::before,
#d3229439 .c-heading-2__heading:hover::before,
#d3229442 .c-heading-2__heading:active::before,
#d3229439 .c-heading-2__heading:active::before {
  opacity: 1;
  box-shadow: 0 0 0 5px var(--yamaha-violet-glow);
}

[data-id="3229443"] {
  padding: 8px 20px 56px;
}

[data-id="3229443"] .l-inner {
  max-width: 1240px;
  margin: 0 auto;
}

/* grid — matched to system's own selector shape to win specificity,
   see note on data-col-narrow/data-col-wide below */
[data-id="3229443"] .p-layout-media[data-col-narrow][data-col-wide] .p-layout__inner {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 48px 32px;
  list-style: none;
  padding: 0;
  margin: 0;
}

[data-id="3229443"] .p-layout-media[data-col-narrow][data-col-wide] .p-layout__inner > .p-layout__content {
  max-width: none !important;
  flex-basis: auto !important;
}

[data-id="3229443"] .p-layout__content {
  display: flex;
  height: 100%;
  min-width: 0;
}

[data-id="3229443"] .p-media-layout-02 {
  width: 100%;
  height: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  background: transparent;
}

[data-id="3229443"] .p-media-layout__inner {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-grow: 1;
  min-width: 0;
  padding-top: 5px;
  position: relative;
}

/* top rule — sweeps in violet left-to-right on hover */
[data-id="3229443"] .p-media-layout__inner::after {
  content: '';
  position: absolute;
  top: -2px;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--color-main);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s ease;
}

[data-id="3229443"] .p-media-layout-02:hover .p-media-layout__inner::after,
[data-id="3229443"] .p-media-layout-02:active .p-media-layout__inner::after {
  transform: scaleX(1);
}

/* reserves exactly two heading lines (2 × 1.05rem × 1.3) so images
   start level across a row; the title sits at the bottom of that
   space, so the title-to-image distance is identical in every
   column whether the title wraps to one line or two */
[data-id="3229443"] .p-media-layout-02__hdg {
  margin: 0;
  min-height: 2.73rem;
  display: flex;
  align-items: flex-end;
}

[data-id="3229443"] .c-heading-3__heading {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.3;
}

[data-id="3229443"] .p-media-layout-02__link {
  margin-top: auto;
  padding-top: 1px;
}

[data-id="3229443"] .c-button__btn {
  padding: 0.75rem 1.25rem;
}

[data-id="3229443"] .c-button__text {
  white-space: nowrap;
}

/* arrow icon removed from these buttons */
[data-id="3229443"] .c-link-icon {
  display: none;
}

[data-id="3229443"] .p-media-layout-02__media {
  padding-top: 0;
  overflow: hidden;
}

[data-id="3229443"] .c-media__media {
  overflow: hidden;
  aspect-ratio: 4 / 3;
}

[data-id="3229443"] .c-media__item {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 0;
}

@media (max-width: 980px) {
  [data-id="3229443"] .p-layout-media[data-col-narrow][data-col-wide] .p-layout__inner {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (max-width: 640px) {
  [data-id="3229443"] .p-layout-media[data-col-narrow][data-col-wide] .p-layout__inner {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 420px) {
  [data-id="3229443"] .p-layout-media[data-col-narrow][data-col-wide] .p-layout__inner {
    grid-template-columns: 1fr !important;
  }
}

/* Section 1 + Section 2 body text — identical*/

[data-id="3229431"] .c-text,
[data-id="3229443"] .c-text {
  font-size: 15px;
  line-height: 1.6;
  color: var(--color-font-sub);
  margin: 0;
}

/* Section 1 body text slightly larger than Section 2 */
[data-id="3229431"] .c-text {
  font-size: 17px;
}


/* ============================================================
   SECTION 3 — Meet Us
   Intro text: [data-id="3229437"]  |  Form: [data-id="3229441"]
   Toggle target: [data-id="d3229493-4"]  |  Intro wrapper: [data-id="d3229493-3"]
   ============================================================ */

[data-id="3229437"] .l-inner {
  max-width: 1240px;
  margin: 0 auto;
}

[data-id="3229437"] .p-media-layout-02 {
  max-width: 736px;
  margin: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  width: 100%;
  padding: 0;
}

[data-id="3229437"] .p-media-layout__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

[data-id="3229437"] .p-media-layout-02__text {
  width: 100%;
}

/* intentionally 1.65 (vs 1.6 in sections 1/2) — wider paragraph reads
   better slightly looser than the narrow teaser/grid columns */

[data-id="3229437"] .c-text {
  font-size: 15px;
  line-height: 1.65;
  color: var(--color-font-sub);
  margin: 0;
}

[data-id="3229437"] .p-media-layout-02__link {
  width: 100%;
}

/* form — [data-id="3229441"] is the form's own component id, distinct
   from [data-id="d3229493-4"] (its positional wrapper, used below for
   the show/hide toggle) */

[data-id="3229441"] {
  margin-top: 0;
  padding: 0 20px;
  background: transparent;
}

[data-id="3229441"] .l-inner--form {
  max-width: 1240px;
  margin: 0 auto;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
}

[data-id="3229441"] .p-form {
  margin-top: 0;
}

[data-id="3229441"] .c-form {
  max-width: 680px;
  margin: 0;
  padding-top: 32px;
  border-top: 1px solid var(--color-line);
  display: flex;
  flex-direction: column;
  gap: 0;
}

[data-id="3229441"] .c-form__item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 16px 0 8px;
}

[data-id="3229441"] .c-form__item--bg-gray {
  background: transparent;
  border-bottom: 1px solid var(--color-line);
  padding: 16px 0;
  gap: 14px;
}

[data-id="3229441"] .c-form__label-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

[data-id="3229441"] .c-form__label {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.78rem;
  color: var(--color-main);
}

[data-id="3229441"] .c-form__label-required {
  font-size: 0.68rem;
  font-weight: 500;
  color: var(--color-white);
  text-transform: none;
  letter-spacing: normal;
}

[data-id="3229441"] .c-form__input {
  padding: 8px 2px;
  border: none;
  border-bottom: 1px solid var(--color-line);
  border-radius: 0;
  background: transparent;
  font-size: 14px;
  width: 100%;
  box-sizing: border-box;
  transition: border-color 0.2s ease;
}

[data-id="3229441"] .c-form__input:focus {
  outline: none;
  border-bottom: 2px solid var(--color-main);
  background: rgba(75, 30, 120, 0.04);
}

[data-id="3229441"] .c-form__select-wrap {
  position: relative;
  width: 100%;
}

[data-id="3229441"] .c-form__select {
  padding: 8px 28px 8px 2px;
  border: none;
  border-bottom: 1px solid var(--color-line);
  border-radius: 0;
  background: transparent;
  font-size: 14px;
  width: 100%;
  box-sizing: border-box;
  appearance: none;
  cursor: pointer;
  transition: border-color 0.2s ease;
}

[data-id="3229441"] .c-form__select:focus {
  outline: none;
  border-bottom: 2px solid var(--color-main);
  background: rgba(75, 30, 120, 0.04);
}

[data-id="3229441"] .c-form__select-img {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  width: 10px;
  height: 10px;
}

[data-id="3229441"] .c-form-checkbox__item {
  accent-color: var(--color-main);
}

[data-id="3229441"] .c-form-checkbox__text a {
  color: var(--color-main);
}

[data-id="3229441"] .c-button--center {
  margin-top: 24px;
}

/* toggle — form hidden by default, revealed via script below */

[data-id="d3229493-4"] {
  padding: 0;
  background: transparent;
  display: none;
  opacity: 0;
  transition: opacity 0.4s ease;
}

[data-id="d3229493-4"].show {
  display: block;
  animation: iseFormFadeIn 0.4s ease forwards;
}

@keyframes iseFormFadeIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* ============================================================
   STICKY CTA — vertical tab fixed to the right edge, markup
   Free HTML component (ise27-sticky-cta.html)
   ============================================================ */

.ise27-side-cta {
  position: fixed;
  right: 0;
  top: 50%;
  z-index: 1000;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 8px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  background: var(--color-main);
  color: #fff;
  border: none;
  border-radius: 8px 0 0 8px;
  padding: 16px 10px;
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  cursor: pointer;
  box-shadow: -4px 0 16px rgba(0, 0, 0, 0.12);
  transition: background 0.2s ease, transform 0.3s ease;
}

.ise27-side-cta:hover,
.ise27-side-cta:active {
  background: var(--yamaha-violet-bright);
}


.ise27-side-cta.hide {
  transform: translateY(-50%) translateX(100%);
}

@media (max-width: 480px) {
  .ise27-side-cta {
    padding: 12px 8px;
    font-size: 0.75rem;
  }
}

/* ============================================================
   sns-footer
   ============================================================ */
.c-button-sns-tob{
  background-color: #4b1e78
}