/* The four approved illustrations: layout and motion belong only to the IB page. */
.ib .ib-art{margin:0;pointer-events:none;user-select:none}
.ib .ib-art img{display:block;width:100%;height:auto;object-fit:contain}
.ib .ib-art-reveal{opacity:1;transform:none}
.ib .ib-art-reveal.is-waiting{opacity:0;transform:translateY(24px) rotate(-2deg)}
.ib .ib-art-reveal.is-shown{animation:ib-watercolour-arrive 1.05s cubic-bezier(.22,1,.36,1) both}
@keyframes ib-watercolour-arrive{from{opacity:0;transform:translateY(24px) rotate(-2deg)}to{opacity:1;transform:none}}

/* A real two-column layout reserves room for the transparent globe. */
.ib .ib-illustrated-hero{position:relative;background:#fff;border-bottom:1px solid #e6e6e8;overflow:clip}
.ib .ib-hero-inner{max-width:1180px;margin:0 auto;padding:34px 32px 52px}
.ib .ib-hero-grid{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(0,1fr);gap:24px;align-items:center}
.ib .ib-hero-copy{position:relative;z-index:1;padding:14px 0 22px}
.ib .ib-hero-title{margin:0;font-family:'Plus Jakarta Sans','Noto Serif TC',serif;font-weight:500;font-size:clamp(36px,4.5vw,57px);line-height:1.32;letter-spacing:-.02em}
.ib .ib-hero-title .kline{overflow:visible;padding:.12em 0}
.ib .ib-hero-title .kline>span{transform:none;animation:none}
.ib .ib-hero-title{animation:ib-watercolour-copy 1s cubic-bezier(.22,1,.36,1) both}
@keyframes ib-watercolour-copy{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.ib .ib-hero-description{margin:24px 0 0;max-width:580px;font-size:16px;line-height:1.9;color:#6b6b70}
.ib .ib-hero-art{width:100%;max-width:470px;margin:0 auto;position:relative;animation:ib-watercolour-globe-in 1.4s cubic-bezier(.22,1,.36,1) both}
.ib .ib-globe-stage{transform:translate3d(0,0,0);transform-origin:50% 66%;will-change:transform}
@keyframes ib-watercolour-globe-in{from{opacity:0;transform:translate3d(16px,30px,0) rotate(3deg) scale(.96)}to{opacity:1;transform:translate3d(0,0,0) rotate(0) scale(1)}}
#hyRoot[data-langroot="en"] .ib-hero-title{font-size:clamp(34px,3.6vw,48px);line-height:1.22}

/* The illustration anchors an editorial introduction; all three reasons stay readable. */
.ib .ib-why{position:relative;background:#fbf7f6;border-bottom:1px solid #e6e6e8;overflow:clip}
.ib .ib-credentials-inner{max-width:1180px;margin:0 auto;padding:64px 32px 38px;position:relative}
.ib .ib-why-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.25fr);gap:clamp(38px,6vw,88px);align-items:start}
.ib .ib-why-intro{padding-top:4px}
.ib .ib-why-kicker{font-size:11px;line-height:1.5;letter-spacing:.18em;color:#857972;margin:0 0 18px}
.ib #ib-why-title{font-family:'Noto Serif TC',serif;font-size:clamp(32px,3.6vw,44px);font-weight:500;line-height:1.6;letter-spacing:.015em;margin:0}
.ib #ib-why-title em{font-style:normal;color:#b12e2c}
#hyRoot[data-langroot="en"] #ib-why-title{font-size:clamp(32px,3.5vw,43px);line-height:1.3;letter-spacing:-.025em}
.ib .ib-art-books{width:108%;max-width:365px;margin:18px auto 0;pointer-events:auto;transform-origin:50% 75%}
.ib .ib-art-books img{transition:transform .8s cubic-bezier(.22,1,.36,1)}
.ib .ib-why-caption{font-size:11px;line-height:1.5;letter-spacing:.13em;color:#817a74;text-align:center;margin:8px 0 0}
.ib .ib-why-reason{padding:26px 0 28px;border-bottom:1px solid #e3dcd7}
.ib .ib-why-reason:first-child{padding-top:0}
.ib .ib-why-reason:last-child{border:0;padding-bottom:5px}
.ib .ib-why-reason .ct{font-family:'Noto Serif TC',serif;font-size:clamp(24px,2.3vw,28px);font-weight:500;line-height:1.5;letter-spacing:.025em;color:#36513d;margin:0 0 8px}
.ib .ib-why-reason .ck{font-size:13px;line-height:1.8;font-weight:500;color:#a13f38;margin:0 0 8px}
.ib .ib-why-reason .cd{font-size:15.5px;line-height:1.95;color:#62625f;margin:0}
.ib .ib-why-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:36px 0 0;padding-top:25px;border-top:1px solid #d9d1cb}
.ib .ib-why-proof>div{display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 12px}
.ib .ib-why-proof dt{font-size:12px;line-height:1.6;color:#7a736d}
.ib .ib-why-proof dd{order:-1;font-family:'Lora',Georgia,serif;font-size:27px;line-height:1.3;font-weight:500;letter-spacing:-.02em;color:#40463b;white-space:nowrap;margin:0}
.ib .ib-why-proof dd>span{color:#b12e2c}
.ib [data-ib-why-reveal].is-waiting{opacity:0;transform:translateY(22px)}
.ib [data-ib-why-reveal].is-shown{animation:ib-why-arrive 1s cubic-bezier(.22,1,.36,1) var(--ib-why-delay,0ms) both}
.ib .ib-why-reason:nth-child(2){--ib-why-delay:100ms}
.ib .ib-why-reason:nth-child(3){--ib-why-delay:200ms}
@keyframes ib-why-arrive{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@media(hover:hover) and (pointer:fine){
  .ib .ib-art-books:hover img{transform:translateY(-6px) rotate(-1deg)}
}

/* Bamboo grows from the light outer circle, away from its labels and controls. */
#ibFlow .ib-depth-visual{position:relative;width:100%;max-width:400px;margin-inline:auto}
#ibFlow .ib-depth-bamboo{position:absolute;left:-36px;bottom:-28px;width:47%;max-width:195px;z-index:2;transform-origin:50% 95%}
#ibFlow .ib-depth-bamboo img{filter:drop-shadow(0 5px 7px #162c2812)}
#ibFlow .ib-depth-bamboo.is-shown{animation:ib-watercolour-bamboo-in 1.3s cubic-bezier(.22,1,.36,1) both}
@keyframes ib-watercolour-bamboo-in{from{opacity:0;transform:translateY(16px) rotate(-4deg)}to{opacity:1;transform:none}}

@media(max-width:1040px){
  .ib .ib-hero-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:12px}
  .ib .ib-hero-title{font-size:clamp(35px,4.4vw,47px)}
  .ib .ib-hero-description{font-size:15px}
  .ib .ib-why-layout{gap:38px}
  .ib .ib-why-reason .cd{font-size:14.5px}
}
@media(max-width:760px){
  .ib .ib-hero-inner{padding:25px 24px 32px}
  .ib .ib-hero-grid{grid-template-columns:minmax(0,1fr);gap:8px}
  .ib .ib-hero-copy{padding:4px 0 0}
  .ib .ib-hero-title{font-size:clamp(32px,7vw,46px);line-height:1.42}
  #hyRoot[data-langroot="en"] .ib-hero-title{font-size:clamp(31px,6.5vw,43px);line-height:1.3}
  .ib .ib-hero-description{margin-top:19px;max-width:none;font-size:15px}
  .ib .ib-hero-art{max-width:330px;width:84%;margin:12px auto 0}
  .ib .ib-credentials-inner{padding:40px 24px 30px}
  #ibFlow .ib-depth-visual{max-width:310px}
  #ibFlow .ib-depth-bamboo{left:-22px;bottom:-15px;width:46%}
}
@media(max-width:680px){
  .ib .ib-why-layout{grid-template-columns:minmax(0,1fr);gap:28px}
  .ib .ib-why-intro{display:grid;grid-template-columns:minmax(0,1fr) clamp(120px,29vw,185px);gap:0 12px;align-items:center}
  .ib .ib-why-kicker{grid-column:1/-1;letter-spacing:.14em;margin-bottom:16px}
  .ib #ib-why-title{grid-column:1;font-size:clamp(27px,5.4vw,35px);line-height:1.6}
  #hyRoot[data-langroot="en"] #ib-why-title{font-size:clamp(28px,5.2vw,34px);line-height:1.3}
  .ib .ib-art-books{grid-column:2;grid-row:2/4;align-self:center;justify-self:center;width:112%;max-width:none;margin:0}
  .ib .ib-why-caption{grid-column:1;text-align:left;letter-spacing:.075em;margin-top:10px}
  .ib .ib-why-reason{padding:22px 0}
  .ib .ib-why-reason .ct{font-size:24px}
  .ib .ib-why-reason .ck{font-size:12.5px}
  .ib .ib-why-reason .cd{font-size:14.5px;line-height:1.85}
  .ib .ib-why-proof{gap:14px;margin-top:28px;padding-top:22px}
  .ib .ib-why-proof>div{flex-direction:column;gap:5px}
  .ib .ib-why-proof dd{font-size:22px}
  .ib .ib-why-proof dt{font-size:11px}
}
@media(max-width:400px){
  .ib .ib-hero-inner{padding-inline:20px}
  .ib .ib-hero-title{font-size:31px}
  .ib .ib-hero-copy a.ib-mag{padding:13px 19px!important;font-size:14px!important}
  .ib .ib-credentials-inner{padding-inline:20px}
  #ibFlow .ib-depth-visual{max-width:280px}
}
@media(prefers-reduced-motion:reduce){
  .ib .ib-hero-art,.ib .ib-hero-title,.ib .ib-art-reveal,#ibFlow .ib-depth-bamboo{animation:none!important;opacity:1!important;transform:none!important}
  .ib .ib-globe-stage{transform:none!important;will-change:auto}
  .ib .ib-marqrow{animation:none!important}
  .ib [data-ib-why-reveal],.ib .ib-art-books img{animation:none!important;transition:none!important;opacity:1!important;transform:none!important}
}