/* Chooi Yit Seng's contact card (yitseng.fpmeducation.com). Builds on brochure.css (same card: white top, orange swoosh, navy skyline).
   Only the round portrait and a few spacing tweaks live here. Scoped to body.yitseng-page. */
.yitseng-page .bro-top{padding-bottom:8px}
.yitseng-page .bro-logo{margin-bottom:24px}
.yitseng-page .ys-portrait{display:block;width:clamp(176px,52vw,224px);height:auto;aspect-ratio:1;margin:0 auto 28px;border-radius:50%;object-fit:cover;border:6px solid var(--orange);background:var(--cream);box-shadow:0 14px 30px -14px rgba(25,47,90,.35)}
body.yitseng-page .bro-top h1{font-size:clamp(40px,10.5vw,56px)!important;margin-bottom:8px}
.yitseng-page .bro-sub{font-size:clamp(17px,4.4vw,20px);margin-bottom:24px}
.yitseng-page .bro-button span{white-space:nowrap}
.yitseng-page .bro-button small{min-width:0;overflow-wrap:anywhere;text-align:right}
.yitseng-page .bro-bottom{min-height:260px}
@media (min-width:768px){.yitseng-page .bro-top{padding-top:56px}.yitseng-page .bro-bottom{min-height:340px}}

/* Contact buttons: label and detail stack on narrow phones so the email and phone never break mid-word; detail text stays readable on orange */
.yitseng-page .bro-button.is-primary small{color:var(--ink)}
@media (max-width:420px){
  .yitseng-page .bro-button{display:grid;grid-template-columns:22px 1fr;column-gap:12px;row-gap:2px;align-items:center}
  .yitseng-page .bro-button svg{grid-row:1 / span 2}
  .yitseng-page .bro-button small{grid-column:2;margin-left:0;text-align:left;overflow-wrap:normal;font-size:14px}
}