:root{
  --paper:#F1ECE2;
  --ink:#1E2B2C;
  --lake:#2D5C61;
  --lake-line:rgba(45,92,97,.5);
  --marker:#EBA94A;
  --pad:32px;
  --rule:62.5px;          
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Instrument Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}

img{max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,h5,p,ol{margin:0}
ol{padding:0;list-style:none}

.ruled{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='62.5'%3E%3Crect width='4.4' height='1' y='0' fill='%232D5C61' fill-opacity='.5'/%3E%3C/svg%3E");
  background-repeat:repeat;
}

.hdr{
  position:sticky; top:0; z-index:60;
  display:flex; align-items:center; gap:24px;
  height:74px; padding:0 var(--pad);
  background:var(--paper);
  border-bottom:1px solid transparent;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='74'%3E%3Crect width='4.4' height='1' y='73' fill='%232D5C61' fill-opacity='.62'/%3E%3C/svg%3E");
  background-repeat:repeat-x;
  background-position:0 0;
}
.logo{display:block; line-height:0}
.logo img{width:120px; height:auto}

.nav{margin-left:auto; display:flex; gap:26px}
.nav a{
  position:relative; font-size:15px; letter-spacing:.1px;
  padding-bottom:4px;
}
.nav a::after{
  content:""; position:absolute; left:-2px; right:-2px; bottom:-4px; height:7px;
  background:url("assets/underline.svg") no-repeat center/100% 100%;
  transform:scaleX(0); transform-origin:left center;
  transition:transform .34s cubic-bezier(.2,.75,.3,1);
}
.nav a:hover{text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px}
.nav a:hover::after,
.nav a.is-here::after{transform:scaleX(1)}
.nav a.is-here{text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px}

.btn-ghost{
  margin-left:30px;
  display:inline-flex; align-items:center; justify-content:center;
  height:39px; padding:0 17px; border:1.6px solid var(--ink); border-radius:22px;
  font-size:15px; font-weight:500; white-space:nowrap;
  transition:transform .22s ease;
}
.btn-ghost:hover{transform:scale(.955)}

.burger{display:none; margin-left:auto; background:none; border:0; padding:6px; cursor:pointer}
.burger img{width:23px; display:block}

.btn-fill{
  display:inline-flex; align-items:center; justify-content:center;
  height:56px; padding:0 25px; border-radius:30px;
  background:var(--lake); color:#fff; border:1.6px solid var(--lake);
  font-size:18px; font-weight:500;
  transition:background .2s ease,color .2s ease;
}
.btn-fill:hover{background:transparent; color:var(--lake)}

.hero{position:relative; padding-bottom:120px; background-position:0 21px}
.hero-in{
  position:relative;
  max-width:1440px; margin:0 auto;
  height:790px;
  padding:0 var(--pad);
}
.hero-env{
  position:absolute; left:72px; top:63px; width:848px; height:auto; z-index:1;
}
.letter{
  position:absolute; left:110px; top:163px; right:130px; height:395px;
  background:var(--paper); z-index:2;
  padding:118px 0 0 62px;
}
.q{
  font-size:36.5px; font-weight:500; letter-spacing:-.4px; line-height:1.1;
}
.scribbled{position:relative; display:inline-block}

.scribbled > .w,.ul > .w{position:relative; z-index:1}
.scribble{
  position:absolute; left:-2%; top:56%; width:98%; height:auto; pointer-events:none;
}
.field{display:block; margin-top:44px; max-width:1075px}
.field input{
  width:100%; border:0; background:transparent; outline:none;
  font-family:inherit; font-size:29px; font-weight:400; color:var(--ink);
  padding:0 0 12px 4px;
  border-bottom:1px dashed var(--lake-line);
}
.field input::placeholder{color:#7f7c76}

.stamp{position:absolute; left:828px; top:174px; width:122px; z-index:3}

.note{
  position:absolute; right:137px; top:258px; width:388px; z-index:4;
  background:var(--lake); color:#fff;
  transform:rotate(9deg);
  padding:66px 38px 42px;
}

.note::before{
  content:""; position:absolute; left:0; right:0; top:-11px; height:11px;
  background:radial-gradient(circle at 16.85px 11px, var(--lake) 10.4px, transparent 10.9px) repeat-x;
  background-size:33.7px 11px;
}
.note h2{font-size:36px; font-weight:500; line-height:1.12; letter-spacing:-.3px}
.field--note{position:relative; margin-top:36px; max-width:none}
.field--note input{
  color:#fff; font-size:29px; padding-right:34px;
  border-bottom:1px dashed rgba(255,255,255,.85);
}
.field--note input::placeholder{color:rgba(255,255,255,.92)}
.clear{position:absolute; right:6px; bottom:16px; width:14px; filter:brightness(0) invert(1)}
.btn-note{
  margin-top:32px; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  height:46px; padding:0 18px; border-radius:26px;
  background:transparent; color:#fff; border:1.6px solid #fff;
  font-family:inherit; font-size:16px; font-weight:500;
  transition:background .2s ease,color .2s ease;
}
.btn-note:hover{background:#fff; color:var(--lake)}

.scallop-line{
  position:absolute; left:0; right:0; bottom:0; height:24px;
  background:
    radial-gradient(circle at 16.85px 0, transparent 9.3px, var(--lake) 9.4px, var(--lake) 10.9px, transparent 11px) repeat-x;
  background-size:33.7px 24px;
}
.scallop-line::before{
  content:""; position:absolute; left:0; right:0; top:0; height:1.5px; background:var(--lake);
}

.room{max-width:1440px; margin:0 auto; padding:78px var(--pad) 0; text-align:center}
.typer{
  font-size:124px; font-weight:400; letter-spacing:-3.2px; line-height:1.05;
  min-height:1.05em;
}
.typer .caret{color:#a3a09a}
.art{position:relative; margin:0; line-height:0}
.art img{width:100%; height:auto; display:block}

.art-base{position:relative; z-index:2}
.art-part{
  position:absolute; z-index:1; height:auto;
  clip-path:polygon(-40% 0,-40% 0,-75% 100%,-75% 100%);
  
  transition:clip-path calc(var(--d,1) * 1s) cubic-bezier(.32,.6,.3,1) calc(var(--t,0) * 1s);
}
.art.is-in .art-part{clip-path:polygon(-40% 0,140% 0,105% 100%,-75% 100%)}

.scribble,.ul-img{clip-path:inset(0 100% 0 0); transition:clip-path .75s cubic-bezier(.25,.7,.3,1)}
.scribbled.is-in .scribble,.ul.is-in .ul-img{clip-path:inset(0 0 0 0)}
@media (prefers-reduced-motion:reduce){
  .art-part,.scribble,.ul-img{transition:none}
}
.art--room{max-width:1200px; margin:52px auto 0}

.conn{
  max-width:1440px; margin:0 auto; padding:0 var(--pad);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  grid-template-areas:"h h" "art txt";
  column-gap:56px;
}
.conn-h{
  grid-area:h; margin-top:20px;
  font-size:61px; font-weight:400; letter-spacing:-1.4px; line-height:1.06;
}
.ul{position:relative; display:inline-block}
.ul-img{position:absolute; left:-3%; top:76%; width:106%; height:auto}
.conn-art{grid-area:art; position:relative; min-height:830px}
.art--arrow{position:absolute; left:468px; top:157px; width:200px}
.art--door{position:absolute; left:0; top:313px; width:400px}
.conn-txt{grid-area:txt; position:relative; padding-top:32px; max-width:652px}
.conn-txt p{font-size:41px; line-height:1.17; letter-spacing:-.5px}
.conn-txt p + p{margin-top:48px}
.art--pot{width:161px; margin:40px 0 0 auto}

.arts{
  max-width:1440px; margin:0 auto; padding:120px var(--pad) 0;
  display:grid; grid-template-columns:minmax(0,1fr) 380px 380px; column-gap:40px;
  align-items:start;
}
.arts-side{grid-column:1; grid-row:1; align-self:stretch}
.arts-stick{position:sticky; top:118px}
.arts-stick h2{font-size:61px; font-weight:400; letter-spacing:-1.3px; line-height:1.12}
.arts-stick .btn-fill{margin-top:34px}
.art--lamp{width:360px; margin:34px 0 0 18px}
.arts-col{display:flex; flex-direction:column; gap:56px}
.arts-col--b{grid-column:3; grid-row:1}
.arts-col--a{grid-column:2; grid-row:1; margin-top:216px}

.card img{
  width:100%; height:auto; display:block;
  clip-path:polygon(28px 0,calc(100% - 28px) 0,100% 28px,100% calc(100% - 28px),calc(100% - 28px) 100%,28px 100%,0 calc(100% - 28px),0 28px);
}
.card h3{margin-top:20px; padding-left:20px; font-size:34px; font-weight:400; letter-spacing:-.6px; line-height:1.16}
.card .by{display:block; margin-top:20px; padding-left:20px; font-size:16px; color:#3d3b37}
.card:hover h3{text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px}

.how{max-width:1440px; margin:0 auto; padding:150px var(--pad) 0}
.how-head{display:flex; align-items:flex-start; gap:212px}
.how-head h2{font-size:124px; font-weight:400; letter-spacing:-3.2px; line-height:1.06}
.how-head .scribble{left:-8%; top:50%; width:95%}
.art--cab{width:245px; margin-top:26px; flex:0 0 auto}

.steps{
  margin:36px 88px 0;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px;
}
.step{position:relative; padding:52px 32px 34px; min-height:470px}
.step-frame{
  position:absolute; inset:0; width:100%; height:100%;
  fill:none; stroke:var(--lake-line); stroke-width:1; stroke-dasharray:3 4.6;
}
.step-no{position:absolute; right:24px; top:14px; font-size:16px}
.step-art{display:block; width:270px; max-width:100%; margin:0 auto 22px}
.step h3{font-size:37px; font-weight:400; letter-spacing:-.7px; line-height:1.14}
.step p{margin-top:20px; font-size:20px; line-height:1.34}
.how-cta{display:flex; justify-content:center; margin-top:64px}

.feat{max-width:1440px; margin:0 auto; padding:130px 0 74px; overflow:hidden}
.feat h2{padding:0 120px; font-size:61px; font-weight:400; letter-spacing:-1.4px}
.feat-track{display:flex; width:max-content; margin-top:60px; animation:march 42s linear infinite}
.feat-row{display:flex; align-items:center}
.feat-row img{width:150px; height:150px; object-fit:contain; margin:0 39px; flex:0 0 auto}
@keyframes march{from{transform:translateX(-50%)} to{transform:translateX(0)}}
@media (prefers-reduced-motion:reduce){.feat-track{animation:none}}

.punch{
  height:114px; position:relative;
  background:
    radial-gradient(circle at 26px 50%, transparent 20.5px, var(--lake) 21px, var(--lake) 22.4px, transparent 22.9px) repeat-x;
  background-size:52px 100%;
}
.punch::before,.punch::after{content:""; position:absolute; left:0; right:0; height:1.5px; background:var(--lake)}
.punch::before{top:0}
.punch::after{bottom:0; background:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='2'%3E%3Crect width='4.4' height='1' fill='%232D5C61' fill-opacity='.62'/%3E%3C/svg%3E");
  background-repeat:repeat-x; height:2px;
}

.join{
  --rule:50px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='50'%3E%3Crect width='4.4' height='1' fill='%232D5C61' fill-opacity='.62'/%3E%3C/svg%3E");
  padding:74px 0 0;
}
.join-inner,.join{position:relative}
.join{
  max-width:none;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,707px);
  align-items:end; column-gap:20px;
  padding-left:var(--pad); padding-right:var(--pad);
}
.join-txt{max-width:700px; padding-bottom:96px}
.join-txt h2{font-size:124px; font-weight:400; letter-spacing:-3.2px; line-height:1.06}
.scribble--join{left:-5%; top:34%; width:100%}
.join-txt p{margin-top:6px; font-size:41px; line-height:1.17; letter-spacing:-.5px; max-width:700px}
.join-txt .btn-fill{margin-top:44px}
.art--chair{width:100%; max-width:707px; margin-left:auto}

.foot{position:relative; margin-top:120px}
.foot-sheets{
  position:relative; z-index:3;
  max-width:1440px; margin:0 auto; padding:0 76px;
  display:flex; align-items:flex-start;
}
.sheet{background:var(--paper); padding:28px 50px 34px; position:relative}
.sheet h5{font-size:20px; font-weight:600; letter-spacing:-.2px}
.sheet a{display:block; margin-top:18px; font-size:16px; transition:color .18s ease}
.sheet a:hover{color:var(--marker)}
.sheet-h2{margin-top:34px}
.sheet--legal{width:379px; margin-top:44px; border:1px solid var(--lake-line); padding-top:38px}
.sheet--about{width:380px; margin-left:-60px; border:1px dashed var(--lake-line)}
.dogear{
  position:absolute; right:0; bottom:0; width:48px; height:48px;
  background:linear-gradient(to bottom left,var(--marker) 50%,transparent 50.5%);
}
.foot-blue{
  margin-top:-330px; padding-top:330px;
  background:var(--lake); color:#F1ECE2; position:relative;
}

.foot-blue::before{
  content:""; position:absolute; left:0; right:0; top:0; height:12px;
  background:radial-gradient(circle at 16.85px 0, var(--paper) 10.4px, transparent 10.9px) repeat-x;
  background-size:33.7px 12px;
}
.foot-blue-in{max-width:1440px; margin:0 auto; padding:0 76px 40px; position:relative}
.foot-blue-in::before{
  content:""; position:absolute; left:772px; top:0; bottom:0; width:1px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2' height='9'%3E%3Crect width='1' height='4.4' fill='%23ffffff' fill-opacity='.5'/%3E%3C/svg%3E");
  background-repeat:repeat-y;
}
.foot-big{
  margin-left:796px; padding-top:98px;
  font-size:54px; font-weight:400; line-height:1.48; letter-spacing:-1px;
}
.foot-bottom{display:flex; align-items:flex-end; gap:40px; margin-top:118px}
.foot-legal{flex:0 0 759px}
.foot-legal span{display:block; font-size:19px}
.foot-legal small{display:block; margin-top:4px; font-size:13px}
.foot-legal small a{text-decoration:underline; text-underline-offset:2px}
.socials{display:flex; gap:15px}
.socials a{
  width:29px; height:29px; border:1.4px solid #F1ECE2; border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  transition:background .18s ease;
}
.socials a img{width:15px; height:15px; filter:brightness(0) invert(1)}
.socials a:hover{background:rgba(255,255,255,.2)}
.foot-mark{width:69px; margin-left:auto; margin-right:-32px; filter:brightness(0) invert(1); opacity:.95}

@media (max-width:1200px){
  .arts{grid-template-columns:minmax(0,1fr) 320px 320px}
  .how{padding-left:64px; padding-right:64px}
  .steps{margin-left:0; margin-right:0}
  .feat h2{padding:0 64px}
  .foot-blue-in{padding:0 40px 40px}
  .foot-big{margin-left:0}
  .foot-blue-in::before{display:none}
  .foot-legal{flex:1 1 auto}
  .foot-mark{margin-right:0}
}

@media (max-width:1080px){
  :root{--pad:24px}
  .nav,.btn-ghost{display:none}
  .burger{display:block}

  
  .hero{padding-bottom:0}
  .hero-in{height:auto; padding:0}
  .hero-env{display:none}
  .letter{
    position:static; height:auto; width:auto;
    padding:74px 40px 96px 50px; margin:0 auto;
  }
  .q{font-size:30.5px}
  .field{margin-top:38px}
  .field input{font-size:23px}
  .stamp{position:absolute; right:36px; left:auto; top:24px; width:118px}
  .note{
    position:relative; right:auto; top:auto; width:min(430px,86vw); margin:0 auto 90px;
    transform:rotate(-1.2deg); padding:45px 40px 45px;
  }
  .note h2{font-size:30px}
  .field--note{margin-top:26px}
  .field--note input{font-size:24px}
  .scallop-line{display:none}

  .typer{font-size:56px; letter-spacing:-1.4px}
  .room{padding-top:56px}
  .art--room{margin-top:34px}

  
  .conn{grid-template-columns:minmax(0,1fr); grid-template-areas:"h" "txt"}
  .conn-h{font-size:38px; margin-top:60px; letter-spacing:-.8px}
  .conn-art{display:none}
  .conn-txt{padding-top:22px; max-width:none}
  .conn-txt p{font-size:15px; line-height:1.42; letter-spacing:0}
  .conn-txt p + p{margin-top:22px}
  .art--pot{width:120px; margin-top:26px}

  
  .arts{grid-template-columns:minmax(0,1fr); padding-top:74px; row-gap:0}
  .arts-side{grid-column:1}
  .arts-stick{position:static; display:grid; grid-template-columns:1fr auto; align-items:start}
  .arts-stick h2{font-size:40px; letter-spacing:-.8px}
  .arts-stick .btn-fill{grid-column:1; justify-self:start; height:52px}
  .art--lamp{grid-column:2; grid-row:1 / span 2; width:min(190px,32vw); margin-top:0}
  .arts-col{grid-column:1; display:contents}
  .arts-col--a{margin-top:0}
  .card{
    display:grid; grid-template-columns:72px minmax(0,1fr); column-gap:24px;
    align-items:start; margin-top:46px;
  }
  .card img{
    grid-row:1 / span 2; width:72px; height:72px; object-fit:cover;
    clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px);
  }
  .card h3{margin-top:0; padding-left:0; font-size:21px; letter-spacing:-.2px}
  .card .by{margin-top:10px; padding-left:0; font-size:15px}

  .how{padding:96px 24px 0}
  .how-head{display:block}
  
  .how-head h2{font-size:42px; letter-spacing:-1px}
  .how-head h2 br{display:none}
  
  .how-head .scribble{left:-13%; top:118%; width:79%}
  .art--cab{width:190px; margin:22px 0 0 auto}
  .steps{grid-template-columns:minmax(0,1fr); gap:22px; margin:34px 0 0}
  .step{min-height:0; padding:48px 26px 30px}
  .step-frame{stroke-dasharray:3 4.6}
  .step-art{width:230px}
  .step h3{font-size:26px}
  .how-cta{margin-top:44px}

  .feat{padding-top:88px}
  .feat h2{padding:0 24px; font-size:44px}
  .feat-row img{width:110px; height:110px; margin:0 26px}
  .punch{height:86px; background-size:44px 100%;
    background-image:radial-gradient(circle at 22px 50%, transparent 17px, var(--lake) 17.5px, var(--lake) 18.9px, transparent 19.4px);}

  .join{grid-template-columns:minmax(0,1fr); padding-top:58px}
  .join-txt{padding-bottom:34px}
  .join-txt h2{font-size:42px; letter-spacing:-1px}
  .join-txt h2 br{display:none}
  
  .scribble--join{left:-91%; top:80%; width:91%}
  .join-txt p{font-size:20px}
  .art--chair{width:min(560px,92%); margin:0 auto}

  .foot{margin-top:80px}
  .foot-sheets{display:block; padding:0 24px}
  .sheet{width:auto !important; margin:0 !important}
  .sheet--legal{border-bottom:0}
  .foot-blue{margin-top:-260px; padding-top:260px}
  .foot-blue-in{padding:0 32px 40px}
  .foot-big{padding-top:56px; font-size:40px; line-height:1.6; letter-spacing:-.6px}
  .foot-bottom{display:flex; flex-direction:column; align-items:flex-start; gap:20px; margin-top:34px}
  .socials{order:1}
  .foot-legal{order:2; flex:0 0 auto}
  .foot-mark{order:3; display:block; width:56px; margin:6px 0 0 auto}
}

@media (max-width:640px){
  :root{--pad:32px}
  .letter{padding:130px 32px 145px 50px}
  .q{font-size:30px}
  .q .scribbled{display:inline}
  .q .scribble{display:none}
  .field input{font-size:22px}
  .stamp{width:120px; right:24px; left:auto; top:14px}
  .conn-h{font-size:40px; letter-spacing:-.9px}
  .conn-txt p{font-size:16.5px}
  .note{width:100%; margin:0 0 74px; transform:none; padding:74px 33px 62px}
  .note h2{font-size:27px}
  .field--note input{font-size:23px}
  .typer{font-size:34px; letter-spacing:-.8px}
  
  .arts-stick h2{font-size:30px; grid-column:1 / -1}
  .arts-stick .btn-fill{grid-row:2; grid-column:1}
  .art--lamp{grid-column:2; grid-row:2; width:min(150px,40vw); margin:0 0 0 auto}
  .card{grid-template-columns:66px minmax(0,1fr); column-gap:18px}
  .card img{width:66px; height:66px}
  .card h3{font-size:19px}
  
  .how-head h2{font-size:36px; letter-spacing:-.8px}
  .how-head h2 br{display:inline}
  .how-head .scribble{left:-8%; top:50%; width:95%}
  .art--cab{width:140px}
  .step h3{font-size:23px}
  .step p{font-size:17px}
  .feat h2{font-size:33px}
  .feat-row img{width:86px; height:86px; margin:0 18px}
  
  .join-txt h2{font-size:36px; letter-spacing:-.8px}
  .join-txt h2 br{display:inline}
  .scribble--join{left:9%; top:97%; width:48%}
  .join-txt p{font-size:17px}
  .btn-fill{height:50px; font-size:16px; padding:0 20px}
  .foot-big{font-size:29px}
  .foot-legal span{font-size:16px}
  .sheet{padding:24px 24px 30px}
}

.serif,.q,.typer,.conn-h,.conn-txt p,.arts-stick h2,.card h3,.how-head h2,.step h3,.feat h2,.join-txt h2,.join-txt p,.foot-big,.note h2{
  font-family:"Newsreader",Georgia,"Times New Roman",serif; font-optical-sizing:auto;
}
@media (min-width:1081px){
  .typer,.how-head h2,.join-txt h2{letter-spacing:-2.6px}
  .conn-h,.arts-stick h2,.feat h2{letter-spacing:-1px}
}

.logo{display:flex; flex-direction:column; line-height:1; text-transform:uppercase; letter-spacing:.14em; font-weight:600}
.logo b{font-size:15px; font-weight:600}
.logo small{font-size:10.5px; font-weight:500; margin-top:3px; letter-spacing:.32em; position:relative; padding-bottom:6px}
.logo small::after{content:""; position:absolute; left:0; right:.3em; bottom:0; height:5px; background:url("assets/wave.svg") repeat-x left center/24px 5px}

.hero-env{height:auto}
.stamp{
  padding:7px; background:#FFFDF8; height:auto;
  -webkit-mask:linear-gradient(#000 0 0) content-box,radial-gradient(circle at 6px 6px,transparent 3.6px,#000 4px) -6px -6px/12px 12px;
          mask:linear-gradient(#000 0 0) content-box,radial-gradient(circle at 6px 6px,transparent 3.6px,#000 4px) -6px -6px/12px 12px;
  box-sizing:border-box; transform:rotate(-4deg);
}
html{scroll-padding-top:74px}
.btn-note{min-width:0}
.letter .field input::placeholder{color:#6B675F}
.note h2,.card h3,.step h3,.conn-h{text-wrap:balance}
.note .sent{display:block; margin-top:14px; font-size:14px; opacity:0; transition:opacity .3s ease}
.note.is-sent .sent{opacity:.92}

.art--photo{clip-path:polygon(22px 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 22px),calc(100% - 22px) 100%,22px 100%,0 calc(100% - 22px),0 22px)}
.art--photo .art-photo{
  clip-path:polygon(-40% 0,-40% 0,-75% 100%,-75% 100%);
  transition:clip-path calc(var(--d,1.4) * 1s) cubic-bezier(.32,.6,.3,1) calc(var(--t,0) * 1s);
}
.art--photo.is-in .art-photo{clip-path:polygon(-40% 0,140% 0,105% 100%,-75% 100%)}
.art--arrow .art-part{position:relative}
.step-art{aspect-ratio:540/367; object-fit:cover; height:auto;
  clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px)}
.stamp,.card img{object-fit:cover}
@media (prefers-reduced-motion:reduce){.art--photo .art-photo{transition:none}}

.chip{
  width:150px; height:150px; margin:0 39px; flex:0 0 auto; border-radius:50%;
  border:1.5px solid var(--lake); color:var(--lake);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  font-size:15px; line-height:1.2; padding:0 14px;
}
.chip b{display:block; font-family:"Newsreader",Georgia,serif; font-weight:400; font-size:40px; line-height:1; letter-spacing:-1px; margin-bottom:6px}

.foot-mark{height:auto}
.socials a img{filter:none}
.foot-legal small + small{margin-top:10px}

@media (max-width:1080px){
  .chip{width:110px; height:110px; margin:0 26px; font-size:12.5px}
  .chip b{font-size:30px}
  body.menu-open .nav{
    display:flex; position:fixed; left:0; right:0; top:74px; z-index:59;
    flex-direction:column; gap:20px; padding:26px var(--pad) 30px;
    background:var(--paper); border-bottom:1px dashed var(--lake-line);
  }
  body.menu-open .nav a{font-size:20px}
}
@media (max-width:640px){
  .chip{width:86px; height:86px; margin:0 18px; font-size:10.5px; padding:0 8px}
  .chip b{font-size:24px; margin-bottom:3px}
}