@font-face {font-family:SFHeroHeadline;src:url('assets/sf-hero-headline-v61.ttf') format('truetype');font-weight:900;font-style:normal;font-display:swap;}
/* v61: consistent headline weight and an integrated photo composition. */
.offline-page .sf-hero-poster {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:var(--sf-blue);
  color:var(--sf-paper);
  padding:64px 0 0;
}
.sf-hero-poster > .sf-wrap {
  width:min(1240px,calc(100% - 64px));
  display:grid;
  grid-template-columns:1fr 1.14fr;
  align-items:center;
  column-gap:12px;
}
.sf-hero-poster-copy { position:relative;z-index:2;padding:0 0 30px;text-align:left; }
.sf-hero-poster-label {
  display:table;
  max-width:100%;
  margin:0 0 30px;
  border:1px solid #ffffffb3;
  border-radius:100px;
  padding:8px 18px;
  color:var(--sf-paper);
  font-size:14px;
  font-weight:650;
  line-height:1.6;
  text-wrap:balance;
}
.offline-page main .sf-hero-poster h1 {
  color:var(--sf-paper);
  font-family:SFHeroHeadline,"Hiragino Kaku Gothic ProN",sans-serif;
  font-size:clamp(62px,6.1vw,86px);
  font-weight:900;
  letter-spacing:-.055em;
  line-height:1.14;
  text-align:left;
  transform:rotate(-1.5deg);
  transform-origin:left center;
  margin:0 0 30px;
}
.sf-hero-poster h1 > span { display:block; }
.sf-hero-poster h1 > span + span { margin-top:8px; }
.offline-page .sf-hero-poster-description {
  color:var(--sf-paper);
  font-size:17px;
  line-height:1.9;
  font-weight:600;
  margin:0 0 24px;
}
.sf-hero-poster-description > span { display:block;text-wrap:pretty; }
.sf-hero-poster-phrase { display:inline-block;max-width:100%;text-wrap:balance; }
.offline-page .sf-hero-poster .sf-hero-poster-cta {
  background:var(--sf-paper);
  color:var(--sf-blue);
  width:min(440px,100%);
  margin:0;
  min-height:64px;
  padding:16px 24px;
  gap:22px;
  font-size:20px;
  line-height:1.5;
  font-weight:750;
  box-shadow:none;
}
.sf-hero-poster-cta > span {
  display:grid;place-items:center;
  flex:0 0 34px;
  width:34px;height:34px;
  color:var(--sf-paper);
  background:var(--sf-blue);
  border-radius:50%;
  font-size:22px;
}
.offline-page .sf-hero-poster .sf-hero-poster-cta:hover { background:var(--sf-tint); }
.offline-page .sf-hero-poster-cta:focus-visible { outline:3px solid var(--sf-paper);outline-offset:5px; }
.sf-hero-poster-visual {
  align-self:end;
  position:relative;
  width:112%;
  max-width:none;
  margin:0 0 0 -7%;
}
.sf-hero-poster-visual > img { display:block;width:100%;height:auto;mask-image:linear-gradient(to bottom,#000 0%,#000 85%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 85%,transparent 100%); }
.sf-hero-poster-visual > figcaption {
  position:absolute;right:8%;bottom:12px;
  color:var(--sf-paper);font-size:12px;line-height:1.5;
  text-shadow:0 1px 4px #1e2d43;
}
.sf-hero-poster-network {
  position:relative;z-index:2;grid-column:1/-1;
  color:var(--sf-paper);font-size:15px;line-height:1.7;font-weight:600;
  margin:0;padding:18px 0 24px;text-align:center;
}
@media(max-width:1000px) and (min-width:701px) {
  .sf-hero-poster > .sf-wrap { grid-template-columns:1fr;width:calc(100% - 64px); }
  .sf-hero-poster-copy { text-align:center;padding-bottom:20px; }
  .sf-hero-poster-label { margin:0 auto 26px; }
  .offline-page main .sf-hero-poster h1 { text-align:center;font-size:80px;transform-origin:center; }
  .sf-hero-poster-visual { width:min(760px,100%);margin:-50px auto 0; }
}
@media(max-width:700px) {
  .offline-page .sf-hero-poster { padding:25px 0 0; }
  .sf-hero-poster > .sf-wrap { display:flex;flex-direction:column;width:100%;gap:0; }
  .sf-hero-poster-copy { width:100%;padding:0 18px 0;text-align:center; }
  .sf-hero-poster-label { margin:0 auto 22px;padding:6px 12px;font-size:14px; }
  .offline-page main .sf-hero-poster h1 {
    font-size:clamp(50px,18.2vw,100px);
    line-height:1.13;letter-spacing:-.055em;
    text-align:center;transform-origin:center;
    margin:0 0 23px;
  }
  .sf-hero-poster h1 > span + span { margin-top:6px; }
  .offline-page .sf-hero-poster-description { font-size:17px;line-height:1.8;margin:0 0 18px; }
  .offline-page .sf-hero-poster .sf-hero-poster-cta {
    width:min(440px,100%);min-height:58px;font-size:18px;
    padding:12px 16px;gap:16px;margin:0;
  }
  .sf-hero-poster-visual { width:115%;margin:-14px -7.5% 0;align-self:center; }
  .sf-hero-poster-visual > figcaption { right:9%;bottom:12px; }
  .sf-hero-poster-network { font-size:14px;padding:4px 16px 22px; }
}
@media(max-width:360px) {
  .sf-hero-poster-copy { padding-inline:16px; }
  .sf-hero-poster-label { padding:5px 10px; }
  .offline-page .sf-hero-poster .sf-hero-poster-cta { font-size:17px;gap:12px; }
}

@media(max-width:360px){.offline-page .sf-hero-poster-description{font-size:16px}}