body{
  display:flex;
  flex-direction:column;
  color:var(--atelier-fg);
  background:var(--atelier-bg);
  font-family:var(--atelier-font-ui);
}

.bg{
  position:fixed;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(600px 600px at 85% 10%,var(--atelier-orb-1),transparent 70%),
    radial-gradient(700px 700px at 10% 95%,var(--atelier-orb-2),transparent 70%),
    var(--atelier-bg);
}

.shell{
  width:100%;
  max-width:40rem;
  margin:0 auto;
  padding:clamp(1.25rem,4vw,2rem) 1.25rem clamp(2rem,6vw,3rem);
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

.topbar{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  margin-bottom:clamp(2.5rem,8vh,4.5rem);
}

.parked-badge{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.4rem .9rem;
  border-radius:999px;
  background:var(--atelier-card);
  border:1px solid var(--atelier-border);
  color:var(--atelier-muted);
  font-family:var(--atelier-font-mono);
  font-size:.69rem;
  font-weight:500;
  letter-spacing:.18em;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.parked-dot{
  width:.4rem;
  height:.4rem;
  border-radius:50%;
  background:var(--atelier-accent);
}

.hero{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  animation:atelier-rise .7s cubic-bezier(.22,1,.36,1) both;
}

.eyebrow{
  margin:0 0 1.5rem;
  font-family:var(--atelier-font-mono);
  font-size:.75rem;
  font-weight:500;
  letter-spacing:.35em;
  text-transform:uppercase;
  color:var(--atelier-muted);
}

.domain{
  position:relative;
  margin:0;
  font-family:var(--atelier-font-mono);
  font-size:clamp(2.6rem,9vw,4.5rem);
  font-weight:600;
  line-height:1.05;
  letter-spacing:-.02em;
  overflow-wrap:anywhere;
}

.domain-visual{display:inline}
.domain-label{color:var(--atelier-fg)}
.domain-tld{color:var(--atelier-accent)}

.u-clip{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.lead{
  margin:1.4rem 0 0;
  max-width:26rem;
  color:var(--atelier-muted);
  font-size:clamp(.95rem,2vw,1.1rem);
  line-height:1.9;
}

.note{
  margin:1.25rem 0 0;
  max-width:28rem;
  padding:.9rem 1.1rem;
  border-radius:1rem;
  background:var(--atelier-card);
  border:1px solid var(--atelier-border);
  color:var(--atelier-fg);
  font-size:.94rem;
  text-align:left;
}

.muted-note{
  margin:1.5rem 0 0;
  max-width:26rem;
  color:var(--atelier-muted);
  font-size:.94rem;
}

.domain-facts{
  list-style:none;
  margin:1.35rem auto 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:.45rem;
  max-width:32rem;
}

.domain-facts li{
  display:inline-flex;
  align-items:baseline;
  gap:.3rem;
  padding:.32rem .7rem;
  border-radius:999px;
  background:var(--atelier-card);
  border:1px solid var(--atelier-border);
  color:var(--atelier-muted);
  font-family:var(--atelier-font-mono);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.02em;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.domain-facts li::marker{content:none}

.fact-en{
  color:rgba(139,132,122,.85);
  font-size:.92em;
  letter-spacing:0;
}

.foot{
  margin-top:auto;
  padding-top:clamp(2.5rem,8vh,4rem);
  text-align:center;
  color:var(--atelier-muted);
  font-size:.75rem;
  animation:atelier-fade .8s ease .15s both;
}

.foot p{margin:0}
.foot a{
  color:var(--atelier-muted);
  text-decoration:none;
}
.foot a:hover{color:var(--atelier-accent)}
.foot-sep{margin:0 .55rem}

.offer-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.25rem;
  width:min(100%,32.5rem);
  margin-top:2.5rem;
  padding:1.35rem 1.6rem;
  border-radius:1.125rem;
  background:var(--atelier-card);
  border:1px solid var(--atelier-border);
  box-shadow:0 24px 70px -28px rgba(33,31,28,.28);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  text-align:left;
  animation:atelier-rise .75s cubic-bezier(.22,1,.36,1) .12s both;
}

.offer-main{display:grid;gap:.2rem;min-width:0}
.offer-label{
  font-family:var(--atelier-font-mono);
  font-size:.69rem;
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--atelier-accent);
}
.offer-price{
  font-size:1.25rem;
  font-weight:700;
  letter-spacing:-.01em;
  color:var(--atelier-fg);
  line-height:1.2;
}
.offer-price .currency{margin-right:.08em}
.offer-sub{
  font-size:.75rem;
  color:var(--atelier-muted);
}

.offer-link{
  flex-shrink:0;
  display:inline-grid;
  justify-items:end;
  gap:.15rem;
  color:var(--atelier-accent);
  font-size:.8125rem;
  font-weight:600;
  text-decoration:none;
  line-height:1.35;
  transition:color .2s ease;
}
.offer-link-ja{
  border-bottom:1px dashed currentColor;
  padding-bottom:2px;
  white-space:nowrap;
}
.offer-link .en{
  color:inherit;
  opacity:.78;
  font-size:.78em;
  font-weight:500;
}
.offer-link:hover{
  color:var(--atelier-accent-hover);
}

@keyframes atelier-rise{
  from{opacity:0;transform:translateY(.875rem)}
  to{opacity:1;transform:none}
}
@keyframes atelier-fade{
  from{opacity:0}
  to{opacity:1}
}

@media (max-width:420px){
  .offer-card{
    flex-direction:column;
    align-items:flex-start;
  }
}