/* FANTASM mobile typography / 1.3.1
   Layout changes apply only at <=767 CSS px. Copy, pictures, palette, motion and
   desktop styling remain in the original pages. Phrase boundaries are prepared
   in HTML: no runtime tokenizer, scroll listener or animation loop is added. */
wbr.m-break {display:none;}
m-word.m-word, m-phrase.m-phrase {display:contents;}
@media (max-width:767px) {
  #main .m-typeset .m-phrase {display:inline-block;white-space:normal;overflow-wrap:break-word;max-width:100%;font:inherit;color:inherit;letter-spacing:inherit;vertical-align:baseline;}
  #main .m-typeset {word-break:keep-all;overflow-wrap:normal;line-break:strict;white-space:normal;text-wrap:wrap;}
  #main .m-natural-heading {word-break:normal;}
  #main .m-typeset .m-break {display:inline;}
  #main .m-typeset .m-heading-break {display:none;}
  #main p .m-flow-break {display:none;}
  #main .m-word {display:inline-block;max-inline-size:100%;white-space:normal;word-break:normal;overflow-wrap:break-word;vertical-align:baseline;font:inherit;letter-spacing:inherit;color:inherit;}
  #main :is(p,li,dd,dt,label,summary) {line-break:strict;word-break:normal;}
  #main :is(.film-prose,.exec-content,.service-copy-column,.creator-prose,.rb-hero-copy,.mk-prose,.fb-prose,.career-prose,.member-answers) {min-width:0;}
  #main .button {min-width:0;max-width:100%;}
  #main .button > span {min-width:0;line-break:strict;}
  #main .button > svg {flex-shrink:0;}
  #main .film-origin-quote .m-origin-line {display:block;white-space:nowrap;}
  #main .film-origin-quote {font-size:clamp(18px,5.38vw,22px);line-height:2;letter-spacing:.025em;}
  #main .film-gate-quotes {width:calc(100% - 40px);}
  body.page-career-environment #main .life-opening h1 {max-width:none;font-size:clamp(20px,6.4vw,28px);line-height:1.45;letter-spacing:.005em;}
  body.page-career-environment #main .life-opening h1 .career-headline-part {white-space:normal;}
  body.page-career-environment #main .life-opening-grid {grid-template-columns:minmax(0,1fr);}
  body.page-career-environment #main .life-earnings-grid {grid-template-columns:minmax(0,1fr);}
  body.page-career-environment #main .life-earnings-cards {grid-template-columns:minmax(0,1fr);}
  body.page-career-environment #main .life-earnings-card .range, #main .career-income-range {white-space:normal;word-break:normal;overflow-wrap:break-word;}
  body.page-career-environment #main .life-earnings-card h3 {white-space:nowrap;}
  #main .career-field h3 {font-size:clamp(13px,3.65vw,15px);letter-spacing:0;}
  #main .rb-hero-copy h1 {font-size:clamp(27px,7.2vw,32px);line-height:1.55;letter-spacing:.015em;}
  #main .rb-title-lines {font-size:clamp(23px,6.8vw,30px);line-height:1.6;letter-spacing:.01em;}
  #main .rb-title-lines > span {white-space:normal;}
  #main .mk-heading h2 {font-size:clamp(23px,6.7vw,29px);line-height:1.6;letter-spacing:.01em;}
  #service-liveEvent-title > span {display:inline;}
  #main .fb-table-wrap {max-width:100%;}
  body.page-career-environment #main h2.m-typeset {font-size:clamp(23px,6.3vw,27px);line-height:1.6;}
  body.page-career-environment #main .career-section-intro {grid-template-columns:minmax(0,1fr);}
  body.page-career-environment #main .career-section-intro > * {min-width:0;}
  #heading-event.m-typeset {max-width:11em;}
  #main .exec-content h3.m-typeset {font-size:clamp(19px,5.8vw,24px);letter-spacing:.02em;}
}

/* v1.3.0 — editorial phrase wrapping. No runtime tokeniser or scroll handler.
   A clause stays together when it fits; longer clauses use lexical boundaries.
   The two-line origin quotation is the only explicitly fixed quoted line count.
   Text-only wrappers dissolve outside the mobile breakpoint. */
