:root {
  --forest:#102d27;
  --forest-2:#1a4137;
  --ink:#17231f;
  --paper:#f4f1e7;
  --paper-2:#e9e5d9;
  --lime:#d5f276;
  --muted:#6b756e;
  --line:rgba(23,35,31,.16);
  --white:#fffdf7;
  --mono:ui-monospace,SFMono-Regular,Consolas,monospace;
  --sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --display:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6
}
a {
  color:inherit
}
button {
  font:inherit
}
.skip-link {
  position:absolute;
  left:-9999px;
  top:0;
  background:var(--lime);
  padding:1rem;
  z-index:100
}
.skip-link:focus {
  left:1rem
}
.site-header {
  height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 6.1%;
  border-bottom:1px solid rgba(255,255,255,.13);
  background:var(--forest);
  color:var(--white);
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index:5
}
.brand {
  display:inline-flex;
  align-items:center;
  gap:11px;
  text-decoration:none;
  font-family:var(--display);
  font-weight:800;
  letter-spacing:.08em;
  font-size:13px
}
.brand-mark {
  width:34px;
  height:34px;
  border:1px solid rgba(213,242,118,.8);
  border-radius:50%;
  display:grid;
  place-items:center;
  color:var(--lime);
  font-family:var(--mono);
  font-size:14px;
  letter-spacing:-.08em
}
.brand-light {
  font-weight:500;
  color:#b4c1b9
}
.nav-links {
  display:flex;
  align-items:center;
  gap:36px;
  font-size:13px
}
.nav-links a {
  text-decoration:none;
  color:#e0e8e1
}
.nav-links a:hover {
  color:var(--lime)
}
.nav-links .nav-cta {
  border:1px solid rgba(213,242,118,.7);
  border-radius:30px;
  padding:10px 16px;
  color:var(--lime)
}
.nav-cta span {
  margin-left:7px
}
.menu-toggle {
  display:none
}
.hero {
  min-height:720px;
  padding:160px 6.1% 56px;
  background:var(--forest);
  color:var(--white);
  display:grid;
  grid-template-columns:1.03fr .97fr;
  align-items:center;
  gap:5%;
  position:relative;
  overflow:hidden
}
.hero-copy {
  max-width:580px;
  padding-bottom:37px;
  position:relative;
  z-index:2
}
.eyebrow {
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#8a9b8f;
  margin:0 0 20px;
  display:flex;
  align-items:center;
  gap:10px
}
.hero .eyebrow {
  color:#b5c8b9
}
.eyebrow-dot {
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--lime);
  box-shadow:0 0 0 4px rgba(213,242,118,.13)
}
h1,h2,h3,p {
  margin-top:0
}
h1,h2 {
  font-family:var(--display);
  letter-spacing:-.055em;
  line-height:1.04
}
h1 {
  font-size:clamp(52px,5.8vw,78px);
  font-weight:600;
  margin:0 0 26px
}
h1 em {
  font-style:normal;
  color:var(--lime)
}
.hero-lede {
  font-size:17px;
  line-height:1.65;
  color:#d2ded4;
  max-width:480px;
  margin-bottom:30px
}
.hero-lede strong {
  font-family:var(--mono);
  font-weight:500;
  color:var(--lime)
}
.hero-actions {
  display:flex;
  align-items:center;
  gap:25px
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:21px;
  text-decoration:none;
  padding:15px 20px;
  border-radius:3px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.01em;
  transition:transform .2s,background .2s
}
.button:hover {
  transform:translateY(-2px)
}
.button-lime {
  background:var(--lime);
  color:var(--forest)
}
.button-lime:hover {
  background:#e3ff93
}
.text-link {
  font-size:12px;
  text-decoration:none;
  color:#d4ded5
}
.text-link span {
  padding-left:8px;
  color:var(--lime)
}
.hero-note {
  font-size:10px;
  color:#93a79a;
  margin-top:18px
}
.hero-art {
  height:min(440px,44vw);
  min-height:330px;
  position:relative;
  background:#183c32;
  border:1px solid rgba(201,230,179,.16);
  overflow:hidden
}
.map-grid {
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(223,237,215,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(223,237,215,.08) 1px,transparent 1px);
  background-size:34px 34px;
  opacity:.6
}
.map-contour {
  position:absolute;
  border:1px solid rgba(208,227,194,.14);
  border-radius:48% 52% 42% 58%/54% 43% 57% 46%;
  transform:rotate(-20deg)
}
.contour-one {
  width:80%;
  height:90%;
  left:-5%;
  top:-22%
}
.contour-two {
  width:62%;
  height:75%;
  left:3%;
  top:-12%;
  border-color:rgba(208,227,194,.1)
}
.map-path {
  position:absolute;
  border:1px dashed rgba(213,242,118,.47);
  border-radius:50%
}
.path-one {
  width:71%;
  height:68%;
  right:-20%;
  top:11%;
  transform:rotate(30deg)
}
.path-two {
  width:90%;
  height:46%;
  left:-22%;
  bottom:2%;
  transform:rotate(-28deg);
  border-color:rgba(211,228,190,.3)
}
.map-label {
  position:absolute;
  font-family:var(--mono);
  font-size:8px;
  letter-spacing:.13em;
  color:#b2c4b5
}
.label-north {
  top:25px;
  left:27px
}
.label-north span {
  padding-left:24px;
  color:var(--lime)
}
.label-south {
  bottom:22px;
  left:27px;
  font-size:7px
}
.map-card {
  position:absolute;
  width:58%;
  left:21%;
  top:27%;
  background:var(--paper);
  color:var(--ink);
  padding:22px 24px;
  box-shadow:0 20px 45px rgba(0,0,0,.22);
  transform:rotate(-3deg);
  display:flex;
  flex-direction:column;
  z-index:2
}
.map-card-kicker {
  font-family:var(--mono);
  font-size:7px;
  letter-spacing:.13em;
  color:#76827a
}
.map-domain {
  font-family:var(--display);
  font-size:clamp(20px,3vw,38px);
  font-weight:700;
  letter-spacing:-.06em;
  margin:9px 0 16px
}
.map-domain span {
  color:#698777
}
.map-card-rule {
  height:1px;
  background:#d6d8cb
}
.map-card-foot {
  font-family:var(--mono);
  font-size:8px;
  color:#64736a;
  margin-top:12px
}
.map-card-foot i {
  display:inline-block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#89a56c;
  margin-right:6px
}
.map-pin {
  position:absolute;
  z-index:3;
  width:23px;
  height:23px;
  border-radius:50%;
  background:var(--lime);
  display:grid;
  place-items:center;
  top:22%;
  right:20%;
  box-shadow:0 0 0 8px rgba(213,242,118,.12)
}
.map-pin span {
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--forest)
}
.map-coord {
  position:absolute;
  bottom:62px;
  right:26px;
  font-family:var(--mono);
  font-size:8px;
  line-height:1.8;
  color:#9eb1a1;
  text-align:right
}
.orbit {
  position:absolute;
  width:120px;
  height:120px;
  border:1px solid rgba(213,242,118,.16);
  border-radius:50%;
  right:5%;
  top:9%
}
.orbit-b {
  width:190px;
  height:190px;
  right:-1%;
  top:0;
  border-color:rgba(213,242,118,.08)
}
.hero-bottom {
  position:absolute;
  bottom:24px;
  left:6.1%;
  right:6.1%;
  display:flex;
  justify-content:space-between;
  border-top:1px solid rgba(255,255,255,.15);
  padding-top:13px;
  font-family:var(--mono);
  font-size:8px;
  letter-spacing:.1em;
  color:#8fa397
}
.section-pad {
  padding:105px 9%
}
.section-index {
  font-family:var(--mono);
  font-size:10px;
  color:#9ba69c;
  display:flex;
  gap:16px;
  align-items:center
}
.section-index span {
  color:#738077;
  letter-spacing:.12em
}
.intro {
  display:grid;
  grid-template-columns:.45fr 1.25fr .7fr;
  gap:7%;
  align-items:start
}
.intro .section-index {
  padding-top:9px
}
.intro-main {
  max-width:580px
}
.intro-main .eyebrow,.section-heading .eyebrow,.hosting .eyebrow,.pricing .eyebrow,.closing .eyebrow {
  color:#68766b
}
.intro h2,.section-heading h2,.namebase h2,.hosting h2,.pricing h2,.closing h2 {
  font-size:clamp(38px,4.3vw,58px);
  font-weight:600;
  margin-bottom:22px
}
.intro-main>p:not(.eyebrow) {
  color:#59645c;
  max-width:570px;
  font-size:15px
}
.under-link {
  display:inline-block;
  margin-top:13px;
  color:#315c47;
  font-size:12px;
  font-weight:700;
  text-decoration:none;
  border-bottom:1px solid #809a85;
  padding-bottom:5px
}
.under-link span {
  margin-left:12px
}
.intro-side {
  margin-top:90px;
  border-left:1px solid #b9c1b6;
  padding-left:27px;
  max-width:260px
}
.big-quote {
  font-family:Georgia,serif;
  font-size:50px;
  color:#8fa66e;
  line-height:.8
}
.intro-side p {
  font-family:var(--display);
  font-size:19px;
  font-weight:600;
  line-height:1.35;
  letter-spacing:-.03em
}
.side-caption {
  font-family:var(--mono);
  font-size:8px;
  letter-spacing:.12em;
  color:#869187
}
.uses {
  background:var(--paper-2)
}
.section-heading {
  display:flex;
  justify-content:space-between;
  gap:7%;
  align-items:end;
  margin-bottom:42px
}
.section-heading h2 {
  max-width:640px;
  margin-bottom:0
}
.section-heading>p {
  max-width:305px;
  color:#68736b;
  font-size:13px;
  margin-bottom:5px
}
.use-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid #bfc5b8;
  border-bottom:1px solid #bfc5b8
}
.use-card {
  min-height:315px;
  padding:25px 24px 24px;
  position:relative;
  border-right:1px solid #bfc5b8;
  display:flex;
  flex-direction:column
}
.use-card:first-child {
  border-left:1px solid #bfc5b8
}
.use-card-dark {
  background:var(--forest);
  color:var(--white);
  border-color:var(--forest)
}
.use-num {
  font-family:var(--mono);
  font-size:9px;
  color:#828e83
}
.use-card-dark .use-num {
  color:#93a49a
}
.use-icon {
  height:64px;
  width:70px;
  margin:17px 0 19px;
  position:relative;
  color:#64806a
}
.icon-person i:first-child {
  position:absolute;
  border:1px solid currentColor;
  width:17px;
  height:17px;
  border-radius:50%;
  left:25px;
  top:3px
}
.icon-person i:last-child {
  position:absolute;
  border:1px solid currentColor;
  width:39px;
  height:23px;
  border-radius:22px 22px 3px 3px;
  left:14px;
  top:28px
}
.icon-table i {
  position:absolute;
  width:7px;
  height:7px;
  border:1px solid currentColor;
  border-radius:50%
}
.icon-table i:nth-child(1) {
  left:4px;
  top:20px
}
.icon-table i:nth-child(2) {
  left:28px;
  top:4px
}
.icon-table i:nth-child(3) {
  right:4px;
  top:20px
}
.icon-table i:nth-child(4) {
  left:28px;
  bottom:4px
}
.icon-table:after {
  content:'';
  position:absolute;
  inset:17px 13px;
  border:1px solid currentColor;
  transform:rotate(45deg)
}
.icon-cube i {
  position:absolute;
  border:1px solid currentColor;
  transform:rotate(30deg) skew(-8deg);
  width:25px;
  height:29px
}
.icon-cube i:nth-child(1) {
  left:5px;
  top:19px
}
.icon-cube i:nth-child(2) {
  left:25px;
  top:8px
}
.icon-cube i:nth-child(3) {
  left:42px;
  top:22px
}
.icon-world i {
  position:absolute;
  border:1px solid #bed978;
  border-radius:50%;
  width:49px;
  height:49px;
  left:11px;
  top:6px
}
.icon-world i:nth-child(2) {
  width:25px;
  left:23px;
  border-radius:50%
}
.icon-world i:nth-child(3) {
  height:22px;
  width:49px;
  top:20px
}
.use-card h3 {
  font-family:var(--display);
  font-size:18px;
  letter-spacing:-.04em;
  margin:0 0 10px
}
.use-card p {
  font-size:12px;
  color:#69736c;
  line-height:1.6;
  margin:0 0 22px
}
.use-card-dark p {
  color:#c1cec2
}
.example-name {
  font-family:var(--mono);
  font-size:10px;
  color:#50705a;
  margin-top:auto
}
.example-name span {
  color:#8d9a8e
}
.use-card-dark .example-name {
  color:var(--lime)
}
.use-card-dark .example-name span {
  color:#a9bda9
}
.small-print {
  font-size:10px;
  color:#7a847b;
  margin-top:16px
}
.namebase {
  background:#e4e0d4
}
.namebase-grid {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:12%
}
.namebase-lede .eyebrow {
  color:#6d786e
}
.namebase h2 {
  max-width:480px
}
.review-copy {
  font-size:14px;
  line-height:1.75;
  color:#59645d;
  max-width:520px
}
.review-signature {
  display:flex;
  align-items:center;
  gap:13px;
  margin-top:33px;
  font-family:var(--display);
  font-size:13px;
  font-weight:700
}
.signature-line {
  width:36px;
  height:1px;
  background:#7b8f75
}
.review-signature small {
  display:block;
  font-family:var(--mono);
  font-weight:400;
  color:#7b867d;
  font-size:8px;
  letter-spacing:.02em;
  margin-top:3px
}
.principles {
  padding-top:7px
}
.principles article {
  display:grid;
  grid-template-columns:35px 1fr;
  gap:18px;
  padding:0 0 23px;
  margin:0 0 22px;
  border-bottom:1px solid #c4c8bb
}
.principles article>span {
  font-family:var(--mono);
  font-size:9px;
  color:#879486;
  padding-top:4px
}
.principles h3 {
  font-family:var(--display);
  font-size:16px;
  letter-spacing:-.025em;
  margin-bottom:5px
}
.principles p {
  font-size:12px;
  line-height:1.65;
  color:#67716a;
  margin:0;
  max-width:460px
}
.callout {
  display:flex;
  gap:13px;
  align-items:flex-start;
  padding:15px 17px;
  background:#d7dbc9
}
.callout-mark {
  font-family:var(--mono);
  color:#507253
}
.callout p {
  font-family:var(--display);
  font-weight:600;
  font-size:12px;
  color:#3c4c3e;
  margin:0;
  line-height:1.5
}
.access {
  background:var(--paper)
}
.steps {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid #bdc3b8;
  border-bottom:1px solid #bdc3b8
}
.steps article {
  padding:25px 30px 30px 0;
  display:grid;
  grid-template-columns:38px 1fr;
  gap:14px;
  border-right:1px solid #bdc3b8;
  margin-right:24px
}
.steps article:last-child {
  border-right:0;
  margin-right:0
}
.step-number {
  font-family:var(--mono);
  font-size:10px;
  color:#8b978c
}
.step-label {
  font-family:var(--mono);
  font-size:8px;
  letter-spacing:.15em;
  color:#789074
}
.steps h3 {
  font-family:var(--display);
  font-size:19px;
  line-height:1.2;
  letter-spacing:-.04em;
  margin:8px 0 11px
}
.steps p {
  font-size:12px;
  color:#68736a;
  line-height:1.7;
  margin-bottom:16px
}
.steps a {
  font-size:10px;
  font-weight:700;
  text-decoration:none;
  color:#315c47;
  border-bottom:1px solid #a3b69c;
  padding-bottom:3px
}
.mint-note {
  display:flex;
  align-items:center;
  gap:20px;
  background:#e6e8db;
  margin-top:26px;
  padding:23px 27px
}
.mint-symbol {
  font-family:var(--display);
  font-size:39px;
  color:#64805d;
  line-height:1
}
.mint-note .step-label {
  color:#788276
}
.mint-note p {
  font-size:11px;
  color:#636e65;
  line-height:1.65;
  margin:6px 0 0;
  max-width:900px
}
.hosting {
  background:#dce4d7;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:8%;
  align-items:center
}
.hosting-head {
  max-width:560px
}
.hosting h2 {
  font-size:clamp(36px,4vw,54px)
}
.hosting-head>p:last-child {
  font-size:13px;
  color:#5e6d61;
  line-height:1.75
}
.hosting-cards {
  display:grid;
  gap:10px
}
.hosting-cards article {
  display:grid;
  grid-template-columns:58px 1fr;
  column-gap:14px;
  align-items:center;
  background:rgba(255,255,255,.4);
  padding:15px
}
.mini-icon {
  grid-row:span 2;
  width:48px;
  height:40px;
  border:1px solid #99ad96;
  display:grid;
  place-items:center;
  font-family:var(--mono);
  font-size:9px;
  color:#44654c
}
.hosting-cards h3 {
  font-family:var(--display);
  font-size:15px;
  margin:0
}
.hosting-cards p {
  font-size:10px;
  color:#68756b;
  margin:3px 0 0
}
.hosting-footnote {
  grid-column:2;
  font-size:9px;
  line-height:1.6;
  color:#718073;
  margin:-1% 0 0
}
.pricing {
  background:var(--forest);
  color:var(--white);
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:10%;
  align-items:start
}
.pricing .eyebrow {
  color:#a3b5a5
}
.pricing h2 {
  max-width:410px
}
.pricing-copy>p:not(.eyebrow) {
  color:#c1d0c3;
  font-size:13px;
  max-width:400px;
  line-height:1.75;
  margin-bottom:27px
}
.button-light {
  background:var(--paper);
  color:var(--forest)
}
.button-light:hover {
  background:var(--lime)
}
.price-list {
  border-top:1px solid rgba(255,255,255,.2)
}
.price-list>div {
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:0 15px;
  padding:19px 0;
  border-bottom:1px solid rgba(255,255,255,.2)
}
.price-list>div>span {
  font-family:var(--mono);
  font-size:8px;
  letter-spacing:.12em;
  color:#a6b9a8
}
.price-list strong {
  grid-column:2;
  grid-row:1/3;
  font-family:var(--display);
  font-size:25px;
  letter-spacing:-.05em
}
.price-list strong small {
  font-family:var(--mono);
  font-size:9px;
  font-weight:400;
  letter-spacing:0;
  color:#9eafa1
}
.price-list p {
  font-size:10px;
  color:#c2cec4;
  margin:4px 0 0
}
.price-list .price-caveat {
  font-size:9px;
  line-height:1.6;
  color:#aab9ad;
  margin-top:13px
}
.closing {
  text-align:center;
  background:var(--paper);
  padding-top:108px;
  padding-bottom:93px
}
.closing .eyebrow {
  justify-content:center
}
.closing h2 {
  font-size:clamp(47px,6vw,76px);
  margin-bottom:26px
}
.closing>p:last-child {
  font-family:var(--mono);
  font-size:8px;
  letter-spacing:.07em;
  color:#7d887e;
  line-height:1.9;
  margin:33px 0 0
}
.site-footer {
  padding:33px 6.1% 25px;
  background:#0b211d;
  color:#dfe7df;
  display:grid;
  grid-template-columns:1fr 1fr auto;
  align-items:center;
  gap:14px 30px
}
.site-footer .brand {
  grid-column:1
}
.site-footer>p {
  grid-column:2;
  margin:0;
  font-size:10px;
  color:#a2b2a4
}
.site-footer>div {
  grid-column:3;
  display:flex;
  gap:21px
}
.site-footer>div a {
  font-size:9px;
  text-decoration:none;
  color:#bfcbc0
}
.site-footer>div a:hover {
  color:var(--lime)
}
.site-footer>small {
  grid-column:1/-1;
  border-top:1px solid rgba(255,255,255,.12);
  padding-top:15px;
  color:#809187;
  font-family:var(--mono);
  font-size:8px;
  letter-spacing:.04em
}
@media(max-width:1000px) {
  .hero {
    padding-left:5%;
    padding-right:5%;
    gap:3%
  }
  .hero-bottom {
    left:5%;
    right:5%
  }
  .section-pad {
    padding:85px 6%
  }
  .intro {
    grid-template-columns:.3fr 1.3fr .7fr;
    gap:4%
  }
  .use-card {
    padding:22px 17px
  }
  .use-card h3 {
    font-size:16px
  }
  .namebase-grid {
    gap:7%
  }
  .steps article {
    padding-right:17px;
    margin-right:16px;
    grid-template-columns:27px 1fr;
    gap:10px
  }
  .pricing {
    gap:6%
  }
  .site-footer {
    padding-left:5%;
    padding-right:5%
  }
  
}
@media(max-width:760px) {
  .site-header {
    height:68px;
    padding:0 6%;
    position:absolute
  }
  .menu-toggle {
    display:flex;
    width:38px;
    height:38px;
    border:1px solid rgba(255,255,255,.25);
    border-radius:50%;
    background:transparent;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px
  }
  .menu-toggle span {
    width:13px;
    height:1px;
    background:#e4eee6
  }
  .nav-links {
    display:none;
    position:absolute;
    top:67px;
    left:0;
    width:100%;
    background:var(--forest);
    padding:19px 6% 25px;
    align-items:flex-start;
    flex-direction:column;
    gap:18px;
    border-top:1px solid rgba(255,255,255,.12)
  }
  .nav-links.open {
    display:flex
  }
  .nav-links .nav-cta {
    margin-top:2px
  }
  .hero {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    padding:129px 6% 70px;
    min-height:auto
  }
  .hero-copy {
    padding-bottom:30px
  }
  .hero h1 {
    font-size:clamp(56px,15vw,83px)
  }
  .hero-lede {
    font-size:15px
  }
  .hero-art {
    height:350px;
    min-height:0;
    width:100%
  }
  .hero-bottom {
    bottom:17px;
    font-size:7px
  }
  .hero-bottom span:last-child {
    text-align:right
  }
  .section-pad {
    padding:72px 7%
  }
  .intro {
    display:grid;
    grid-template-columns:1fr;
    gap:27px
  }
  .intro .section-index {
    order:0
  }
  .intro-main {
    order:1
  }
  .intro-side {
    order:2;
    margin:8px 0 0 34px
  }
  .intro h2,.section-heading h2,.namebase h2,.hosting h2,.pricing h2 {
    font-size:clamp(36px,10vw,50px)
  }
  .section-heading {
    display:block;
    margin-bottom:30px
  }
  .section-heading>p {
    margin-top:17px
  }
  .use-grid {
    grid-template-columns:repeat(2,1fr)
  }
  .use-card {
    min-height:300px;
    border-bottom:1px solid #bfc5b8
  }
  .use-card:nth-child(3) {
    border-left:1px solid #bfc5b8
  }
  .use-card:nth-child(2) {
    border-right:1px solid #bfc5b8
  }
  .namebase-grid {
    grid-template-columns:1fr;
    gap:48px
  }
  .principles article {
    grid-template-columns:30px 1fr
  }
  .steps {
    grid-template-columns:1fr
  }
  .steps article {
    padding:23px 0;
    border-right:0;
    border-bottom:1px solid #bdc3b8;
    margin-right:0;
    grid-template-columns:38px 1fr
  }
  .steps article:last-child {
    border-bottom:0
  }
  .mint-note {
    align-items:flex-start;
    padding:19px
  }
  .hosting {
    grid-template-columns:1fr;
    gap:33px
  }
  .hosting-footnote {
    grid-column:1;
    margin:0
  }
  .pricing {
    grid-template-columns:1fr;
    gap:42px
  }
  .price-list strong {
    font-size:23px
  }
  .site-footer {
    grid-template-columns:1fr auto;
    gap:15px
  }
  .site-footer .brand {
    grid-column:1
  }
  .site-footer>p {
    grid-column:1;
    margin:0
  }
  .site-footer>div {
    grid-column:1/-1;
    flex-wrap:wrap;
    gap:13px 19px
  }
  .site-footer>small {
    grid-column:1/-1
  }
  .closing {
    padding-top:80px;
    padding-bottom:70px
  }
  
}
@media(max-width:420px) {
  .hero-actions {
    align-items:flex-start;
    flex-direction:column;
    gap:16px
  }
  .hero-art {
    height:300px
  }
  .map-card {
    width:68%;
    left:16%;
    padding:18px
  }
  .hero-bottom {
    font-size:6px
  }
  .use-card {
    padding:19px 13px;
    min-height:310px
  }
  .use-card h3 {
    font-size:15px
  }
  .use-card p {
    font-size:11px
  }
  .example-name {
    font-size:9px
  }
  .site-footer>div a {
    font-size:8px
  }
  
}