/* Opt-in styling for university, junior and language guides. Finder appearance remains owned by finder CSS. */
:is(#usa-university-guide,#canada-university-guide,#england-university-guide,#australia-university-guide,#usa-junior-guide,#usa-guide,#canada-language-guide,#england-language-guide,#aus-language-guide,#phil-language-guide,#japan-language-guide,#germany-language-guide,#etc-language-guide) [class*="-hero"] > .up-guide-hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
  align-items:stretch;
}
:is(#usa-university-guide,#canada-university-guide,#england-university-guide,#australia-university-guide,#usa-junior-guide,#usa-guide,#canada-language-guide,#england-language-guide,#aus-language-guide,#phil-language-guide,#japan-language-guide,#germany-language-guide,#etc-language-guide) [class*="-hero"] > .up-guide-hero-grid.up-guide-no-photo {
  grid-template-columns:minmax(0,1fr);
}
:is(#usa-university-guide,#canada-university-guide,#england-university-guide,#australia-university-guide,#usa-junior-guide,#usa-guide,#canada-language-guide,#england-language-guide,#aus-language-guide,#phil-language-guide,#japan-language-guide,#germany-language-guide,#etc-language-guide) .up-guide-hero-photo {
  position:relative;
  min-width:0;
  min-height:0;
  margin:0;
  overflow:hidden;
  border:var(--up-theme-line-width,1px) solid var(--up-color-line,#b8c8d5);
  border-radius:var(--up-hero-card-radius,16px);
  background:var(--up-color-soft,#e7edf1);
}
:is(#usa-university-guide,#canada-university-guide,#england-university-guide,#australia-university-guide,#usa-junior-guide,#usa-guide,#canada-language-guide,#england-language-guide,#aus-language-guide,#phil-language-guide,#japan-language-guide,#germany-language-guide,#etc-language-guide) .up-guide-hero-photo .up-content-hero-media {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  aspect-ratio:auto;
  overflow:hidden;
  border:0;
  border-radius:0;
}
:is(#usa-university-guide,#canada-university-guide,#england-university-guide,#australia-university-guide,#usa-junior-guide,#usa-guide,#canada-language-guide,#england-language-guide,#aus-language-guide,#phil-language-guide,#japan-language-guide,#germany-language-guide,#etc-language-guide) .up-guide-hero-photo .up-content-hero-media img {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-height:none;
  object-fit:cover;
}
.up-guide-hero-photo a:focus-visible {outline:var(--up-focus-width,3px) solid var(--up-color-focus,#1764ce);outline-offset:-5px}
.up-guide-finder {scroll-margin-top:90px}
.up-guide-finder-link {max-width:1200px;margin:20px auto;padding:0 20px;text-align:right}
@media(max-width:1000px) {
  :is(#usa-university-guide,#canada-university-guide,#england-university-guide,#australia-university-guide,#usa-junior-guide,#usa-guide,#canada-language-guide,#england-language-guide,#aus-language-guide,#phil-language-guide,#japan-language-guide,#germany-language-guide,#etc-language-guide) [class*="-hero"] > .up-guide-hero-grid {grid-template-columns:minmax(0,1fr)}
  :is(#usa-university-guide,#canada-university-guide,#england-university-guide,#australia-university-guide,#usa-junior-guide,#usa-guide,#canada-language-guide,#england-language-guide,#aus-language-guide,#phil-language-guide,#japan-language-guide,#germany-language-guide,#etc-language-guide) .up-guide-hero-photo {width:100%;aspect-ratio:16/9}
}

/* Keep the CIA pool visible when the portrait photo is cropped on mobile. */
#phil-language-guide .up-guide-hero-photo .up-content-hero-media img {object-position:50% 74%}
/* Preserve the teacher's face and the Freiburg school entrance on narrow screens. */
#usa-guide .up-guide-hero-photo .up-content-hero-media img {object-position:50% 25%}
#germany-language-guide .up-guide-hero-photo .up-content-hero-media img {object-position:50% 76%}
#canada-language-guide .up-guide-hero-photo .up-content-hero-media img {object-position:50% 75%}

/* Language-guide hero typography. These values apply only to the eight opt-in heroes.
 * Change the PC values here and the mobile values below; the page body is unaffected.
 */
main .up-language-hero {
  --up-language-title-size:36px;
  --up-language-lead-size:18px;
  --up-language-action-size:16px;
  --up-language-meta-size:15px;
  --up-theme-hero-size:var(--up-language-title-size);
  --up-theme-hero-lead-size:var(--up-language-lead-size);
  --up-theme-body-size:var(--up-language-lead-size);
  --up-theme-action-size:var(--up-language-action-size);
  --up-theme-meta-size:var(--up-language-meta-size);
  --up-theme-summary-size:var(--up-language-meta-size);
  --up-theme-heading-leading:1.3;
  --up-theme-body-leading:1.7;
  --up-hero-lead-weight:400;
  --up-font-weight-body:400;
  --up-theme-button-height:48px;
  --up-theme-button-pad-y:12px;
  --up-theme-button-pad-x:20px;
}
main .up-language-hero .up-language-hero__copy {min-width:0}
main .up-language-hero .up-language-hero__eyebrow {
  margin-bottom:12px!important;
  font-size:var(--up-language-meta-size);
  font-weight:600;
  line-height:1.5;
  letter-spacing:0;
}
main .up-language-hero .up-language-hero__title {
  font-size:var(--up-language-title-size);
  line-height:1.3;
  letter-spacing:-.035em;
  word-break:keep-all;
  overflow-wrap:break-word;
}
main .up-language-hero .up-language-hero__lead {
  margin-top:20px!important;
  font-size:var(--up-language-lead-size);
  font-weight:400;
  line-height:1.7;
}
main .up-language-hero .up-language-hero__actions {margin-top:24px;gap:10px}
main .up-language-hero .up-language-hero__actions > a {
  flex:0 1 auto;
  min-width:0;
  max-width:100%;
  min-height:48px;
  gap:10px;
  padding:12px 20px;
  font-size:var(--up-language-action-size);
  font-weight:600;
  line-height:1.5;
  white-space:normal;
  text-decoration:none;
}
main .up-language-hero .up-language-hero__detail {margin-top:24px;padding-top:16px}
main .up-language-hero .up-language-hero__detail strong {font-size:16px;font-weight:600;line-height:1.6}
main .up-language-hero .up-language-hero__detail span {font-size:var(--up-language-meta-size);font-weight:400;line-height:1.6;margin-top:4px}
main .up-language-hero .up-language-hero__country-link {display:inline-block;margin-top:14px;font-size:var(--up-language-meta-size);font-weight:500;color:var(--up-color-accent,#5d48a3)}
main .up-language-hero .up-language-hero__country-link:hover {text-decoration:underline}
@media(max-width:767px) {
  main .up-language-hero {--up-language-title-size:28px;--up-language-lead-size:17px}
  main .up-language-hero .up-language-hero__lead {margin-top:16px!important}
  main .up-language-hero .up-language-hero__actions {margin-top:20px}
  main .up-language-hero .up-language-hero__detail {margin-top:20px}
}
@media(max-width:600px) {
  main .up-language-hero .up-language-hero__actions > a {flex:1 0 100%;width:100%}
}