m-clause.m-clause, m-atom.m-atom, m-run.m-run {display:contents;}
@media(max-width:767px) {
 #main .m-atom {
   display:inline-block;max-inline-size:100%;min-inline-size:0;
   white-space:normal;word-break:normal;overflow-wrap:break-word;
   line-break:strict;text-wrap:wrap;vertical-align:baseline;
   font:inherit;color:inherit;letter-spacing:inherit;
 }
 #main .m-clause {display:inline-block;max-width:100%;white-space:normal;word-break:normal;overflow-wrap:normal;line-break:strict;vertical-align:top;font:inherit;color:inherit;letter-spacing:inherit;}
 #main .m-editorial {white-space:normal;word-break:normal;overflow-wrap:normal;line-break:strict;text-wrap:wrap;}
 #main .m-editorial span.m-flow-part {display:contents!important;}
 #main .m-body-flow {min-inline-size:0;line-break:strict;word-break:normal;white-space:normal;overflow-wrap:break-word;text-wrap:wrap;}
 #main .m-quotation {vertical-align:baseline;}
 #main .m-run {display:contents;}
 #main summary .m-run,#main .service-name .m-run {display:block;min-width:0;flex:1;}
 #main .film-gate-quotes {width:calc(100% - 32px);}
 #main .film-origin-quote.m-origin-two-lines {font-size:clamp(14px,4.35vw,24px);letter-spacing:0;line-height:1.95;max-width:none;}
 #main .film-origin-quote .m-origin-sentence {display:block;white-space:normal;overflow-wrap:break-word;}
 body.page-career-environment #main .life-opening h1 span.career-headline-part {display:block!important;}
 .page-signage #main .sa-section h2.m-editorial,.page-signage #main .sa-contact h2.m-editorial {font-size:clamp(23px,6.7vw,30px);line-height:1.6;letter-spacing:0;}
 .page-signage #main :is(.sa-generation,.sa-return) h2.m-editorial {font-size:clamp(20px,6vw,27px);}
 #main #heading-event.m-editorial {max-width:none;}
 #main .exec-content h3.m-editorial {max-width:none;}
 #main .sa-hero-tagline.m-editorial {font-size:clamp(18px,5.6vw,25px);letter-spacing:0;}
 #main .sa-name-statement blockquote.m-editorial {font-size:17px;line-height:1.85;}
 #main .sa-name-statement blockquote .m-clause {display:contents;}
 #main .fb-scope-card h3.m-editorial {font-size:clamp(18px,5.3vw,21px);letter-spacing:0;}
 #main .fb-plan-story h3.m-editorial {font-size:clamp(16px,5vw,20px);letter-spacing:0;}
 #main .mk-general-box h2.m-editorial {font-size:clamp(18.5px,5.8vw,25px);letter-spacing:0;line-height:1.6;}
 #main .career-bridge-grid h2.m-editorial {font-size:clamp(18.5px,5.5vw,25px);letter-spacing:0;line-height:1.65;}
 #main .career-jobs-heading h2.m-editorial {font-size:clamp(21px,6.4vw,25px);letter-spacing:0;}
 #main .career-income-range,#main .life-earnings-card .range,#main .career-income-range .m-run,#main .life-earnings-card .range .m-run {white-space:normal;text-wrap:wrap;word-break:normal;}
 #main h2.fb-heading.m-editorial {font-size:clamp(22px,6.4vw,25px);}
 #main h1.fb-heading.m-editorial {font-size:clamp(26px,8.2vw,32px);}
 #main #about-title.m-editorial {font-size:clamp(21px,6.6vw,28px);}
 #main [data-career-copy="recruit.hero.title"] span.career-headline-part {display:inline-block!important;max-width:100%;white-space:normal;}
}

/* 1.3.1: prevent automatic text inflation in a fully responsive layout.
   Browser zoom and user text enlargement are not disabled. Atomic inline boxes
   provide real wrap opportunities between phrases on engines that join adjacent
   nowrap inline text runs. Oversized phrases may wrap rather than be clipped. */
@media (max-width:767px) {
 html {-webkit-text-size-adjust:100%;text-size-adjust:100%;}
 .page-signage #main .sa-intro-grid {grid-template-columns:minmax(0,1fr);}
 .page-signage #main .sa-intro-grid > *,
 .page-signage #main .sa-prose,
 #main .film-prose {min-width:0;max-width:100%;}
 #main .m-atom, #main .m-word, #main .m-clause, #main .m-phrase {
   height:auto;max-height:none;text-indent:0;
 }
}

/* Short action labels keep their natural width. They stay side by side when
   there is room; at enlarged text sizes the buttons can move onto another row. */
@media (max-width:767px) {
 #main .sky-actions {flex-wrap:wrap;}
 #main .sky-actions .button {min-inline-size:max-content;gap:8px;margin-left:0;}
 #main .sky-actions .button > span {white-space:nowrap;}
 #main .mk-hero-opening-copy > span {white-space:normal;}
}
@media (max-width:430px) {
 #main .career-field-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,10em),1fr));}
}

/* Preserve the approved one-line desktop emphasis while the mobile version
   has an optional semantic break at enlarged text sizes. */
@media(min-width:768px){#main .film-heart-line{white-space:nowrap;}}
/* The decorative 480 figure keeps its approved size at normal text settings,
   but fits the viewport when a user enlarges the surrounding text. */
@media(max-width:767px){#main .rb-number .m-atom{font-size:min(1em,54vw);letter-spacing:-.07em;}}

@media(max-width:767px){
 #main .film-origin-quote.m-origin-two-lines {min-width:0;max-width:calc(100vw - 16px);word-break:normal;}
}
